diff --git a/snippets/httpGet.md b/snippets/httpGet.md new file mode 100644 index 000000000..abd31ac15 --- /dev/null +++ b/snippets/httpGet.md @@ -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" +} +*/ +``` diff --git a/snippets/httpPost.md b/snippets/httpPost.md new file mode 100644 index 000000000..ae5c43469 --- /dev/null +++ b/snippets/httpPost.md @@ -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" +} +*/ +``` diff --git a/snippets_archive/httpDelete.md b/snippets_archive/httpDelete.md new file mode 100644 index 000000000..34a42d5df --- /dev/null +++ b/snippets_archive/httpDelete.md @@ -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' +``` diff --git a/snippets_archive/httpPut.md b/snippets_archive/httpPut.md new file mode 100644 index 000000000..4f9dbd785 --- /dev/null +++ b/snippets_archive/httpPut.md @@ -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' +``` diff --git a/tag_database b/tag_database index 4981f6476..8487312ed 100644 --- a/tag_database +++ b/tag_database @@ -62,6 +62,8 @@ hasFlags:node head:array hexToRGB:utility,string,math,advanced hide:browser,css +httpGet:utility,url,browser +httpPost:utility,url,browser httpsRedirect:browser,url indexOfAll:array initial:array