axios 사용 요약 (1)

2723 단어 프레임
1、baseURL、timeout
axios.create({ 
baseURL:'', 
timeout:500     //     1 

})

2. transformRequest는 서버에 보내기 전에 파라미터를 차단하고 요청 데이터를 수정합니다
axios.create({

    baseURL:'', 
    transformRequest: [function (data) { // `transformRequest`  ,                           //   'PUT', 'POST'   'PATCH'   
    data.sex = 'man' 
    return qs.stringify(data) //  create_headers , sex=man         //  network :name=xiaoming&age=12&sex=man 
    }], 

})

3. transformResponse는 then/catch에 전달하기 전에 응답 데이터를 수정할 수 있습니다
  let http = axios.create({

    baseURL: 'https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/',
    //   `baseURL`   axios   URL
    transformResponse: [function (data) {
      // `transformResponse`   then/catch  , 
      data = '2222'
      return data
    }]
  })

4. interceptors 요청 차단기
instance.interceptors.request.use(
  config => {
    const token = sessionStorage.getItem('token')
    if (token ) { //  token, , http header token
      config.headers.authorization = token  // token
    }
    return config
  },
  err => {
    return Promise.reject(err)
  })

5. interceptors 응답 차단기
// http response  
instance.interceptors.response.use(
  response => {
    // ,  
    if (response.data.code) {
      switch (response.data.code) {
        case 1002:
          store.state.isLogin = false
          router.replace({
            path: 'login',
            query: {
              redirect: router.currentRoute.fullPath
            }
          })
      }
    }
    return response
  },
  // , 
  error => {
    return Promise.reject(error.response.status) //  
  })

6、axios.all
 getUrl () {
        return axios.get('https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/aa')
      },
      postUrl () {
        return axios.post('https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/bb')
      },
      allUrl () {
        axios.all([this.getUrl(), this.postUrl()])
          //  , 
          .then(axios.spread((res1, res2) => {
            //  , 
            // res1 getUrl , res2 postUrl 
            console.log(res1.data, res2.data)
          }))
      }

7,validateStatus 상태 코드
 // axios 
  let http = axios.create({
    baseURL: 'https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/',
    //   `baseURL`   axios   URL

    validateStatus: function (status) {
      //    
      return status === 404
      //  404, , 404, 
    }
  })

좋은 웹페이지 즐겨찾기