JSONPlaceholderとは？（APIツールのテスト、プログラミング学習に最適）

こにし じゅんぺい
プログラミング

JSONPlaceholderは便利なオンライン上のREST APIサービスです。URLにアクセスするだけで、手軽にテストデータをJSONで受け取ることができます。
JSONPlaceholder

実際にAPIを叩いてみた

curlコマンドで実際に叩いてみました。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
$ curl -i "https://jsonplaceholder.typicode.com/posts/1"
HTTP/2 200
date: Sat, 09 Nov 2019 09:17:01 GMT
content-type: application/json; charset=utf-8
content-length: 292
set-cookie: __cfduid=d259dcf35f5ee0dbe46d4484f9d84d48d1573291021; expires=Sun, 08-Nov-20 09:17:01 GMT; path=/; domain=.typicode.com; HttpOnly
x-powered-by: Express
vary: Origin, Accept-Encoding
access-control-allow-credentials: true
cache-control: private, max-age=14400
pragma: no-cache
expires: -1
x-content-type-options: nosniff
etag: W/"124-yiKdLzqO5gfBrJFrcdJ8Yq0LGnU"
via: 1.1 vegur
cf-cache-status: HIT
age: 5803
accept-ranges: bytes
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
server: cloudflare
cf-ray: 532eb0f46b879509-NRT
 
{
  "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"
}

POSTで送信してみました。

1
2
3
4
5
6
$ curl -X POST "https://jsonplaceholder.typicode.com/users" \
-d  "users=junpeko"
{
  "users": "junpeko",
  "id": 11
}%

1段階ネストされたルートも利用可能です。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$ curl "https://jsonplaceholder.typicode.com/users/1/posts"
[
  {
    "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"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "qui est esse",
    "body": "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla"
  },
  {
    "userId": 1,
    "id": 3,
(以下省略)

APIツールのテスト利用

個人的にお気に入りのPostman(https://www.getpostman.com/)で実行してみます。UIかっこいいですよね。

GETを選択し、URLを入力。SENDをクリックします。

下にレスポンスが返って来ていますね。

JSONPlaceholderは、GETだけではなく、POSTやPUT、DELETEも利用できるため、APIツールのテストやフロントエンドのプログラミングの学習に最適ではないでしょうか？