{JSON} Placeholder JSON 假資料 API

{JSON} Placeholder JSON 假資料 API

網站：JSONPlaceholder - Free Fake REST API

{JSON} Placeholder

資源

類型 API 網址
文章 100 篇 https://jsonplaceholder.typicode.com/posts
留言 500 筆 https://jsonplaceholder.typicode.com/comments
相簿 100 筆 https://jsonplaceholder.typicode.com/albums
照片 5000 張 https://jsonplaceholder.typicode.com/photos
代辦事項 200 個 https://jsonplaceholder.typicode.com/todos
使用者 10 個 https://jsonplaceholder.typicode.com/users

路由操作

類型 HTTP Method API 網址
第一篇文章 GET https://jsonplaceholder.typicode.com/posts/1
第一篇文章的留言 GET https://jsonplaceholder.typicode.com/posts/1/comments
第一篇文章的留言 GET https://jsonplaceholder.typicode.com/comments?postId=1
新增文章 POST https://jsonplaceholder.typicode.com/posts
更新文章 PUT https://jsonplaceholder.typicode.com/posts/1
更新部分文章資訊 PATCH https://jsonplaceholder.typicode.com/posts/1
刪除文章 DELETE https://jsonplaceholder.typicode.com/posts/1

新增文章

Code

fetch('https://jsonplaceholder.typicode.com/posts', {
  method: 'POST',
  body: JSON.stringify({
    title: 'foo',
    body: 'bar',
    userId: 1,
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then((response) => response.json())
  .then((json) => console.log(json));

Response

{
  "id": 101,
  "title": "foo",
  "body": "bar",
  "userId": 1
}

更新文章

Code

fetch('https://jsonplaceholder.typicode.com/posts/1', {
  method: 'PUT',
  body: JSON.stringify({
    id: 1,
    title: 'foo',
    body: 'bar',
    userId: 1,
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then((response) => response.json())
  .then((json) => console.log(json));

Response

{
  "id": 1,
  "title": "foo",
  "body": "bar",
  "userId": 1
}

更新部分文章資訊

Code

fetch('https://jsonplaceholder.typicode.com/posts/1', {
  method: 'PATCH',
  body: JSON.stringify({
    title: 'foo',
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then((response) => response.json())
  .then((json) => console.log(json));

Response

{
  "id": 1,
  "title": "foo",
  "body": "...",
  "userId": 1
}

刪除文章 

fetch('https://jsonplaceholder.typicode.com/posts/1', {
  method: 'DELETE',
});

參考資料