Javascript Recovery
__del__ |
__delete__ |
code Python module |
COM PHP module |
dis Python module |
Ev PHP module |
Event PHP module |
exp |
Expect PHP module |
http Python module |
iat |
imp Python module |
io Python module |
JavaScript |
jQuery JavaScript library |
json Python module |
Network PHP module |
os Python module |
PS PHP module |
Python functions |
Rar PHP module |
re Python module |
resource Python module |
SPL PHP module |
StackOverflow |
stat Python module |
struct Python module |
test Python module |
time Python module |
tty Python module |
UI PHP module |
xml Python module
Michael Zippo
04.11.2021
👻 Check our latest review to choose the best laptop for Machine Learning engineers and Deep learning tasks!
Did you know that you can do web requests in vanilla JavaScript? Which is fair, you don’t need to install any libraries to make a web request. That’s not all: we are not talking about the old and complex XMLHttpRequest tool
The fetch API allows to perform Ajax requests in good old JavaScript. It is a useful tool for the recovery of data and make changes to the data on a web server.
In this guide, we will discuss what the Recovery API is and how to make web requests using the "API." We will talk about two examples:. A GET request and a POST request
What is the Fetch API
Has JavaScript been able to send network requests for a long time ?. The XMLHttpRequest tool has provided the resources to recover data from to a server information and update day to go to a server.
While this tool was effective, it was also very chatty and complicated to use. Fetch, on the other hand, is a new alternative that makes it easier to make web requests.
The fetch API is supported in all modern browsers. This means that once you learn how to use it, you won’t have to worry about browser compatibility when making web requests.
How to do a GET request using fetch
The best way to illustrate how fetching is eg. For this tutorial, we will be using the JSONPlaceholder web service. This is an API that comes with pre-written dummy data that we can use to test our web requests
The following code creates a GET request to retrieve the first post from JSONPlaceholder.
This code returns:
pause Let our code. In the first line, we used the fetch () to make a web request to the JSONPlaceholder API. We then used the . then () to indicate our code what to do after our web request is done
In our first . then () , we convert the response returned by the JSON API. This makes our data more readable. we use another .then () to log the response to the console. This shows us the post with ID 1 from the JSONPlaceholder API.
How to make a pOST request
GET is not the only type of request you can make with the API lookup. There is also a feature which supports POST, PUT and DEL requests. the syntax for these is the same, so we’ll just look at an example: how to do a POST
During a POST, PUT or DELETE request, three pieces of information are usually needed to clarify:.
- The URL you are requesting from.
- The method you are using on demand and t requests (in this case, POST)
- The data you want to send to the server
Here is a code snippet that would create a new comment using the JSONPlaceholder API:
Our code returns our newly created post in JSON format:
In our code, we first declare a data object. This stores the data that we want to send to the server. In this case, we are submitting data on a comment made by a user named Leslie Tudor.
We then declare another object that stores the options associated with our fetch request . This object specifies the method we use to make our request (POST), the data we want to send, and the headers we want to send
Finally, we use the fetch () to actually make our request. Like in our first example, we use . then () to fetch the response, convert it to JSON and then print it to the console.
How to Handle Errors Using JavaScript Fetch
It is an unfortunate fact that some web requests do not work as expected. Perhaps that the data is structured incorrectly or maybe there is a problem with the server. It is important to anticipate these events in advance so that you can manipulate them if and when they occur.
There is a method called .catch () which you can use to catch any errors returned by your code. Combined with Promise.reject (), you can use it to handle errors:
This code returns:
In our code, we used the response.ok method to check if our request was successful. In this example, we tried to retrieve a comment that does not exist, comment # 999. This causes the contents of our other statement to be executed, which returns a rejected promise. This promise contains the error message returned by the JSONPlaceholder API.
We then used a .catch () statement to receive this error and print it to the console.
Conclusion
The API look up makes it easy to execute web requests in JavaScript. The API is part of vanilla JavaScript, so you don’t need to install or reference any libraries. You can also use API to do fetch GET, POST, PUT and DELETE requests
.
