Skip to content

Instantly share code, notes, and snippets.

@xgqfrms
Created May 9, 2020 15:56
Show Gist options
  • Save xgqfrms/17679dc105beb09c9955293963f52a1d to your computer and use it in GitHub Desktop.
Save xgqfrms/17679dc105beb09c9955293963f52a1d to your computer and use it in GitHub Desktop.
Fetch All in One

Fetch All in One

Fetch POST All in One

https://www.cnblogs.com/xgqfrms/p/9006886.html

"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2020-05-09
 * @modified
 *
 * @description fetch-restful-all-in-one.js
 * @augments
 * @example
 * @link https://www.cnblogs.com/xgqfrms/p/9006886.html
 *
 */

const log = console.log;

const json = { id: '123', name: 'admin' };
const csrftoken = document.cookie.split(';').map(item => item.trim()).map(item => ({[item.split(`=`)[0]]: item.split(`=`)[1]})).filter(obj => obj.csrfToken)[0].csrfToken;;

const url = `http://localhost:7001/product/create`;

fetch(url, {
  headers: {
    "Content-Type": "application/json",
    "x-csrf-token": csrftoken,
  },
  credentials: "include",// cookie
  // credentials: "same-origin",
  method: "POST",
  mode: "cors",
  body: JSON.stringify(json),
})
// .then(res => res.text())
.then(res => res.json())
.then(json => {
  // log(`text =`, json);
  log(`json =`, JSON.stringify(json, null, 4));
  return json;
})
.catch(err => console.error(`error =`, err));


const update_url = `http://localhost:7001/product/update/123`;
fetch(update_url, {
  headers: {
    "Content-Type": "application/json",
    "x-csrf-token": csrftoken,
  },
  credentials: "include",
  method: "PUT",
  mode: "cors",
  body: JSON.stringify(json),
})
.then(res => res.json())
.then(json => {
  log(`json =`, JSON.stringify(json, null, 4));
  return json;
})
.catch(err => console.error(`error =`, err));


const delete_url = `http://localhost:7001/product/delete/123`;
fetch(delete_url, {
  headers: {
    "Content-Type": "application/json",
    "x-csrf-token": csrftoken,
  },
  credentials: "include",
  method: "DELETE",
  mode: "cors",
  body: JSON.stringify(json),
})
.then(res => res.json())
.then(json => {
  log(`json =`, JSON.stringify(json, null, 4));
  return json;
})
.catch(err => console.error(`error =`, err));

@xgqfrms
Copy link
Author

xgqfrms commented Sep 28, 2020

fetch api

import 'whatwg-fetch';
// fetch polyfill

const url = <code>https://abc.xgqfrms.xyz/some-url</code>;

const headers = new Headers({
    'Content-Type': 'text/plain',
    'X-My-Custom-Header': 'CustomValue'
});

const datas = JSON.stringify(
    {
        user: "username",
        pwd: "password"
    }
);

const method = <code>POST</code>;

const request = new Request(url, {
    headers: headers,
    method: 'POST', 
    mode: 'cors', 
    redirect: 'follow',
    body: datas
});

fetch(
    request
).then(
    (response) => response.json()
).catch(
    (err) => {
        console.log(<code>err</code>, err);
        throw new Error("Whoops, An Error occurred!");
    }
);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment