zoukankan      html  css  js  c++  java
  • axios的拦截请求与响应

    // 请求拦截(配置发送请求的信息)
    axios.interceptors.request.use(function (config) {
      // 处理请求之前的配置
      return config
    }, function (error) {
      // 请求失败的处理
      return Promise.reject(error)
    })
    
    // 响应拦截(配置请求回来的信息)
    axios.interceptors.response.use(function (response) {
      // 处理响应数据
      return response
    }, function (error) {
      // 处理响应失败
      return Promise.reject(error)
    })
    
    // axios转发 //其他页面在使用axios的时候直接  this.$axios就可以了
    Vue.prototype.$axios = axios

    调用

      methods: {
        getInfo () {
          this.$axios.get('/fcg_myqq_toplist.fcg', {
            headers: {
              'authorization': this.token
            },
            params: {
              g_tk: 5381,
              uin: 0,
              format: 'json',
              inCharset: 'utf-8',
              outCharset: 'utf-8',
              notice: 0,
              platform: 'h5',
              needNewCode: 1
            }
          }).then((res) => {
            this.discList = res.data.data.topList
            console.log(this.discList)
          }).catch((err) => {
            console.log(err.response.status)
          })
        }
      },

    configindex.js配置跨域

        proxyTable: {
          '/api':{
            target: "https://c.y.qq.com/v8/fcg-bin",
            changeOrigin:true,
            pathRewrite:{
              '^/api':''
            }
          }
        },

    main.js

    Vue.prototype.$axios = axios
    axios.defaults.baseURL = '/api'
    axios.defaults.headers.post['Content-Type'] = 'application/json'
  • 相关阅读:
    Vue.js入门(3)TypeScript
    Dapper源码学习
    .Net中手动实现AOP
    .Net面向对象(OOP)
    Redis实战(18)Redis位图巧用,节约内存
    .Net深拷贝浅拷贝
    .NET面试题系列(22)字符串暂存池(缓冲池)
    .NET面试题系列(二十一)C#中Equals和==的比较
    C# 8.0
    C# 7.0
  • 原文地址:https://www.cnblogs.com/ronle/p/10970043.html
Copyright © 2011-2022 走看看