vue2 axios跨域解决方法 和nodejs+express跨域

方法一

1.在vue.config.js文件中配置

module.exports = {
  devServer: {
    proxy: {
      '/api': {                      //这里就是如果遇到自己要访问的路径里面有'/api'字                            
                                     //样就自动转化为下面target加在‘/api’去前面
        target: 'http://127.0.0.1:7001', //这里写要访问的网址和端口
        // pathRewrite:{'^/atguigu':''},
        // ws: true, //用于支持websocket
        // changeOrigin: true //用于控制请求头中的host值
      },
    }
  }
}

2.

这里有两个坑target: 'http://127.0.0.1:7001', 这个地址是要请求的
如果想跨域的话就自己请求自己的地址
axios.post('http://localhost:8080/api/admin/login', {
          'username': '19568269510',
          'password': '123456'
        })
大坑 如果请求自己的地址的话一定要看一下 自己的当前的地址是localhost 还是127.0.0.1
如果localhost 和127.0.0.1这个没看清楚写好会跨域失败的大坑大坑

3.端口配置

app.get('/api/data', (req, res) => {   //后端的端口路径前面加上api
    res.send({
        mas: '请求成功'
    })
})

方法二  直接复制在服务器文件

var express=require("express");  //有了就不用复制这条
var app=express();               //有了就不用复制这条
app.use(function(req,res,next){
    res.header('Access-Control-Allow-Origin', '*');

    res.header('Access-Control-Allow-Headers', 'Content-Type,Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');

    res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE,OPTIONS');
    // 千万不要网%%￥￥￥###
    // 千万不要网
    // 千万不要网
    next();
})