目前我正在尝试对我的chrome扩展进行post请求，并且我一直在控制台中获得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请求。除了我的研究，我还发现了这个获取链接，但没有多大帮助。
终于解决了！感谢@wOxxOm对您的帮助。
事实证明，我一直收到500错误，因为我完全忘记了我的服务器/数据库设置伙伴设置了它，这样特定频道就不能有相同的正文内容。除此之外，上面的代码对我有效。谢谢你的帮助！