如果用戶在地址欄中手動輸入我們的 url，模態不會顯示

Question

當用戶從外部鏈接（即 Google 搜索結果）訪問我們的頁面時，我創建的模態顯示，但如果用戶通過在地址欄中手動輸入我們的 URL 進入我們的網站，則會發生錯誤並且模態不會出現。

這是我的代碼：

  const siteUrl = ["website.com"];
  const referrer_hostname = new URL(document.referrer).hostname;

  if (siteUrl.includes(referrer_hostname)) {
    console.log("Don't Show Modal", document.referrer);
  } else {
    console.log("Show Modal", document.referrer);

    $( window ).on('load', function() {
      console.log("closure modal firing");
      $('#closureModal').modal({
        backdrop: 'static',
        keyboard: false,
        show: true
      });
    });

#closureModal連接到模態的 HTML。

錯誤：（ (index):123 Uncaught TypeError: Failed to construct 'URL': Invalid URL

Answer 1

當您在地址欄中輸入 URL 時，document.referrer 是一個空字符串“”。 嘗試添加驗證：

const referrer_hostname = document.referrer !== "" ? new URL(document.referrer).hostname : "";

這使您可以避免 TypeError