caller: block & nonblock

caller會等 => block caller不等 => nonblock (所以要自己時不是去確認好了沒，或是，callee通知)

return val: (general’s) sync & async

調用後會拿到 sync: 我們想要的資料 async: 類似raincheck的東西，也許馬上，也許要一段時間後，才會拿到我們想要的資料

要不要自己把copy到userspace的io做完: (NP’s) sync & async

前面4種都是最後要自己call system call拉資料，所以是sync，最後user與kernel的任務會同時完成

async io是user連什麼時候完成都不知道，等到kernel把資料copy好就會call callback

AJAX

var httpRequest = httpRequest = new XMLHttpRequest();

httpRequest.onreadystatechange = function() {

    // 等狀態變成請求完成狀態
    if (httpRequest.readyState === 4 && httpRequest.status == 200) {
        httpRequest.responseText
    }
    alert(`ERROR - server status code: ${httpRequest.status} xdr status: ${httpRequest.readyState}`);
};

httpRequest.open('GET', '/api/get_something');
httpRequest.send(null);

httpRequest.open('POST', '/api/test.php');
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); // 注意CORS
httpRequest.send(`name=value&anothername=${encodeURIComponent(myVar)}&so=on`);

fetch API

function postData(url, data) {
  // Default options are marked with *
  return fetch(url, {
    body: JSON.stringify(data), // must match 'Content-Type' header, and data can be `string` or {object}!
    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
    credentials: 'same-origin', // include, same-origin, *omit
    headers: {
      'user-agent': 'Mozilla/4.0 MDN Example',
      'content-type': 'application/json'
    },
    method: 'POST', // *GET, POST, PUT, DELETE, etc.
    mode: 'cors', // no-cors, cors, *same-origin
    redirect: 'follow', // manual, *follow, error
    referrer: 'no-referrer', // *client, no-referrer
    credentials: 'omit', // same-origin, include
  })
  .then(response => response.json()) // 輸出成 json
}

formdata

var formData = new FormData();
var fileField = document.querySelector("input[type='file']");

formData.append('username', 'abc123');
formData.append('avatar', fileField.files[0]);

custom headers

var myHeaders = new Headers();
myHeaders = new Headers({
  "Content-Type": "text/plain",
  "Content-Length": content.length.toString(),
  "X-Custom-Header": "ProcessThisImmediately",
});
myHeaders.append("Content-Type", "text/plain");

custom request

var myInit = { method: 'GET',
               headers: myHeaders,
               mode: 'cors',
               cache: 'default' };

var myRequest = new Request('flowers.jpg', myInit);
fetch(myRequest).then(function(response) {
  return response.blob();
}).then(function(myBlob) {
  var objectURL = URL.createObjectURL(myBlob);
  myImage.src = objectURL;
});

Ref

MDN 比較general的sync 比較np的sync