axios get请求特殊字符编码问题

半夏ing

已于 2022-12-16 14:56:19 修改

阅读量944

点赞数

CC 4.0 BY-SA版权

分类专栏： js vue 文章标签： javascript 开发语言 ecmascript

于 2022-12-16 14:55:15 首次发布

本文链接：https://blog.csdn.net/Fiona_lms/article/details/128342922

vue 同时被 2 个专栏收录

44 篇文章

订阅专栏

14 篇文章

订阅专栏

本文介绍了一种解决GET请求中参数编码的方法，通过在请求拦截器中对URL参数进行编码处理，确保了请求参数能够正确传递。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这几天在写一个项目，然后就遇到了请求的编码问题，然后在度娘上搜到了答案

    // 请求拦截器配置处理
    this.axiosInstance.interceptors.request.use((config: AxiosRequestConfig) => {
      const {
        headers: { ignoreCancelToken },
      } = config;
      let url = config.url
    // get参数编码
    if (config.method === 'get' && config.params) {
        url += '?'
        const keys = Object.keys(config.params)
        for (const key of keys) {
          url += `${key}=${encodeURIComponent(config.params[key])}&`
        }
        url = url.substring(0, url.length - 1)
        config.params = {}
      }
      config.url = url
      const ignoreCancel =
        ignoreCancelToken !== undefined
          ? ignoreCancelToken
          : this.options.requestOptions?.ignoreCancelToken;

      !ignoreCancel && axiosCanceler.addPending(config);
      if (requestInterceptors && isFunction(requestInterceptors)) {
        config = requestInterceptors(config, this.options);
      }
      
      return config;
    }, undefined);