Vue跨域问题 Access-Control-Allow-Origin

Vue 跨域问题：Access to XMLHttpRequest at ‘http://localhost:8085/queryAll’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

跨域：
我们常见的网址一般包括协议, 域名, 端口几个部分, 在浏览器的同源策略下,协议不同 域名不同 端口不同都会出现跨域。

跨域问题出现的原因：浏览器出于安全考虑，限制访问本站点以为的资源。

博主情况

1. 项目为前后端分离的demo，使用的技术为Spring Boot + Vue，在vue传递分页数据并发送请求到后端获取对象列表时，遇到标题中的错误信息。

后端接口代码：

@RestController
@CrossOrigin
public class UserController {
    @Autowired
    UserService userService;

    @RequestMapping("/queryAll")
    public RtnPageResult queryAllUser(
    	@RequestBody RtnPageResult rtnPageResult){
        return userService.queryAll(rtnPageResult);
    }
}

后端代码解释：定义了一个为"/queryAll"的接口，供前端调用。在返回类型为RtnPageResult的方法中，传入了一个对象作为参数对数据库中的数据进行查询。并且在该对象前添加了 @RequestBody 注解。

@RequestBody 注解作用：将前端传递到后端的json格式数据，转换为一个对象。注意，前端参数属性名要与后端参数对象类中的属性名一一对应。

@CrossOrigin注解作用：表示该类的所有方法允许跨域。前端的地址为:http:localhost:8080\与后端服务器地址：http:localhost:8085有端口冲突，为了让该类中的方法实现跨域请求，加上了@CrossOrigin注解。并且该注解可以进行细粒度更高的跨域资源控制。

前端请求代码：

data() {
    return {
      tableDate: null,
      total: 0,
      size: [10, 50, 100, 200],
      currentpage: 1,
      pageCount: 5,
      queryInfo: {
        currentPage: 1,
        pageNumber: 10,
      },
    }
  },
  props: ['tableInfo'],
  //同步请求
  async created() {
    try {
      //请求vue.config.js中的数据
      // 进入同步请求
    await this.$http.post(
    // 注：this.$http.post中的$http
    // 要与main.js中 Vue.prototype.$http = axios 所定义的要一致
          this.tableInfo.url,
          this.queryInfo
        )
        .then((resp) => {
            const data = resp.data
            console.log(resp);
          this.tableDate = data.myList
          console.log(data.myList)
          this.total = data.total
          console.log(data.total);
        })
    } catch (err) {
      console.log(err)
    }
  },

前端代码解释：发送了一个post请求，请求地址为http://localhost:8085/queryAll，请求参数为this.queryInfo也就是
queryInfo: {
currentPage: 1,
pageNumber: 10,
}一个json对象。

注：如果请求方式又POST改为GET会报400错误

xhr.js?b50d:177 GET http://localhost:8085/queryAll 400