LoginSignup
683

More than 1 year has passed since last update.

posted at

updated at

JSONを返す無料APIを3分で作る方法

JSONを返す無料APIを3分で作る方法

はじめに

この記事の読書対象者は以下のようなエンジニアです。

  • Ajaxで叩くAPIを用意してあげようとしている新人教育中の優しい先輩
  • なんかのサンプルアプリを作っているときのモックとして

API作成

  • 実際に通信する
    • Google Apps Script (GAS)で作成する
    • MyJson (既存のWebサービス)でJsonを登録する
  • ローカルサーバーを立てる
    • json-server(npmで導入する)

Google Apps Script(GAS)を使う

以下のコードをGASに貼り付けて、「公開」「ウェブアプリケーションとして導入」を押して発行されたURLを叩くと文字列のJSONが返ってくる。

function doGet(e) {
  return ContentService.createTextOutput(JSON.stringify({'name': 'Qiita'}))
    .setMimeType(ContentService.MimeType.JSON);
}

スクリーンショット

参考: https://developers.google.com/apps-script/guides/content#serving_json_from_scripts

GetメソッドにtokenをつけてたらJsonを返すとかそういう処理もできるのでオススメ!

Json okibaというWebサービスを使う

日本語で使えるサイトです。保存する前に動的にで正しいJSON形式かチェックしてくれます。https://json.okiba.me/

curl https://jsondata.okiba.me/v1/json/z9Hu6180423002129
# {
# "name": "ジェイソン",
# "movie": "13日の金曜日"
# }

情報ありがとうございます @imai さん

localにjson-serverを立てて使う

Node.js等を使える人はjson-serverがおすすめみたいです!

参考:JSON Serverを使って手っ取り早くWebAPIのモックアップを作る

npm install -g json-server

npmインストールとか必要だけどAPIモックにするのにはすごく便利なのでオススメ!

API GatewayのMockを使う

awsサービス使っている方は楽

その他

Gistを使ってもいけた。

var url = 'https://api.github.com/gists/3137d994d72040d00a84f422349757d4';

fetch( url )
.then( function( data ) {
  return data.json();
})
.then( function( json ) {
  console.log( json.files['sample.json'].content );
})
# json
curl https://api.github.com/gists/3137d994d72040d00a84f422349757d4

お手軽ではないです。

終わりに

AjaxとかAPIとかよくわかってなかった時期がありました。それくらいのレベルの人に教えるときに先輩エンジニアが「API作っといたのでこれ自由に叩いていいよ」って感じの世界素敵ですね!!

それでは素敵なAPIライフを!!

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
683