Upgrade to Pro — share decks privately, control downloads, hide ads and more …

awkでつくってわかるWebアプリケーション / Web Application Implementation in awk

yammerjp
February 10, 2024

awkでつくってわかるWebアプリケーション / Web Application Implementation in awk

YAPC::Hiroshima 2024での、awkによるWebアプリケーションの実装方法について紹介した発表の資料です。

元となった実装は https://github.com/yammerjp/awkblog にあります。
デモアプリケーションは https://awkblog.net にあります。

yammerjp

February 10, 2024
Tweet

More Decks by yammerjp

Other Decks in Programming

Transcript

  1. 1
    awkでつくってわかる
    Webアプリケーション
    やんまー (中山 慶祐) / GMO PEPABO inc.
    2024.02.10 YAPC::Hiroshima 2024

    View full-size slide

  2. GMOペパボ株式会社 EC事業部 ECグループ
    プロダクトチーム エンジニアリングリード
    2021年 新卒入社
    2
    自己紹介
    中山 慶祐 Nakayama Keisuke
    あだ名: やんまー (yammer)
    Webアプリケーションエンジニア
    趣味: 🤿, dotfiles盆栽, awk
    :   @yammerjp
    https://twitter.com/yammerjp https://github.com/yammerjp

    View full-size slide

  3. 3
    アジェンダ
    1. 自己紹介
    2. awkとは?
    3. HTTPサーバ
    1. レスポンス
    2. リクエストヘッダ
    3. リクエストボディ
    4. その他
    5. デモ

    View full-size slide

  4. 4
    アジェンダ
    1. 自己紹介
    2. awkとは?
    3. HTTPサーバ
    1. レスポンス
    2. リクエストヘッダ
    3. リクエストボディ
    4. その他
    5. デモ
    プログラミング言語awkで
    ブログシステムを作った話
    https://github.com/yammerjp/awkblog

    View full-size slide

  5. 5
    awkとは?

    View full-size slide

  6. 1977 awk
    2024 YAPC::Hiroshima
    2010 Rust
    2009 Go
    1995 PHP, Ruby, JavaScript
    1987 Perl
    1972 C
    6
    awkとは
    1977〜

    View full-size slide

  7. 7
    awkとは
    テキスト処理に特化
    pattern { action }

    View full-size slide

  8. 8
    awkとは
    テキスト処理に特化
    $foo | awk ’{ print $1 }’

    View full-size slide

  9. 9
    awkとは
    テキスト処理に特化
    $foo | awk ’{ print $1 }’
    ここがプログラム

    View full-size slide

  10. 10
    awkとは
    テキスト処理に特化
    😢 classもない
    😢 構造体もない
    😢 try-catchもない
    😢 パッケージマネージャもない

    View full-size slide

  11. 11
    awkとは
    複数の処理系
    awk (One True Awk)
    gawk (GNU Awk)
    nawk
    mawk …

    View full-size slide

  12. 12
    awkとは
    複数の処理系
    awk (One True Awk)
    gawk (GNU Awk)
    nawk
    mawk …
    TCP/IPなどの
    様々な拡張

    View full-size slide

  13. 13
    awkとは
    TCP/IP通信ができる

    View full-size slide

  14. 14
    awkとは
    TCP/IP通信ができる
    Webアプリケーションが作れる

    View full-size slide

  15. 15
    awkとは
    TCP/IP通信ができる
    (色々がんばれば)
    Webアプリケーションが作れる

    View full-size slide

  16. 16
    awkとは
    (色々がんばれば)
    今日はこれについて話します

    View full-size slide

  17. 17
    HTTPサーバ

    View full-size slide

  18. 18
    HTTPサーバ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)

    View full-size slide

  19. 19
    HTTPサーバ
    クライアント
    (Webブラウザ)
    「記事みたい」
    サーバ
    (gawk)

    View full-size slide

  20. 20
    HTTPサーバ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    「記事みたい」
    「ホレッ」
    (HTMLを返す)

    View full-size slide

  21. 21
    HTTPサーバ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)

    View full-size slide

  22. 22
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    「記事を投稿するよ」
    HTTPサーバ

    View full-size slide

  23. 23
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    「記事を投稿するよ」
    「おk」
    (HTMLを返す)
    HTTPサーバ

    View full-size slide

  24. 24
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    「記事を投稿するよ」
    「おk」
    (HTMLを返す)
    HTTPサーバ
    ↑これを実装

    View full-size slide

  25. 25
    HTTPサーバ
    「おk」
    (HTMLを返す)

    View full-size slide

  26. 26
    HTTPサーバ
    「おk」
    (HTMLを返す)
    まずはレスポンス側を実装

    View full-size slide

  27. 27
    HTTPレスポンス

    View full-size slide

  28. 28
    HTTPレスポンス
    HTTPレスポンスとは

    View full-size slide

  29. 29
    HTTPレスポンス
    HTTP/1.1 200 OK
    Content-Length: 61
    Content-Type: text/html; charset=utf-8



    投稿しました


    View full-size slide

  30. 30
    HTTPレスポンス
    HTTP/1.1 200 OK
    Content-Length: 61
    Content-Type: text/html; charset=utf-8



    投稿しました


    このようなテキストを
    出力すればいい

    View full-size slide

  31. 31
    HTTPレスポンス
    awkで実装すると

    View full-size slide

  32. 32
    HTTPレスポンス
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2

    View full-size slide

  33. 33
    HTTPレスポンス
    ↑ファイルに保存して実行できる
    $ gawk -f main.awk _
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2

    View full-size slide

  34. 34
    HTTPレスポンス
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2
    ↑ファイルに保存して実行できる
    $ gawk -f main.awk _

    View full-size slide

  35. 35
    HTTPレスポンス
    - responseを出力する
    - 出力先はTCPのポート
    8080に接続してきた
    クライアント
    |& … 双方向パイプ
    入出力先を指定
    できる記法
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2
    ↑ファイルに保存して実行できる
    $ gawk -f main.awk _

    View full-size slide

  36. 36
    HTTPレスポンス
    大体できた

    View full-size slide

  37. 37
    HTTPレスポンス
    あとはリクエストをもとに
    変数responseの中身を
    変えればいい

    View full-size slide

  38. 38
    HTTPリクエスト

    View full-size slide

  39. 39
    HTTPリクエストヘッダ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    「記事を投稿するよ」
    「おk」
    (HTMLを返す)

    View full-size slide

  40. 40
    HTTPリクエストヘッダ
    「記事を投稿するよ」

    View full-size slide

  41. 41
    HTTPリクエストヘッダ
    「記事を投稿するよ」
    つぎはリクエスト側を実装

    View full-size slide

  42. 42
    HTTPレスポンス
    HTTPリクエストとは

    View full-size slide

  43. 43
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21

    View full-size slide

  44. 44
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    このようなテキストを
    読み込めばいい

    View full-size slide

  45. 45
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ

    View full-size slide

  46. 46
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    まずはヘッダを
    読み込むことを考える

    View full-size slide

  47. 47
    HTTPリクエストヘッダ

    View full-size slide

  48. 48
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは

    View full-size slide

  49. 49
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい





    View full-size slide

  50. 50
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行

    View full-size slide

  51. 51
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    行ごとに





    View full-size slide

  52. 52
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    行ごとに





    RS = ”\r\n”
    入力の区切り文字
    (一回の入力で
    どこまで読むかを宣言)

    View full-size slide

  53. 53
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行

    View full-size slide

  54. 54
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行
    空行ならば
    (1行のByte数) = 0

    View full-size slide

  55. 55
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行
    空行でないならば
    (1行のByte数) > 0

    View full-size slide

  56. 56
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行
    while(INET |& getline && length($0)) {

    View full-size slide

  57. 57
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    リクエストヘッダは
    行ごとに空行まで読めばいい
    空行
    while(INET |& getline && length($0)) {
    1回の入力で
    読んだByte数

    View full-size slide

  58. 58
    HTTPレスポンス
    実装すると

    View full-size slide

  59. 59
    HTTPリクエストヘッダ
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2

    View full-size slide

  60. 60
    HTTPリクエストヘッダ
    行ごとに
    空行まで
    https://gist.github.com/yammerjp/7ca4aedf5e15cbdb6c7f02401cfacfe2

    View full-size slide

  61. 61
    HTTPレスポンス
    ヘッダが読めた

    View full-size slide

  62. 62
    HTTPリクエストボディ

    View full-size slide

  63. 63
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ

    View full-size slide

  64. 64
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    つぎはボディを
    読み込むことを考える

    View full-size slide

  65. 65
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    長さがContent-Length
    からわかる

    View full-size slide

  66. 66
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    指定されたByte数読み込む

    View full-size slide

  67. 67
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    指定されたByte数読み込む
    awkにそんな機能はない🥺

    View full-size slide

  68. 68
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    でも諦めたくない

    View full-size slide

  69. 69
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    でも諦めたくない
    gawkなら、頑張ればできる

    View full-size slide

  70. 70
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ”\r\n”
    入力の区切り文字
    (一回の入力で
    どこまで読むかを宣言)

    View full-size slide

  71. 71
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    入力の区切り文字
    (一回の入力で
    どこまで読むかを宣言)

    View full-size slide

  72. 72
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    gawkでは区切り文字を
    正規表現にできる

    View full-size slide

  73. 73
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    gawkでは区切り文字を
    正規表現にできる
    ” . ” … 任意の一文字

    View full-size slide

  74. 74
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    入力の1文字目を
    区切り文字にする

    View full-size slide

  75. 75
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...

    View full-size slide

  76. 76
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    getlineを一回呼ぶと

    View full-size slide

  77. 77
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    入力結果 $0 は空
    区切り文字は t

    View full-size slide

  78. 78
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    入力結果 $0 は空
    区切り文字は t ← RT に記録される

    View full-size slide

  79. 79
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” . ”...
    1Byte読めた😃

    View full-size slide

  80. 80
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”

    View full-size slide

  81. 81
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”
    getlineを一回呼ぶと

    View full-size slide

  82. 82
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”
    82
    入力結果 $0 は空
    区切り文字は title=YAPC&content=%E6%
    ↑ RT に記録される

    View full-size slide

  83. 83
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”
    ボディを読めた😃

    View full-size slide

  84. 84
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”
    ボディを読めた😃
    読めて欲しかった

    View full-size slide

  85. 85
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{41} ”
    ボディを読めた😃
    動かない🥺

    View full-size slide

  86. 86
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    なぜか、ボディ末尾に
    差し掛かると止まる🥺
    86
    86
    ↓読み込めない

    View full-size slide

  87. 87
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    87
    87
    ↓読み込めない
    原因不明🥺

    View full-size slide

  88. 88
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    88
    88
    ↓読み込めない
    オワタ\(^o^)/

    View full-size slide

  89. 89
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    89
    89
    ↓読み込めない
    諦める

    View full-size slide

  90. 90
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    90
    90
    ↓読み込めない
    後ろの方は読まない

    View full-size slide

  91. 91
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21
    ヘッダ
    ボディ
    RS = ” .{??} ”
    91
    91
    ↓読み込めない
    内容が欠けると困る

    View full-size slide

  92. 92
    HTTPリクエストヘッダ
    POST /articles HTTP/1.1
    Host: example.com
    Content-Length: 41
    Content-Type: application/x-www-form-urlencoded
    Accept: text/html
    title=YAPC&content=%E6%9C%80%E9%AB%98%21xx
    ヘッダ
    ボディ
    RS = ” .{??} ”
    92
    92
    ↓読み込めない
    内容が欠けると困る
    →事前に、不要な文字を足しておく

    View full-size slide

  93. 93
    HTTPリクエストボディ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)

    View full-size slide

  94. 94
    HTTPリクエストボディ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    リバースプロキシ
    (Nginx)

    View full-size slide

  95. 95
    HTTPリクエストボディ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    リバースプロキシ
    (Nginx)
    ボディの末尾に
    512Byte程、無駄
    な文字を付与する
    ボディの後ろ
    512Byteは
    読み飛ばす

    View full-size slide

  96. 96
    HTTPリクエストボディ
    クライアント
    (Webブラウザ)
    サーバ
    (gawk)
    リバースプロキシ
    (Nginx)
    Nginxは proxy_set_body という設定で、ボディを加工できる
    title=YAPC::Hiroshima2024&co
    ntent=%E6%9C%80%E9%AB%
    98%21
    title=YAPC::Hiroshima2024&co
    ntent=%E6%9C%80%E9%AB%
    98%21_____________________
    __________________________
    __________________________
    __________________________
    _…
    title=YAPC::Hiroshima2024&co
    ntent=%E6%9C%80%E9%AB%
    98%21_____________________
    __________________________
    __________________________
    __________________________
    _…
    全部読み込まずに
    レスポンスを返す

    View full-size slide

  97. 97
    HTTPレスポンス
    実装すると

    View full-size slide

  98. 98
    HTTPリクエストボディ
    これでやっとボディを読めた

    View full-size slide

  99. 99
    HTTPレスポンス
    おつかれさまでした♨

    View full-size slide

  100. 100
    HTTPレスポンス
    ここまでの処理を
    実装したファイル
    src/lib/http.awk
    https://github.com/yammerjp/awkblog

    View full-size slide

  101. 101
    その他
    まだ1/67files
    src/lib/http.awk

    View full-size slide

  102. 102
    その他
    時間がないので
    他のトピックは
    紹介にとどめます

    View full-size slide

  103. 103
    その他

    View full-size slide

  104. 104
    その他
    PostgreSQLとの通信
    - gawkはC言語で拡張を書ける
    - 公式の拡張 gawkextlib
    ↑PostgreSQLクライアントもある
    - ビルド済みのDockerイメージを公開中
    yammerjp/gawk-pgsql-docker
    https://github.com/yammerjp/gawk-pgsql-docker

    View full-size slide

  105. 105
    その他
    GitHubログイン
    - gawkのTCP/IPはTLS使えず
    - curlコマンドでGitHub APIと通信
    - OAuth2.0のフローを踏むことで認可

    View full-size slide

  106. 106
    その他
    セッション管理
    - OpenSSLコマンドを実行
    - 共通鍵暗号で暗号化してCookieに保存
    - gawkextlibのRedisクライアントを使
    えばRedis管理も理論上は可能
    ぜひ誰か実装してみてください

    View full-size slide

  107. 107
    その他
    ユニットテスト
    - 簡単なアサーション関数を用意して書く
    {
    # 略
    assertEqual(”expected value”, actual)
    }

    View full-size slide

  108. 108
    その他
    テンプレートエンジン
    - 起動時にテンプレートをすべてパース
    し、1つのawkプログラムにコンパイル
    する方式
    - 別の方式含め2回くらい作り直した
    - awkはテキスト処理が得意。簡潔に強
    力なテンプレートエンジンが作れる

    View full-size slide

  109. 109
    その他
    画像アップロード
    - awkはバイナリを扱うのが難しい
    - Amazon S3の署名付きアップロード
    を利用
    - OpenSSLコマンドを組み合わせ、
    awkプログラム内で署名を生成する
    - オブジェクトストレージ最高!

    View full-size slide

  110. 110
    その他
    URLデコード
    - ブラウザのフォーム送信を受け取り
    - UTF-8のバイト列規則に従い変換
    %E3%81%82 → あ
    余談: awkblogにはJSON APIもあるが、JSON
    デコードはgawkextlibのJSON拡張を利用

    View full-size slide

  111. 111
    その他
    ルーティング
    - awkでは、関数ポインタやラムダ式の
    代わりに @変数名 で、変数に保存さ
    れた文字列の関数を呼び出せる
    - パスをkey, コントローラの関数名を
    valueとした配列をつくる

    View full-size slide

  112. 112
    その他
    MVC
    - Webアプリケーションでよくある構成
    - Model     … src/models/
    - View … views/
    - Controller … src/controllers/

    View full-size slide

  113. 113
    その他
    Markdown
    - awkblogでは、Markdownにも対応
    - awkで書かれたMarkdownパーサを
    改造して取り込ませていただいた
    lumenpink/md2html
    https://github.com/lumenpink/md2html

    View full-size slide

  114. 115
    https://awkblog.net

    View full-size slide

  115. 116
    まとめ

    View full-size slide

  116. awkは楽しい
    117

    View full-size slide

  117. いちから実装するしかないので
    Webアプリケーション全体を
    俯瞰できる
    118

    View full-size slide

  118. 大変すぎる
    すぐバグる
    120

    View full-size slide

  119. 200 OKを返しているのに
    エラーが起きまくる
    121

    View full-size slide

  120. Webアプリケーションは
    awkじゃない言語で作ろう
    123
    複雑な

    View full-size slide