Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #514 from Chalarangelo/XMLHttpRequest
[FEATURE] http requests snippets
- Loading branch information
Showing
5 changed files
with
122 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
### httpGet | ||
|
||
Makes a `GET` request to the passed URL. | ||
|
||
Use [`XMLHttpRequest`](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) web api to make a `get` request to the given `url`. | ||
Handle the `onload` event, by calling the given `callback` the `responseText`. | ||
Handle the `onerror` event, by running the provided `err` function. | ||
Omit the third argument, `err`, to log errors to the console's `error` stream by default. | ||
|
||
```js | ||
const httpGet = (url, callback, err = console.error) => { | ||
const request = new XMLHttpRequest(); | ||
request.open("GET", url, true); | ||
request.onload = () => callback(request.responseText); | ||
request.onerror = () => err(request); | ||
request.send(); | ||
}; | ||
``` | ||
|
||
```js | ||
httpGet('https://jsonplaceholder.typicode.com/posts/1', console.log); /* | ||
Logs: { | ||
"userId": 1, | ||
"id": 1, | ||
"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit", | ||
"body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto" | ||
} | ||
*/ | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
### httpPost | ||
|
||
Makes a `POST` request to the passed URL. | ||
|
||
Use [`XMLHttpRequest`](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest) web api to make a `post` request to the given `url`. | ||
Set the value of an `HTTP` request header with `setRequestHeader` method. | ||
Handle the `onload` event, by calling the given `callback` the `responseText`. | ||
Handle the `onerror` event, by running the provided `err` function. | ||
Omit the third argument, `data`, to send no data to the provided `url`. | ||
Omit the fourth argument, `err`, to log errors to the console's `error` stream by default. | ||
|
||
```js | ||
const httpPost = (url, callback, data = null, err = console.error) => { | ||
const request = new XMLHttpRequest(); | ||
request.open("POST", url, true); | ||
request.setRequestHeader('Content-type','application/json; charset=utf-8'); | ||
request.onload = () => callback(request.responseText); | ||
request.onerror = () => err(request); | ||
request.send(data); | ||
}; | ||
``` | ||
|
||
```js | ||
const newPost = { | ||
"userId": 1, | ||
"id": 1337, | ||
"title": "Foo", | ||
"body": "bar bar bar" | ||
}; | ||
const data = JSON.stringify(newPost); | ||
httpPost('https://jsonplaceholder.typicode.com/posts', console.log, data; /* | ||
Logs: { | ||
"userId": 1, | ||
"id": 1337, | ||
"title": "Foo", | ||
"body": "bar bar bar" | ||
} | ||
*/ | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
### httpDelete | ||
|
||
Makes a `DELETE` request to the passed URL. | ||
|
||
Use `XMLHttpRequest` web api to make a `delete` request to the given `url`. | ||
Handle the `onload` event, by running the provided `callback` function. | ||
Handle the `onerror` event, by running the provided `err` function. | ||
Omit the third argument, `err` to log the request to the console's error stream by default. | ||
|
||
```js | ||
const httpDelete = (url, callback, err = console.error) => { | ||
const request = new XMLHttpRequest(); | ||
request.open("DELETE", url, true); | ||
request.onload = () => callback(request); | ||
request.onerror = () => err(request); | ||
request.send(); | ||
}; | ||
``` | ||
|
||
```js | ||
httpDelete('https://website.com/users/123', request => { | ||
console.log(request.responseText); | ||
}); // 'Deletes a user from the database' | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
### httpPut | ||
|
||
Makes a `PUT` request to the passed URL. | ||
|
||
Use `XMLHttpRequest` web api to make a `put` request to the given `url`. | ||
Set the value of an `HTTP` request header with `setRequestHeader` method. | ||
Handle the `onload` event, by running the provided `callback` function. | ||
Handle the `onerror` event, by running the provided `err` function. | ||
Omit the last argument, `err` to log the request to the console's error stream by default. | ||
|
||
```js | ||
const httpPut = (url, data, callback, err = console.error) => { | ||
const request = new XMLHttpRequest(); | ||
request.open("PUT", url, true); | ||
request.setRequestHeader('Content-type','application/json; charset=utf-8'); | ||
request.onload = () => callback(request); | ||
request.onerror = () => err(request); | ||
request.send(data); | ||
}; | ||
``` | ||
|
||
```js | ||
const password = "fooBaz"; | ||
const data = JSON.stringify(password); | ||
httpPut('https://website.com/users/123', data, request => { | ||
console.log(request.responseText); | ||
}); // 'Updates a user's password in database' | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters