javascript – In Reactjs when i share the link from android to ios on telegram the url open but now able to see anything

const referralURL = "MY_URL";

const handleShareLink = async () => {
  const shareMessage = `Sign Up for free shirts! ${referralURL}`;

  let file = null;
  try {
    const imgRes = await fetch("/mixygo.png");
    if (imgRes.ok) {
      const blob = await imgRes.blob();
      file = new File([blob], "logo.png", { type: blob.type });
    }
  } catch (err) {
    console.warn("Could not load image for sharing:", err);
  }

  const canShareFiles =
    navigator.canShare &&
    file &&
    navigator.canShare({ files: [file] });

  if (navigator.share) {
    try {
      const shareData = {
        title: "Refer a person",
        text: "Sign Up for shirts!",
        url: referralURL,
      };

      if (canShareFiles) {
        shareData.files = [file];
      }

      await navigator.share(shareData);
      return;
    } catch (error) {
      console.error("Sharing failed:", error);
    }
  }

  try {
    await navigator.clipboard.writeText(shareMessage);
    alert("Referral link copied!");
  } catch {
    prompt("Copy your referral link:", shareMessage);
  }
};

Telegram on iOS uses a WKWebView, which is more limited than normal Safari. If your app throws a JavaScript error there (for example using unsupported APIs like localStorage, Notification, service workers, or assuming window/navigator features always exist), the whole SPA can fail and show only a blank screen.

To debug it, open the link in Telegram on iOS, then use Safari’s Web Inspector (Settings → Safari → Advanced → Web Inspector) from a Mac to see the console errors for that webview. Also try opening a very simple test page on the same domain to confirm that only your app (and not the host) is failing.

In short: the link and Web Share API are fine; you need to find and fix the JS error or unsupported API that only breaks in Telegram’s iOS webview.