vue中使用axios跨域的问题

Question

最近写了一个登录，用的axios，后端是node，跨域请求传过去404，麻烦大佬帮我看看哪里错了。

这是按钮的submit方法

   submit: function () {
  this.$http.post('/api/user/login', {
    username: this.user.username,
    password: this.user.password
  }).then((response) => {
    console.log('response.body.success=' + response.body.success)
  }).catch((error) => {
    console.log(error)
  })
}

main.js里配置如下

import axios from 'axios'
Vue.prototype.$http = axios

config.index.js中配置已经加上了

// 设置地址映射表
proxyTable: {
  '/api': {
    target: 'http://127.0.0.1:3000', // 目标地址
    changeOrigin: true,
    pathRewrite: {
      '^/api': '' // 将目标地址变成这个
    }
  }
}

dev.env.js中配置如下

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',  //开发环境
  API_HOST:"/api/"
})

prod.dev.js生产环境配置(其实我就是在本地弄得，)

module.exports = {
  NODE_ENV: '"development"',
  BASE_API: '"http://localhost:9800/"',
  API_HOST: "/api/",
  APP_ORIGIN: '"http://localhost:9800"'
}

后端node中接收请求的是user.js(node小白，所以也不知道是不是后端的问题)

router.post('/api/login', function(req, res, next) {
  res.send('respond with a resource');
});

后端的端口是3000，前端是8080
node目录如下：

这是chrome上的请求情况，我也很奇怪这里为什么路径还是localhost：8080/user/login;不应该是/api/user/login吗

Answer 1

把pathRewrite删了

Answer 2

粗略扫了一眼你不是跨域问题是代理那块出了问题，不理解代理的配置就不要去动那一块了，前端的base api 直接写成本地后端服务就得了比如：http:localhost:8080，然后后端开启跨域访问。