JavaScript Rest Api
- Es ist wichtig zu wissen, wie man
HTTP
Anfragen stellt und Daten von einem Server retridt. - JavaScript Bietet einige eingebaute Objekte für die Interaktion mit der API.
Verwenden XMLHttpRequest()
Das XMLHttpRequest
Objekt kann verwendet werden, um Daten von einem Webserver anzufordern.
const request = new XMLHttpRequest(); request.open("GET", "https://jsonplaceholder.typicode.com/posts"); request.send(); request.onLoad = () => { console.log(request); if(request.status === 200) { console.log(JSON.parse(request.response)); } else { console.log(JSON.parse(request.response)); console.log(
error ${request.status}
); } };
Verwenden Fetch API()
Mit der Methode fetch()
Es braucht zwei Argumente.
- Eine URL oder ein Objekt, das die Anforderung darstellt.
- Optionales Init-Objekt, das die Methode, Header, Body usw. enthält.
fetch(url) .then(response => { // handle the response }) .catch(error => { // handle the error });
API Call JavaScript
async function getUsers() { let response = await fetch('https://jsonplaceholder.typicode.com/posts'); let data = await response.josn(); console.log(data); } getUsers().then(res => { console.log(res) })
Verwenden Axios
Axios ist ein vielversprechender HTTP-Client für Node.js und den Browser.
- Erstellen Sie XMLHttpRequests über den Browser
- Machen Sie HTTP-Anfragen vom Knoten.js
- Unterstützt die Promise API
axios().get('https://jsonplaceholder.typicode.com/posts') .then(res => { console.log(res) }, err =>{ console.log(err) })
Verwenden jQuery
$(document).ready(function(){ $.ajax({ url:"https://jsonplaceholder.typicode.com/posts", success: function(response){ console.log(response) }, error: function(error){ console.log(error) }, }); })