vue3配置代理--[vite] http proxy error_[vite] http proxy error

可能是localhost 被使用了。 Node.js 在 v17以下版本中会对DNS解析地址的结果进行重新排序。 当访问localhost时, 浏览器使用DNS来解析地址, 这个地址可能与Vite正在监听的地址不同。当地址不一致时。导致接口报错。

解决方案

后端不要使用localhost作为接口域名,配置一个虚拟域名或者使用127.0.0.1

vite.config.js 中配置代理, 解决跨域问题。

后端接口如果有统一的标识, 比如api的配置

vite.config.js

export default defineConfig({ 
  server: { // 中转服务器
    proxy: { // 通过代理实现跨域,搭理这个地址http://localhost:8081
      '/api': {  // 路径, 作为就是替换域名
        target: 'http://127.0.0.1:8081', // 表示要替换的服务端地址
        changeOrigin: true, // 表示开启代理, 允许跨域请求数据
        secure: false,  // 如果是https接口，需要配置这个参数 
      }
    }
  } 
})

释义: 如果前端请求带有/api的接口地址, 都会转发到http://127.0.0.1:8