Question

当前，我正在尝试为自己的chrome扩展程序发出发布请求，并且在控制台中，我一直收到Fetch Failed作为响应。

popup.html

<!DOCTYPE html>
<html>
  <head>
    <title>Tube Hunt: Community Curated YouTube Recommendations</title>
    <script src="popup.js"></script>
  </head>
  <body style="width: 15rem; height: 15rem">
    <div class="container-fluid" style="padding: 10px">
      <a
        href="https://www.reddit.com/r/TubeHunt/"
        target="_blank"
        class="badge badge-secondary"
        >/r/TubeHunt</a
      >
      <form
        name="inputForm"
        action="https://us-central1-tube-hunt.cloudfunctions.net/app/api/channel/submit"
        method="POST"
      >
        <input
          id="url"
          value="https://www.youtube.com/c/PickUpLimes"
          name="url"
        />
        <button type="submit" id="newDetails">Submit</button>
      </form>
      <button type="button" id="getChannels">Get Channels</button>
    </div>
  </body>
</html>

popup.js

btn.addEventListener("click", function (e) {
      e.preventDefault();
      if (url.value) {
        console.log(url.value);
        let data = new FormData();
        const myHeaders = new Headers({
          Accept:"application/json, application/xml, text/plain, text/html
        });
        const baseURL ="myurl";
        data.append("url", `${url.value}`);
        fetch(baseURL, {
          headers: myHeaders,
          method: "POST",
          body: data,
          mode: 'cors'
        })
          .then((res) => {
            console.log(res)
            return res.text()
          })
          .then((html) => console.log(html))
          .catch(function (err) {
            console.log("Problem");
            console.log(err);
          });
      }
    });

根据要求，这里是manifest.json。如您所见，我在这里添加了服务器的权限。

{
    "manifest_version": 2,
    "name": "Tube Hunt",
    "version": "0.1",
    "content_scripts": [
        {
            "matches": [
                "https://www.youtube.com/*"
            ],
            "js": [
                "jquery.min.js",
                "content.js",
                "background.js"
            ]
        }
    ],
    "background": {
        "scripts": [
            "background.js"
        ]
    },
    "browser_action": {
        "default_icon": "download.png",
        "default_popup": "popup.html"
    },
    "permissions":[
        "https://us-central1-tube-hunt.cloudfunctions.net/app/api/*"
    ]
}

目前，我可以访问服务器，但从中获取错误代码500。我能够成功执行GET请求，而不能执行POST请求。除了我的研究之外，我还发现this link的获取没有太大帮助。

Answer 1

终于解决了！感谢@wOxxOm的所有帮助。

结果是我一直收到500错误，因为我完全忘记了我的合作伙伴设置服务器/数据库时对其进行了设置，因此特定频道不能有相同的正文内容。除此之外，上面的代码对我有用。感谢您的所有帮助！

无法获取Chrome扩展程序的发布请求

1 个答案: