Javascript - 如何静默检索不响应 fetch() 请求的网页源

Question

我有一个 Firefox/Chrome 网络扩展。当用户单击扩展程序的按钮时，扩展程序应检索动态生成的 URL 的文本。因为我正在编写 Web 扩展，所以我无法控制此 URL。

下面是一个应该(但不应该)发生的例子:

1) 用户点击我的扩展按钮

2) 扩展程序生成以下 URL - 每次单击扩展程序的按钮时，此 URL 都会更改:

示例网址:

https://smmry.com/sm_portal.php?&SM_TOKEN=2635119454&SM_POST_SAVE=0&SM_REDUCTION=-1&SM_CHARACTER=-1&SM_LENGTH=7&SM_URL=http://money.cnn.com/2018/04/03/investing/amazon-stock-widely-held/index.html

3) 扩展程序检索该 URL 处的文件文本并对其执行某些操作。

这是我的代码的简化版本:

<Insert_Code_That_Generates_URL and assigns it to generatedURL variable>
console.log("Fetching tokenSite");
fetch(generatedURL).then((response) => {
                console.log("Token site fetched");
                console.log(response);
            })

然而，实际发生的情况如下:

但是，我可以成功地手动打开 URL 或使用 browser.tabs.create({ url: generatedURL}); 在新页面中打开 URL。

我怀疑服务器正在阻止 fetch() 请求工作，因为它来自扩展。

我可以通过哪些方式检索位于该 URL 的文件的文本？

有人建议在 iFrame 中加载 URL，但我不知道该怎么做(尤其是在 Web 扩展的上下文中)。因此，举个例子会很有帮助。

旁注 - 一旦控制台甚至没有记录“ token 站点已获取”，XHR 请求就永远不会有响应。

这是我的manifest.json

{
"manifest_version": 2,
    "name": "Summarizer",
    "version": "1.0",

    "description": "Summarizes webpages",

    "permissions": [
        "tabs",
        "downloads",
        "*://*.smmry.com/*"
    ],

    "icons": {
        "48": "icons/border-48.png"
    },

    "browser_action": {
        "browser_style": true,
        "default_popup": "popup/choose_page.html",
        "default_icon": {
            "16": "icons/summarizer-icon-16.png",
            "32": "icons/summarizer-icon-32.png"
        }
    }
}

Answer 1

fetch 返回 Response对象，而不是响应内容本身，所以这样记录流是行不通的——你需要先解析流，比如:

fetch(generatedURL).then((response) => {
  console.log("Token site responded");
  return response.text();
}).then(responseText => {
  console.log("Token site parsed");
  console.log(responseText);
});

见

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch