Axios Study Notes

Axios Study Notes
Axios Document Source Address: Https://github.com/axios/axios
0. Concept
Axios's description on NPM is: Promise based HTTP Client for the browser and node. js.
Axios is an encapsulation of Ajax technology through promise, just like jquery for Ajax encapsulation.
Simply put: Ajax technology realizes the local data refresh of the webpage, and Axios implements the encapsulation of Ajax.
1.Installing
$ NPM Install Axios
2.Example
1.Performing a GET request
Make a request for a user with a given ID
Axios.get ('/user?id=12345 ')
. Then (function (response) {
Console.log (response);
})
. catch (function (error) {
Console.log (Error);
});
Optionally the request above could also is done as
Axios.get ('/user ', {
Params: {
id:12345
}
})
. Then (function (response) {
Console.log (response);
})
. catch (function (error) {
Console.log (Error);
});

Asynchronous operation want to use async/await? Add the ' async ' keyword to your outer function/method.
Async function GetUser () {
try {
Const RESPONSE = await axios.get ('/user?id=12345 ');
Console.log (response);
} catch (Error) {
Console.error (Error);
}
}
Note:async/await are part of ECMAScript and are not supported in Internet Explorer and older browsers tion.
2.Performing a POST request
Axios.post ('/user ', {
FirstName: ' Fred ',
LastName: ' Flintstone '
})
. Then (function (response) {
Console.log (response);
})
. catch (function (error) {
Console.log (Error);
});
3. 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) {
Both Requests is now complete
}));
3.axios API (much like Ajax)
1.post
Axios ({
Method: ' Post ',
URL: '/user/12345 ',
Data: {
FirstName: ' Fred ',
LastName: ' Flintstone '
}
});
2.get
Axios ({
Method: ' Get ',
URL: ' Http://bit.ly/2mTM3nY ',
Responsetype: ' Stream '
})
. Then (function (response) {
Response.data.pipe (Fs.createwritestream (' ada_lovelace.jpg '))
});
3. Default Get method
Axios ('/user/12345 ');
4.requireJs
4.1 Effects
Prevent JS from blocking browser rendering
4.2 Use
<script src= "Https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.16/require.min.js" ></script>

Axios Study Notes