在用vue3调用接口的时候，要么就是接口请求是404状态，要么就是跨域，如下报错：
Access to XMLHttpRequest at ‘xxx’ from origin ‘xxx’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource


【写在前面】在网上看了大半天的时间，找了各种方法，有些人让你创建这个，创建那个的，看的头大，还有各种文章都是复制粘贴的，千篇一律，让我顿时陷入沉思，到底是道德的沦丧还是人性的扭曲。
1.问题解决
下面说一下怎么解决这个问题吧，首先你得保证后台接口是OK的，也就是你可以在swagger上测试OK，然后再往下走，看你的配置vue.config.js文件,是否配置正确，
没有vue.config.js文件的自己去根目录下创建一个，然后把我的复制进去，接口和端口自己按照自己的需求调整。
如下所示：

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false,
  devServer: {
    port: 8090, // 端口
    proxy: {
      '/api': {
        target: 'http://127.0.0.1:8089',
        changeOrigin: true, //支持跨域
        pathRewrite: {
          // 路径重写
          '/api': '/userHuang' // 用'/api'代替target里面的地址
        }
      }
    }
  }
})

上面配置只能通过代理设置解决跨域的问题，但是还是会出现404接口访问报错；
【要想代理生效】axios默认属性的基础路径需要配置上这个路径，如下所示
axios.defaults.baseURL = ‘/api/’
最后我们重启服务就可以愉快的访问后端接口了，如下所示，拿到数据就是任你发挥展示了。

切记修改配置文件后一定要重启服务哈！
喜欢的可以给个关注哈！互相交流学习。有疑问的可以留言！期待和您一起进步。