怎么使用响应不透明的API?

本教程将介绍如何使用响应不透明的API?的处理方法,这篇教程是从别的地方看到的,然后加了一些国外程序员的疑问与解答,希望能对你有所帮助,好了,下面开始学习吧。

怎么使用响应不透明的API? 教程 第1张

问题描述

我尝试这样使用Cat Facts API:

const URL = "https://catfact.ninja/fact?limit=1" // In browser, this displays the JSON

fetch(URL).then(response=> {
  console.log(response);
  return response.json();
 }
);

但我收到了

跨域请求被阻止:同源策略不允许读取https://catfact.ninja/fact?limit=1处的远程资源。(原因:CORS标头‘Access-Control-Allow-Origin’丢失)。

TypeError:尝试提取资源时出现NetworkError。

所以在尝试后

fetch(URL, {mode:'no-cors'})
 .then(response=> {
  console.log(response);
  return response.json();
 }
);

我现在得到

返回{type:"不透明",url:"",重定向:false,status:0,ok:false,statusText:"",Headers:Headers,Body:null,bodyUsed:False}

语法错误:JSON.parse:JSON数据的第1行第1列出现意外的数据结尾

我从here了解到我将无法按预期使用此接口。但如果是,它的用途是什么,打算怎么使用(this信息不说明问题)?

推荐答案

不透明响应是您看不到其内容的响应。它们本身没有任何用处。

设置mode: 'no-cors'是一个声明,表示您不需要读取响应(或执行任何其他需要CORS权限的操作)。

例如,JavaScript可能正在发送要由服务器记录的分析数据。

模式的好处是,它允许您发送数据,而不会收到JS控制台中报告的异常(如果有人打开它,这将(A)看起来很糟糕,(B)控制台中会堆满垃圾,使您很难找到真正的错误)。


如果需要访问响应,请不要设置mode: 'no-cors'。如果是跨域请求,则需要使用some other technique to bypass the Same Origin Policy。


side:"Access-Control-Allow-Origin": "*"是响应头。请勿将其放在请求中。它不会做任何有用的事情,并且可能会将简单的请求转换为预飞行的请求。

好了关于怎么使用响应不透明的API?的教程就到这里就结束了,希望趣模板源码网找到的这篇技术文章能帮助到大家,更多技术教程可以在站内搜索。