阿里云OSS前端直传报错跨域

场景

结果

通过阿里云oss直传签名上传文件时报错跨域。

查验

查看OSS资源中，发现通过配置方法直传后，文件实际是上传成功的。

思考与发现

说明这里只是浏览器报跨域错误。

解决办法

做法： ajax将withCredentials属性设置成false。

目的： 设置成跨域不带上cookie

原理可能是底层可能是设置成默认带上cookie，导致浏览器报跨域错误。

配置

$.ajax({
  ...
  xhrFields: {
     withCredentials: false
  },
  ...
})

贴士

1. ajax会自动带上同源的cookie，不会带上不同源的cookie
2. 可以通过前端设置withCredentials为true， 后端设置Header的方式来让ajax自动带上不同源的cookie，但是这个属性对同源请求没有任何影响， 会被自动忽略。