nuxt+axios跨域设置

| 2023-08-02 | |

摘要: 场景:需要跨域请求接口操作:1.下载依赖npm i @nuxtjs/proxy -D2.在plugins增加axios.js文件import qs from "qs"; export default function({ $axios, redirect }) { $axios.o

场景:需要跨域请求接口
操作:
1.下载依赖

npm i @nuxtjs/proxy -D

2.在plugins增加axios.js文件

import qs from "qs";
 
export default function({ $axios, redirect }) {
 $axios.onRequest(config => {
  config.data = qs.stringify(config.data, {
   allowDots: true //Option allowDots can be used to enable dot notation
  });
  return config;
 });
 
 $axios.onResponse(response => {
  return Promise.resolve(response);
 });
 
 $axios.onError(error => {
  return Promise.reject(error);
 });
}

3.配置

  plugins: [
    { src: "~plugins/axios.js", ssr: true },
  ],
  modules: [
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
    '@nuxtjs/proxy',
  ],
  axios: {
    retry: { retries: 3 },
    //开发模式下开启debug
    debug: process.env._ENV == "production" ? false : true,
    //设置不同环境的请求地址
    baseURL:
     process.env._ENV == "production"
      ? "http://114.117.166.57/"
      : "http://localhost:3000/",
    withCredentials: true,
  },
  proxy: {
      //开启代理
      "/api/": {
      target: "http://114.117.166.57/",
      pathRewrite: { "^/api/": "" }
      }
  },

推荐文章

nuxt+axios跨域设置

error:0308010C:digital envelope routines::unsu

帝国CMS内容页列表页怎么调用多张图片显示

帝国cms跨多表调用相关信息

帝国CMS列表页判断是否有标题图片,如果没有就显示

帝国7.5登陆js调用会员头像

售后服务

售后服务QQ:287785998

服务时间:周一至周五 9:00-17:30

微信扫一扫,关注更多精彩

  • 里奥模板微信号
    全面掌握一手资讯

  • 里奥模板QQ号
    精彩活动,推送提醒

帝国模板

可信网站 诚信网站 实名验证网站 实名网站 财付通

粤ICP备08131584号-1