Fetch API 在本地主机上托管时因 NetworkError 拒绝(仅限 Firefox)
Fetch API rejects with NetworkError when hosted on localhost (Firefox only)
我在使用提取 API 时在 Firefox 上看到奇怪的行为。我不知道我是否做错了什么,或者我是否遗漏了一些文档并且不允许我尝试做的事情。
如果我在本地主机上托管以下页面,Firefox 会拒绝抓取并给出 TypeError: NetworkError when attempting to fetch resource.
我在开发工具或 Wireshark 中都没有看到任何抓取请求。似乎没有任何进一步的调试可用于诊断。
"hosting on localhost" 是指由本地 Web 服务器(在本例中为 nginx)托管,而不是来自文件系统。例如,地址栏显示“http://localhost/fetch_localhost_error.html”。
在 http://jsbin.com/yowebiyigi/edit?html,output 或任何其他端点托管相同的页面会提供预期的输出 - 文本出现在 div 中,我看到在开发工具中发出了提取请求。
Chrome 在这两种情况下都能正常工作,这意味着本地主机和远程服务器都为 CORS 等正确配置(但 FF 似乎永远不会查询远程)。
我已经在 Windows 7 上尝试了 48 和 Nightly (51)。不幸的是,我现在无法访问任何其他 OS。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="output"></div>
<div id="error"></div>
<script>
var result = fetch('http://www.randomtext.me/api/')
result.then(
function(response){
return response.json()
})
.then(
function (response) {
document.getElementById("output").innerHTML = response.text_out;
})
.catch(
function(error){
document.getElementById("error").innerHTML = error;
});
</script>
</body>
</html>
这非常令人沮丧,因为我无法在本地开发基于提取的解决方案。任何人都可以阐明正在发生的事情吗?
原来我遇到了配置问题。
network.http.referer.XOriginPolicy
应设置为 0,否则获取将失败。由于我不记得的原因,我将它设置为 1。
在我的案例中,这就是该死的 AdBlock。浪费了3个小时...
希望有人能早点找到这个。
我遇到的问题是我在本地(在我的开发环境中)获取的 API 的证书无效。为了解决这个问题,我直接用 Firefox 访问 API 并为它们添加了安全例外。
还要仔细检查您查询的终点是否正确。刚意识到我的端口号少了 1 个字符,这就是 waster
我在使用提取 API 时在 Firefox 上看到奇怪的行为。我不知道我是否做错了什么,或者我是否遗漏了一些文档并且不允许我尝试做的事情。
如果我在本地主机上托管以下页面,Firefox 会拒绝抓取并给出 TypeError: NetworkError when attempting to fetch resource.
我在开发工具或 Wireshark 中都没有看到任何抓取请求。似乎没有任何进一步的调试可用于诊断。
"hosting on localhost" 是指由本地 Web 服务器(在本例中为 nginx)托管,而不是来自文件系统。例如,地址栏显示“http://localhost/fetch_localhost_error.html”。
在 http://jsbin.com/yowebiyigi/edit?html,output 或任何其他端点托管相同的页面会提供预期的输出 - 文本出现在 div 中,我看到在开发工具中发出了提取请求。
Chrome 在这两种情况下都能正常工作,这意味着本地主机和远程服务器都为 CORS 等正确配置(但 FF 似乎永远不会查询远程)。
我已经在 Windows 7 上尝试了 48 和 Nightly (51)。不幸的是,我现在无法访问任何其他 OS。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="output"></div>
<div id="error"></div>
<script>
var result = fetch('http://www.randomtext.me/api/')
result.then(
function(response){
return response.json()
})
.then(
function (response) {
document.getElementById("output").innerHTML = response.text_out;
})
.catch(
function(error){
document.getElementById("error").innerHTML = error;
});
</script>
</body>
</html>
这非常令人沮丧,因为我无法在本地开发基于提取的解决方案。任何人都可以阐明正在发生的事情吗?
原来我遇到了配置问题。
network.http.referer.XOriginPolicy
应设置为 0,否则获取将失败。由于我不记得的原因,我将它设置为 1。
在我的案例中,这就是该死的 AdBlock。浪费了3个小时...
希望有人能早点找到这个。
我遇到的问题是我在本地(在我的开发环境中)获取的 API 的证书无效。为了解决这个问题,我直接用 Firefox 访问 API 并为它们添加了安全例外。
还要仔细检查您查询的终点是否正确。刚意识到我的端口号少了 1 个字符,这就是 waster