后端跨域的问题

在前端调用api的时候无法获得Flask本地服务器后端返回的json数据,在浏览器控制台爆出了

No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access.

大致意思好像是访问没被允许

事情原因

我参照https://www.taniarascia.com/how-to-connect-to-an-api-with-javascript/
去学习api的知识
在修改了js请求后端发过来的json数据后无法访问，爆出了刚才的错误

先开始不知道是怎么回事，前端一直无法获得json数据，但是请求时对的，
找了好久，差点误入歧途，全都是关于前端怎么跨域访问的教程，完全是借助相关的漏洞获取没有被允许的数据资源，

解决

后端跨域访问数据是需要后端允许的，官方是通过CORS放权解决
它会在你发送下面几种HTTP请求时触发：

• 不同的域名 （比如在网站 example.com 请求 api.com)
• 不同的子域名 （比如在网站 example.com 请求 api.example.com)
• 不同的端口 （比如在网站 example.com 请求 example.com:3001)
• 不同协议 （比如在网站 https://example.com 请求 http://example.com)
  这个机制阻止攻击者在一些网站上放置js脚本

1. 安装 flask-cors

   pip install flask-cors

2. 导入包

   from flask_cors import CORS

3. 全局数据app应用的数据

   app = Flask(name)
   CORS(app)

再次请求

运行index.html文件

OK了