原创 

nuxtjs 跨域全量配置源码

分类:Html5    414人阅读    IT小君  2020-07-14 07:14

nuxtjs.config.js 配置如下,使用nuxtjs 封装的axios 使用时带$好引用,红色部分为需要添加配置:

module.exports = {
  router: {
    /**
     * 配置路由激活时的导航链接的样式类名
     */
    linkActiveClass: 'active'
  },css: [
    // 项目里要用的 CSS 文件
    '@/assets/css/main.css',
    '@/assets/css/bootstrapV4.css',
  ],modules: [
    '@nuxtjs/axios',
    '@nuxtjs/proxy'
],
proxy: [
    [
      '/iface', 
      { 
        target: 'http://iface.yy123.ink'
      }
  ]
], build: {
  vendor: ['axios']
}
}

使用:

export default {
    name:'HomeIndex',
    data(){
        return {
        ...
        }
    },
    async asyncData({$axios}) {
        console.log('-----asyncData-----')
        const { data } = await $axios({
            method:'POST',
            url:'/iface/topic/getTopicList',
            data: {}
        });
        return {
            articles: data.data
        }
    },
    async mounted() {
    },methods:{
      setUser(){
        if (! this.user||! this.user.userID) {
          this.$axios({
            url: "/iface/user/getCurrentUser",
            method: "GET",
            success: function(result) {
             
            },
            fail: function(e) {
              error.call(self, e)
            }
          });
        }else{
          store.state.hasLogin=true;
          autoLogin(user.userID);
          console.log("当前用户:");
          console.log(user);
        }
      }
    }
}


支付宝打赏 微信打赏

如果文章对你有帮助,欢迎点击上方按钮打赏作者

 工具推荐 更多»