iMessage URL - Changing website favicon dynamically using JavaScript

Question

I have a web application that is branded according to the host name and the favicon is updated based on webpage host name.

when the url of the webpage is send as iMessage, the message is displaying the default icon instead of dynamically set icon. Not able to read the hostname when the webpage url is sent as iMessage.

HTML:

<link rel='icon' id="appIcon" type='image/x-icon' href=''>

SCRIPT:

favIcon = document.querySelector('#appIcon');

if (host.includes('light.org')) {
  favIcon.href = 'https://www.light.org/favicon.ico';
} else {
  favIcon.href = 'https://www.dark.org/favicon.ico';
}

When the url https://www.light.org is sent as iMessage, dark icon is displayed instead of light.

Is there a way to read the host or url from iMessage and set the icon dynamically?