nuxt.js 跨域配置proxy代理

nuxt.js 跨域配置

通过proxy代理解决跨域问题

---

问题描述

Access to XMLHttpRequest at ‘http://localhost:8080/api/user/login’ from origin ‘http://localhost:1/user/login’…

---

解决方案：

配置proxy代理

1. 安装axios: npm install --save axios
2. 安装 @nuxtjs/axios和@nuxtjs/proxy来处理 axios 跨域问题: npm i @nuxtjs/axios @nuxtjs/proxy -S
3. nuxt.config.js中配置：

modules: [
    'cookie-universal-nuxt',
    '@nuxtjs/axios',
    '@nuxtjs/proxy' ],

  axios: {
    proxy: true,
    credentials: true  },
    
  proxy: {
    '/user': {
      target: 'http://localhost:80/user',
      changeOrigin: true,
      pathRewrite: {
        '^/user': '',
        	}
    	}
    }

4. 使用：

getinfo() {
        axios({
              url: '/user/checktoken',
              method: "get",
              withCredentials :true,
            }).then(R => {
              console.log(R.data);
            })
      }