vue3 vite解决跨域

268 阅读1分钟

在开发阶段:
第一步:

通过server来配置:

server: { 
    port:4000,//设置服务启动端口号,是一个可选项,不要设置为本机的端口号,可能会发生冲突
     open:true,//是否自动打开浏览器,可选项
     cors:true,//允许跨域。
     // 设置代理
     proxy: {
      // 将请求代理到另一个服务器
         '/api': {
         target: 'http://192.168.11.11:8006',//这是你要跨域请求的地址前缀        
         changeOrigin: true,//开启跨域
        rewrite: path => path.replace(/^\/api/, ''),//去除前缀api  
    } 
  } 
 }

第二步:
request.js

import axios from 'axios'
axios.defaults.baseURL =    import.meta.env.PROD ?    '/' : "/api"
export default axios;

第三步:

axios .post("/Login", {        
  MobilePhone: form.phone,        
  LoginPassword: form.password,      
})      
.then((response) => {
          ...       })     
.catch((error) => {         
         ...            
})