Detailed usage of Axios and back-end interface proxies

Installation

Using NPM:

$ NPM Install Axios

or use Bower:

$ Bower Install Axios

Or use CDN directly:

<script src= "Https://unpkg.com/axios/dist/axios.min.js" ></script>

Main.js settings are as follows

Introduction of Axios

Import Axios from ' Axios '

The prototype attached to Vue

Vue.prototype. $http = Axios

Set the agent in the Webpack.config.js (config->index.js) file to note that the new file will be modified

Dev: {env:require ('./dev.env '), Port:8080,//set the port number of the accessAutoopenbrowser:true,//automatically open browserAssetssubdirectory: ' Static ', Assetspublicpath:‘/‘, proxytable: {'/api ': {target:' http://10.10:8063 ',//set the calling interface domain name and port number don't forget to add HTTPChangeorigin:true, Pathrewrite: {' ^/api ': '/'//This is understood as the use of '/api ' instead of the address inside the target, in which we use/API instead of the interface .                    //For example I want to call ' Http://0.0:300/user/add ', directly write '/api/user/add ' can proxy after the Address bar display/            }        }    }

Perform a GET request

// Creates a request Axios.get ('/user?id=12345 ') for the user of the given ID . Then  (function  (response) {    Console.log (response);  })  . Catch (function  (error) {    console.log (error);  }); // Optionally, the above request can be done axios.get ('/user ', {    params: {      12345    }  })  . Then (function  (response) {    Console.log (response);  })  . Catch (function  (error) {    console.log (error);  });

Perform a POST request

Axios.post ('/user ', {    ' Fred ',    ' Flintstone '  })  . Then (function  (response) {    Console.log (response);  })  . Catch (function  (error) {    console.log (error);  });

Executing multiple concurrent Requests

function Getuseraccount () {  return axios.get ('/user/12345 ');} function getuserpermissions () {  return axios.get ('/user/12345/permissions ');} Axios.all ([Getuseraccount (), Getuserpermissions ()])  . Then (axios.spread (function  (ACCT, perms) {    //  Two requests are now complete  }));

Create an instance
You can create a new Axios instance with a custom configuration
Axios.create ([config])

var instance = axios.create ({  ' https://some-domain.com/api/',    Headers: {' x-custom-header ': ' Foobar '}});

Detailed usage of Axios and back-end interface proxies