NUXT获取接口数据（跨域）

首先已经在项目中引入了axios，并将其封装了

import axios from 'axios'
import {getUser} from "@/utils/auth";
//创建axios实例
const service = axios.create({
  baseURL: 'http://192.168.238:9012',//api的base_url
  timeout: 30000, //请求超时
  headers: {'Authorization': 'Bearer ' + getUser().token},
})
export default service

但在局域网内可以获取到前端页面，但拿取不到后台的数据。

百度了一下，在一篇简书上看到是跨域问题，像之前的vue项目可以在config/index.js,在proxyTable中添加api地址可代理解决:

proxyTable: { 
  '/api': {  
    target: ' http://192.168.238:9012 ',
  } 
}

在nuxt项目中同样需要修改nuxt.config.js配置文件。

首先，需要下载代理插件@nuxtjs/axios：

npm/cnpm install @nuxtjs/axios --save

然后在nuxt.config.js文件里面添加以下代码：

module.exports={
    modules: [
        '@nuxtjs/axios'
      ],
      axios: {
        proxy: true
      },
      proxy: {
        '/api': 'http://192.168.238:9012'
      }
}

问题解决！

需要注意的是：

axios访问后台接口中的地址必须为主机的真实ip地址，不能使用127.0.0.1或者localhost。（在此之前我已经修改过）