从 Angular 前端到 json-server 的 GET 调用访问被 CORS 策略阻止的 XMLHttpRequest

Posted 2023-03-04

【中文标题】从 Angular 前端到 json-server 的 GET 调用访问被 CORS 策略阻止的 XMLHttpRequest

【英文标题】：GET call from Angular frontend to json-server Access to XMLHttpRequest blocked by CORS policy

【发布时间】：2019-06-06 07:13:39

【问题描述】：

我在我的本地主机上有一个角度前端客户端，并尝试对也在我的本地主机上运行的 json-server 进行 GET 调用，以获取一些数据，因为在视图上填充表格。

表格仍然是空的，我在 chrome 控制台上收到此错误：

“从源 'http://localhost:3001' 访问 XMLHttpRequest 在 'localhost:3000/cilas' 已被 CORS 策略阻止：跨源请求仅支持协议方案：http、data、chrome、chrome-extension、https 。”

添加了标题属性“Access-Control-Allow-Origin”：“*”但没有结果，我还通过安装插件在 google chrome 上启用了跨源资源共享，服务器端我只运行 json- server --watch src/data/document.json 所以没有写任何代码只是将一些数据放在文件文档上，但问题似乎出在客户端。

//这里是调用和头部客户端：

标题 = 新标题（ '接受': '应用程序/json', '内容类型'：'应用程序/json'， '访问控制允许来源'：'*' );

return this.http.get(pathUrl, headers: headers ).map(res => res.json());

【参考方案1】：

已解决。

我的网址必须是： 'http://localhost:3000/cilas'

而不是： 'localhost:3000/cilas'

错误地认为 http 是隐式的......