自定义axios样例

客户端
步骤一：在nuxt.conf.js中配置客户端插件，设置 mode 为 client

plugins: [
    { src: '~plugins/api.js', mode: 'client' }
  ],

步骤二：编写 plugins/api.js 对 内置的 $axios进行增强

//自定义函数
const request = {
  test : (params) => {
    return axios.get('/service-consumer/feign/echo/abc',{
      params
    })
  },
}

var axios = null
export default ({ $axios }, inject) => {

  //3） 保存内置的axios
  axios = $axios

  //4) 将自定义函数交于nuxt
  // 使用方式1：在vue中，this.$request.xxx()
  // 使用方式2：在nuxt的asyncData中，content.app.$request.xxx()

  inject('request', request)
}

服务端
步骤一：配置服务端插件，设置 mode 为 server

  plugins: [
    { src: '~plugins/api.js', mode: 'client' },
    { src: '~plugins/api.server.js', mode: 'server' },
  ],

步骤二：编写 plugins/api.server.js 对 内置的 $axios进行增强

  const request = {
  test : (params) => {
    return axios.get('/service-consumer/feign/echo/abc',{
      params
    })
  },
  
}

var axios = null
export default ({ $axios, redirect, process }, inject) => {

  //赋值
  axios = $axios

  //4) 将自定义函数交于nuxt
  // 使用方式1：在vue中，this.$request.xxx()
  // 使用方式2：在nuxt的asyncData中，content.app.$request.xxx()
  inject('request', request)
}

插件配置
//方式1：通过src设置文件，通过mode设置模式

plugins: [
	{ src: '~/plugins/apiclient.js', mode: 'client' },		//前端客户端
	{ src: '~/plugins/apiserver.js', mode: 'server' },		//前端服务端
    { src: '~/plugins/api.js' }								//前端客户端 + 前端服务端
]

//方式2：通过命名来确定模式

plugins: [
    '~/plugins/api.client.js',				//前端客户端
    '~/plugins/api.server.js',				//前端服务端
    '~/plugins/api.js',						//前端客户端 + 前端服务端
]