【Azure 环境】前端Web通过Azure AD获取Token时发生跨域问题(CORS Error)

2024-08-24 43

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 【Azure 环境】前端Web通过Azure AD获取Token时发生跨域问题(CORS Error)

问题描述

前端Web在开发时使用Azure AD中注册Application的方式进行Token获取，遇到了CORS遇到的问题(如下图)。随后在AAD增加了单页应用的重定向URL, 依旧还是出现CORS Error问题。

CORS Error:

Access to XMLHttpRequest at 'https://login.chinacloudapi.cn/XXXXXXXXXXXXXXXXXXXXXXX/oauth2/v2.0/token'
from origin 'http://localhost:9005' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. 
The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

问题解决

根据错误信息，需要在请求的Header中添加 Access-Control-Allow-Origin 并把值设置为 * 或者是当前请求的URL，如“http://localhost:9005”。 这种方式是通过前端来解决问题。如果可以操作所请求的后端，可以在后端服务中启用CORS功能并配置Origin。

而关于前端VUE配置CORS可以参考博文：Vue学习总结-Vue前端解决跨域问题

解决跨域问题，正常情况下有两种，既然涉及到两端，那么大的就是从两端各自处理。

第一种：从后端处理。就是在后端代码中通过过滤器等方式允许请求进行跨域访问

第二种：从前端vue处理，vue提供了相关的配置，通过代理的方式进行跨域请求

————————————————

原文链接：https://blog.csdn.net/yyj108317/article/details/110504369

【完】

【Azure 环境】前端Web通过Azure AD获取Token时发生跨域问题(CORS Error)

问题描述

问题解决

热门文章

最新文章

相关课程

相关电子书

相关实验场景