开发者社区 问答 正文

跨域请求问题

使用阿里的私有云oss页面获取后台签名的方式进行文件上传,在oss上放开了跨域请求的配置
来源: * Methods:POST Headers: *

但是访问 前端页面访问的时候还是有问题 报错: 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' .Origin {host} is therefore not allowed access .The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCrendentials attribute.

展开
收起
游客y55achkq6uah6 2021-05-21 09:38:22 512 分享 版权
阿里云 AI 助理回答

根据您描述的问题,看起来您在尝试使用阿里云OSS进行文件上传时遇到了CORS(跨源资源共享)配置问题。错误信息提示Access-Control-Allow-Origin不能设置为通配符*,尤其是在请求的credentials mode为'include'的情况下。

这是因为当请求携带凭证(cookies、授权头等)时,CORS规范不允许服务器响应中的Access-Control-Allow-Origin头设置为通配符*,以防止安全风险。您需要将该头部精确设置为您前端应用的实际源(Origin),而不是允许所有来源。

解决这个问题的方法是:

  1. 精确设置CORS规则:登录阿里云OSS管理控制台,找到对应的Bucket,进入“跨域资源共享(CORS)”配置页面,修改或添加一条CORS规则,确保AllowedOrigins字段不使用*,而是具体指定您的前端应用的域名。例如,如果您的前端应用部署在https://example.com,则应将其设置为https://example.com

    一个示例CORS规则可能如下所示:

    [
     {
       "AllowedOrigins": ["https://example.com"],
       "AllowedMethods": ["GET", "POST", "PUT", "DELETE", "HEAD"],
       "AllowedHeaders": ["*"],
       "ExposeHeaders": ["ETag"],
       "MaxAgeSeconds": 3000
     }
    ]
    

    确保AllowedMethods中包含了您需要的所有HTTP方法,AllowedHeaders允许了必要的请求头,同时根据需要调整ExposeHeadersMaxAgeSeconds

  2. 前端代码调整:如果您在前端使用了XMLHttpRequest或者Fetch API,并且设置了withCredentials = true来发送带有凭证的请求,那么上述CORS配置变更就是必须的。请确保您的前端请求与后端CORS设置相匹配。

  3. 测试更改:保存更改后,刷新您的前端页面并重新尝试文件上传操作,检查是否仍然存在跨域问题。

如果问题依旧,请再次检查您的前端请求设置以及后端CORS配置,确保没有遗漏或误解的地方。

有帮助
无帮助
AI 助理回答生成答案可能存在不准确,仅供参考
0 条回答
写回答
取消 提交回答
问答分类:
问答地址: