Wrap Angular AXIo

import { Injectable } from '@angular/core';
import axios from 'axios';
import Qs from 'qs';
axios.defaults.timeout = 5000;
import { environment } from '.. /.. /environments/environment';

console.log(environment.baseURL);
axios.defaults.baseURL = environment.baseURL; // Enter the domain name
// HTTP request interceptor client to server data
axios.interceptors.request.use(
  config= > {

    config.headers.common = {
      'X-API-TOKEN': localStorage.getItem('token'),
      'version': '1.0'.'Content-Type': 'application/json; charset=UTF-8'
    }

    if (config.data && config.data.form) {
      // Convert to formData format
      // transformRequest can only be used in PUT, POST, and PATCH request methods
      config.transformRequest = [function (data) {
        / / way
        delete data.form;
        // var ret = '';
        // for (let it in data) {
        // ret += it+'=' +data[it] + '&';
        // }
        // return ret.substring(0,ret.length-1);

        // Method 2:
        var test2 = Qs.stringify(data);
        returntest2; }}]return config;
  },
  error= > {
    return Promise.reject(); });// Responder interceptors are exception handlers -- the data that the service sends to the client is processed
axios.interceptors.response.use(response= > {
  if (response.status === 200) {
    return Promise.resolve(response);
  } else {
    return Promise.reject(response);
  }
  // return response
}, err= > {
  if (err && err.response) {
    var errorMsg = ' ';
    switch (err.response.status) {
      case 400:
        console.log('Error request')
        errorMsg = 'Error request';
        break;
      case 401:
        console.log('Not authorized, please log in again');
        errorMsg = 'Not authorized, please log in again';
        break;
      case 403:
        console.log('Access denied')
        errorMsg = 'Access denied';
        break;
      case 404:
        console.log('Request error, resource not found')
        errorMsg = 'Request error, resource not found';
        break;
      case 405:
        console.log('Requested method not allowed')
        errorMsg = 'Requested method not allowed';
        break;
      case 408:
        console.log('Request timed out')
        errorMsg = 'Request timed out';
        break;
      case 500:
        console.log('Server side error')
        errorMsg = 'Server side error';
        break;
      case 501:
        console.log('Network not implemented')
        errorMsg = 'Requested method not allowed';
        break;
      case 502:
        console.log('Network error')
        errorMsg = 'Network error';
        break;
      case 503:
        console.log('Service unavailable')
        errorMsg = 'Service unavailable';
        break;
      case 504:
        console.log('Network timeout')
        errorMsg = 'Network timeout';
        break;
      case 505:
        console.log('The HTTP version does not support this request')
        errorMsg = 'The HTTP version does not support this request';
        break;
      default:
        console.log('Connection error${err.response.status}`)
    }

    alert(errorMsg);

  } else {
    console.log('Failed to connect to server')}return Promise.resolve(err.response)
})


@Injectable({
  providedIn: 'root'
})
export class AxiosService {

  constructor(){}// Wrap an idea wrapper that directly utilizes axios itself as a Promise object
  postFun(url, params) {
    return axios.post(url, params)
      .then(response= > {
        if (response.status == 200) {
          return Promise.resolve(response.data);
          // Note that there must be a return, equivalent to resolve in new Promise, to tell the interface that the data has been retrieved
        }
      })
      .catch(err= >{})}getFun(url, params = {}) {

    return new Promise((resolve, reject) = > {
      axios.get(url, {
        params: params
      })
        .then(response= >{ resolve(response.data); }}})})Copy the code