如何处理来自 'opaque' 类型的获取响应?
how to process fetch response from an 'opaque' type?
我正在尝试正确解释对 URL 的提取调用的响应,我认为它是 json 字符串。我已经根据此处的类似帖子尝试了许多变体,但没有任何东西可以让我使用有用的数据。这是一种尝试:
fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
.then(function(response) {
response.json().then(function(data) {
console.log('data:' + data);
});
})
.catch(function(err) {
console.log('Fetch Error :-S', err);
});
这 returns 控制台中的语法错误:
SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of
the JSON data
所以也许它不是 JSON...如果我在 console.log 行上放置一个断点,并将鼠标悬停在响应(上面的行)上,我会看到响应对象(?)各个领域:
不确定如何解释...status:0 表明它没有得到有效响应。但是,如果我检查开发人员工具中的“网络”选项卡,然后单击获取行,状态为 200,并且响应 window/JSON 部分显示消息信息,如果您只是将 URL直接进入浏览器URL吧。与显示 JSON 字符串的 "Response payload" 部分一样:
{"msg": "API is ready.", "success": true}
所以...看起来像 json,不是吗?但是 fetch 无法将其提取为 json?
这是另一种变体,但使用 response.text() 而不是 response.json()
fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
.then((response) => {
console.log(response);
response.text().then((data) => {
console.log("data:" + data);
});
});
这会在控制台中打印响应对象(与上面相同:ok: false、status:0、type:opaque 等)。第二个 console.log 文件在 data: 之后不打印任何内容。如果我使用 response.json,我会再次收到关于数据结尾的语法错误,如上所示。
有什么想法吗?我意识到服务器可能没有提供 fetch 需要或想要的东西,但是,它确实提供了一些信息(至少在浏览器中直接使用 URL 时),这是我需要处理的,因为 json 或文本或其他内容。
本质上,您不能从不透明请求访问响应主体。
Adding mode: 'no-cors' won’t magically make things work. Browsers by
default block frontend code from accessing resources cross-origin. If
a site sends Access-Control-Allow-Origin in its responses, then
browsers will relax that blocking and allow your code to access the
response.
But if a site doesn’t send the Access-Control-Allow-Origin header in
its responses, then there’s no way your frontend JavaScript code can
directly access responses from that site. In particular, specifying
mode: 'no-cors' won’t fix that (in fact it’ll just make things worse).
来自
也来自 fetch
文档:
no-cors — Prevents the method from being anything other than HEAD, GET
or POST, and the headers from being anything other than simple
headers. If any ServiceWorkers intercept these requests, they may not
add or override any headers except for those that are simple headers.
In addition, JavaScript may not access any properties of the resulting
Response. This ensures that ServiceWorkers do not affect the semantics
of the Web and prevents security and privacy issues arising from
leaking data across domains.
https://developer.mozilla.org/en-US/docs/Web/API/Request/mode
我正在尝试正确解释对 URL 的提取调用的响应,我认为它是 json 字符串。我已经根据此处的类似帖子尝试了许多变体,但没有任何东西可以让我使用有用的数据。这是一种尝试:
fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
.then(function(response) {
response.json().then(function(data) {
console.log('data:' + data);
});
})
.catch(function(err) {
console.log('Fetch Error :-S', err);
});
这 returns 控制台中的语法错误:
SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data
所以也许它不是 JSON...如果我在 console.log 行上放置一个断点,并将鼠标悬停在响应(上面的行)上,我会看到响应对象(?)各个领域:
不确定如何解释...status:0 表明它没有得到有效响应。但是,如果我检查开发人员工具中的“网络”选项卡,然后单击获取行,状态为 200,并且响应 window/JSON 部分显示消息信息,如果您只是将 URL直接进入浏览器URL吧。与显示 JSON 字符串的 "Response payload" 部分一样:
{"msg": "API is ready.", "success": true}
所以...看起来像 json,不是吗?但是 fetch 无法将其提取为 json?
这是另一种变体,但使用 response.text() 而不是 response.json()
fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
.then((response) => {
console.log(response);
response.text().then((data) => {
console.log("data:" + data);
});
});
这会在控制台中打印响应对象(与上面相同:ok: false、status:0、type:opaque 等)。第二个 console.log 文件在 data: 之后不打印任何内容。如果我使用 response.json,我会再次收到关于数据结尾的语法错误,如上所示。
有什么想法吗?我意识到服务器可能没有提供 fetch 需要或想要的东西,但是,它确实提供了一些信息(至少在浏览器中直接使用 URL 时),这是我需要处理的,因为 json 或文本或其他内容。
本质上,您不能从不透明请求访问响应主体。
Adding mode: 'no-cors' won’t magically make things work. Browsers by default block frontend code from accessing resources cross-origin. If a site sends Access-Control-Allow-Origin in its responses, then browsers will relax that blocking and allow your code to access the response.
But if a site doesn’t send the Access-Control-Allow-Origin header in its responses, then there’s no way your frontend JavaScript code can directly access responses from that site. In particular, specifying mode: 'no-cors' won’t fix that (in fact it’ll just make things worse).
来自
也来自 fetch
文档:
no-cors — Prevents the method from being anything other than HEAD, GET or POST, and the headers from being anything other than simple headers. If any ServiceWorkers intercept these requests, they may not add or override any headers except for those that are simple headers. In addition, JavaScript may not access any properties of the resulting Response. This ensures that ServiceWorkers do not affect the semantics of the Web and prevents security and privacy issues arising from leaking data across domains.
https://developer.mozilla.org/en-US/docs/Web/API/Request/mode