vue请求controller报错has been blocked by CORS policy

你遇到的问题是跨域错误，即前端通过Vue请求后端的Controller时出现了被CORS策略阻止的报错。这个错误通常是由于浏览器的同源策略所导致的。同源策略限制了不同源(协议、域名、端口)之间的资源访问。解决这个问题有几种方法。

一种方法是在后端的Controller上添加跨域注解@CrossOrigin。这个注解可以让外界直接访问到这个Controller层。但是需要在每一个Controller都添加这个注解，可能会比较麻烦。

另一种方法是创建一个CorsConfig类，继承WebMvcConfigurer，并重写addCorsMappings方法。在这个方法中，可以设置允许跨域的路径、允许跨域请求的域名、是否允许证书、允许的请求方法、允许的请求头和跨域允许时间。这样可以统一配置跨域规则，而不需要在每个Controller上添加注解。

另外，还可以尝试将请求的Content-Type设置为表单类型，以避免CORS跨域错误。具体做法是在请求的headers中设置'Content-Type':'application/x-www-form-urlencoded'。

这些方法都可以在不同情况下解决CORS跨域问题，你可以根据自己的项目需求选择其中的一种方法进行尝试。<span class="em">1</span><span class="em">2</span><span class="em">3</span>

相关问题

Vue报错has been blocked by CORS policy怎么解决

出现这个错误是因为浏览器的同源策略（Same Origin Policy）限制，Vue应用在跨域请求数据时被浏览器拦截了。解决这个问题有几种方法：

1. 在后端设置允许跨域访问。可以在后端服务器的响应头中添加 Access-Control-Allow-Origin 字段，允许指定的域名访问数据。

2. 使用代理。在 Vue 应用中配置一个代理，将请求转发到后端服务器，避免跨域问题。可以使用 Vue 自带的代理插件 vue-cli-plugin-proxy 或者自己手动配置代理。

3. 使用 JSONP。JSONP 是一种跨域请求数据的方法，可以通过动态创建 script 标签来获取数据，但只支持 GET 请求。

4. 使用 CORS 跨域资源共享。CORS 是一种新的跨域请求数据的方式，可以在前端和后端同时进行设置，支持各种类型的请求，但需要浏览器支持。

以上是解决 Vue 报错has been blocked by CORS policy 的几种方法，具体需要根据项目情况选择合适的方式进行解决。

vue has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

引用和引用[2]提供了关于如何解决CORS跨域问题的方法。在Django项目中，您可以使用django-cors-headers来处理CORS跨域请求。首先，您需要在项目的settings.py文件中添加corsheaders中间件和应用。然后，您可以通过配置CORS_ORIGIN_WHITELIST来设置允许跨域请求的白名单。最后，确保将CORS_ALLOW_CREDENTIALS设置为False，以防止携带cookie的跨域请求。这样，您就可以解决"vue has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"的问题了。