Slide 1
Slide 1 text
YouTube Live (2020.10.08 Thur. 21:00~)
Slide 2
Slide 2 text
話す人
現役のエンジニア二人
赤貝が好きな CTO と
デザイン勉強中のエンジニア
@mu_vpoe
最近の仕事は figma で画
面設計をつくることで
す。英語の勉強してる。
ムー
zaru
@zaru
CTO, Love 赤貝,
JavaScript, Firebase,
Web Components.
Twitter フォロー
お願いします！
Slide 3
Slide 3 text
話すこと
curl の魅力
curl の基本的な使い方
jq の基本的な使い方
curl の一歩進んだ使い方
Slide 4
Slide 4 text
curl は便利で楽しい
Slide 5
Slide 5 text
ipinfo.io
自分のグローバル IP アドレスやプロバイダなどの
ネットワーク情報を確認できる
ipinfo.io/xxx.xxx.xxx.xxx と後ろに IP アドレスを
付けると指定の IP 情報を取得できる
Slide 6
Slide 6 text
qrenco.de
QR コードを生成できるサービス
Slide 7
Slide 7 text
wttr.in
各国の天気が見られる
Slide 8
Slide 8 text
rate.sx
ビットコインなどのレートが見れる
Slide 9
Slide 9 text
asciitv.fr
アスキーアートでスターウォーズ見れる
Slide 10
Slide 10 text
ascii.live/nyan
みんな大好き nyan-cat
Slide 11
Slide 11 text
つまり curl は便利で楽しい
Slide 12
Slide 12 text
jq で JSON
Slide 13
Slide 13 text
JSON を取り扱う悩み
Slide 14
Slide 14 text
JSON を返す API にアクセスしたら…見にくい！
Slide 15
Slide 15 text
email キーはどんな階層構造なんだ…？
Slide 16
Slide 16 text
そんな時に jq コマンド
https://stedolan.github.io/jq/download/
ここからダウンロード＆インストール
Slide 17
Slide 17 text
jq コマンドに渡すとフォーマットしてくれる
Slide 18
Slide 18 text
キーの階層構造リストを表示することもできる
Slide 19
Slide 19 text
つまり jq は凄い
Slide 20
Slide 20 text
curl の基本
Slide 21
Slide 21 text
ページを取得する
$ curl https://example.com
$ curl -o ouput.html https://example.com
コマンド
普通に見るだけならオプションなしで URL を指定すれば OK
ダウンロードしたい場合は -o もしくは --output オプション
でファイル名を指定すれば保存することができる
Slide 22
Slide 22 text
POST する
$ curl -d "name=zaru" -d "hoge=piyo" https://example.com
コマンド
-X POST で明示的に POST メソッドを使えるが
-d や --data でデータ送信をすると自動で POST になる
デフォルトで Content-Type は
application/x-www-form-urlencoded になる
（ タグの enctype 属性の初期値）
Slide 23
Slide 23 text
JSON を POST する
$ curl -H "Content-Type: application/json" \
-d '{ "key" : "value" }' https://example.com
コマンド
Content-Type を -H (Header) で application/json と明
示することで、受け取るサーバ側がパラメータを JSON と
して認識する。
Slide 24
Slide 24 text
JSON ファイル を POST する
$ curl -H "Content-Type: application/json" \
-d @params.json https://example.com
コマンド
大きな JSON を POST したい場合は JSON ファイルを指定
することもできる。curl では @ファイル名 を付けるとファ
イルを読み込むことができる
Slide 25
Slide 25 text
BASIC 認証
$ curl -u id:password https://example.com
コマンド
↓BASIC 認証以外に Digest 認証などを通したい場合
$ curl --digest -u id:password https://example.com
$ curl --any-auth -u id:password https://example.com
コマンド
Slide 26
Slide 26 text
API キーを指定する
$ curl -H 'Authorization: Bearer xxxxx'
https://example.com
コマンド
よくある API キーを Header に指定してねという時は、-H
オプションで Header を書くことができる。Header の指定
方法は API によって異なる
Slide 27
Slide 27 text
よく使うオプション
-d / --data : POST したいパラメータ
-H / --header : リクエスト Header を指定する
-u : BASIC 認証の ID Password を指定する
curl 基本のまとめ
Slide 28
Slide 28 text
curl をブラウザから作る
Chrome の DevTool にある Network から実際にブラウザでリクエス
トしたものを curl コマンドにすることができる
Slide 29
Slide 29 text
jq の基本
Slide 30
Slide 30 text
値アクセスは .
jq 'セレクタ'
コマンド
jq コマンドにセレクタを渡すことで任意の情報にアクセスすることができる。
jq '.user.name'
#=> "zaru"
コマンド
{
"user": {
"name": "zaru"
}
}
json
. ドットで key を接続することでオブジェ
クトの値にアクセスすることができる
Slide 31
Slide 31 text
配列は []
jq '.users[]'
#=> "zaru"
"mu"
jq '.users[0]'
#=> "zaru"
コマンド
{
"users": [
"zaru",
"mu"
]
}
json
[] で配列要素にアクセスができる。0から
始まるインデックス番号を指定することも
できる
Slide 32
Slide 32 text
整形は | と {}
jq '.users[] | { key: .name }'
{
"key": "zaru"
}
{
"key": "mu"
}
コマンド
{
"users": [
{
"id": 1,
"name": "zaru",
"profile_image":
"https://example.com/zaru.png",
"address": "北海道"
},
{
"id": 2,
"name": "mu",
"profile_image":
"https://example.com/mu.png",
"address": "沖縄"
}
]
}
json
| (パイプ)でデータを渡して連携
できる。 {} で指定フォーマット
にすることもできる
Slide 33
Slide 33 text
curl の一歩先
Slide 34
Slide 34 text
Cookie を送信する
$ curl -b 'key=val; key2=val2;' https://example.com
コマンド
-b または --cookie オプションで、セミコロン区切りの
key-value を送信することができる
Slide 35
Slide 35 text
Cookie を保存する
$ curl -c cookie.txt https://example.com
コマンド
サーバから返される Set-Cookie のデータを -c オプション
で指定したファイルに保存することができる。主にログイン
時のセッションキーを保存するのに使ったりする
$ cat cookie.txt
# Netscape HTTP Cookie File
# https://curl.haxx.se/docs/http-cookies.html
# This file was generated by libcurl! Edit at your own risk.
localhost FALSE / FALSE 0 key value
保存される Cookie ファイルの中身
Slide 36
Slide 36 text
保存した Cookie を送信する
$ curl -b cookie.txt https://example.com
コマンド
-b オプションにファイル名を指定すると（正確には = が含
まれていないと）、-c オプションで保存したファイル形式
の Cookie を送信できる。大量の Cookie を送りたかったり
する時に便利。
Slide 37
Slide 37 text
ファイルをアップロードする
$ curl -F fi[email protected] https://example.com
コマンド
-F または --form オプションでファイル名とファイルパス
を指定することで Content-Type multipart/form-data
で POST することができる（ タグの enctype
multipart/form-data と同じ）。
Slide 38
Slide 38 text
jq の一歩先
Slide 39
Slide 39 text
.. で再起検索
jq '.. | .name?'
コマンド
JSON の中にあるはずだが、どの階層にあるのかが分からな
いけど、とりあえず見つけたい。という時に使う。
.. で再起的に探してくれるので、パイプで指定のキーを付け
る。存在しないオブジェクトもあるので ? で null を無視す
る
Slide 40
Slide 40 text
階層構造を表示
jq '[path(..) | map(if type=="number" then "[]" else
tostring end) | join(".") | split(".[]") | join("[]")] | unique
| map("."+.) | .[]'
コマンド
魔法すぎる感じですが… JSON の階層構造を良い感じに表示
してくれる。これを読み解ければ jq マスターが近い！
Slide 41
Slide 41 text
curl 番外編
Slide 42
Slide 42 text
レスポンス速度を計測
$ curl https://example.com -s -o /dev/null \
-w "%{time_total}\n"
コマンド
-w オプションで curl のいろんな情報を変数指定で表示す
ることができる。 time_total がレスポンス時間。
また、余計な出力をなくしたいので -s または --silent オプ
ションでダウンロード進捗を消し、 -o または --output オ
プションでダウンロードした内容を /dev/null の闇に放り
投げる。
Slide 43
Slide 43 text
ベンチマークする
$ for i in {1..10}; do curl https://example.com \
-s -o /dev/null -w "%{time_total}\n"; end | \
awk '{sum+=$1;print $1} END {print "AVG: " sum/NR}
コマンド
10回のリクエストを送り、出力されたレスポンスタイムを
awk で平均値をとるコマンド例
awk 自体の解説はまたの今度に…
NR は組み込み変数で行数を表します
Slide 44
Slide 44 text
レスポンスヘッダのみ表示
$ curl -I http://example.com/
コマンド
-I もしくは --head オプションでレスポンスヘッダのみ表示
することができる。レスポンスボディが大きくて見にくい時
に使う
Slide 45
Slide 45 text
URL は動的に変えられる
$ curl http://example.com/[1-100].jpg
$ curl https://example.com/{hoge,piyo,fuga}.jpg
コマンド
表現は限られるが、[n-m] で連番、 {n,m} で指定ワードで
URL を生成して連続でリクエストすることができる
Slide 46
Slide 46 text
ありがとうございました！
次回は... 未定！
質問感想など呟いていただけると嬉しいです！
- ハッシュタグ #mu_zaru
- ツイッター情報 @mu_vpoe , @zaru チャンネル登録
Good ボタン
お願いします！
ムーザルちゃんねる