サーバレスでサンタを追いかけよう!

  • 0
    いいね
  • 0
    コメント

    Merry Christmas !

    ホッホゥー 良い子のみんな明日は待ちに待ったクリスマスじゃぞ。
    ワシは今日からみんなにプレゼントを配るのに大忙しじゃ。

    …ということでServerless Adventカレンダー(2)12/24にエントリした以上はクリスマスっぽいことをせねばならぬという謎の使命感でネタを考えました。

    何かサンタっぽいもの…ということで

    • AWS Rekognitionでサンタと髭面泥棒を見分ける「Santa or Thief」
      • →Rekognitionの個人識別能力が素晴らしすぎてサンタさんも泥棒も個人個人になってしまって断念
    • サンタさんにお願いするといつの間にやらAmazonに注文されているサービス
      • →そもそもAmazonをWrapするサービスを世に出すと怒られそう

    というくだらないネタを考えて断念しました。

    ということでGoogle Santa TrackerAWS S3 WebHostingで動かすという「マジそれサーバーレス扱いかよ!」というネタで挑みます。そして砕け散ります。

    https://github.com/NewGyu/qiita-xmas

    前提

    以下のものが必要です。

    • Docker
    • node.js v4以上

    まずは自分の手元で確かめる

    $ git clone https://github.com/NewGyu/qiita-xmas.git
    $ cd qiita-xmas
    $ docker-compose up
    :
    :
    Attaching to xmas_santa_1, xmas_viewer_1
    xmas_santa_1 exited with code 0
    

    これによって行われることは、

    1. santatrackerのソースのビルド
      10分くらいかかるので気長に待ちましょう
    2. ビルドされたものをnginxでホスティング

    です。

    Attaching to ...が出たら完了で、 http://localhost:3000 にアクセスしましょう。

    サンタさんを公開する

    S3バケットを作る

    自分のドメイン名を設定する

    infra/template/index.jsの下記の部分を自分の所有するドメインに変更してください。

    index.js
    const DomainName = "xmas.kinoboku.net";
    

    ※事前にRoute53にHostedZoneを作ってNSレコード、SOAレコードを登録しておいてください。

    参考: http://qiita.com/sadayuki-matsuno/items/4c371ba984d9b22b3737#2%E3%81%8A%E5%90%8D%E5%89%8Dcom%E3%81%ABroute53%E3%81%AEdns%E3%82%92%E7%99%BB%E9%8C%B2%E3%81%97%E3%81%A6%E3%82%B5%E3%83%96%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%82%92%E5%A7%94%E4%BB%BB%E3%81%99%E3%82%8B

    CloudFormationの実行

    S3バケットとRoute53のDNSレコードを作ります。

    $ cd ./infra
    $ npm install
    $ AWS_PROFILE=newgyu npm start deploy
    

    ※ AWS_PROFILEに設定する値は自分の~/.aws/credentialsの定義に合わせてください

    これでS3バケットが作成され、PublicなWebHostingが可能な状態となります。

    S3にsanta-trackerの成果物を配置する

    $ AWS_PROFILE=newgyu docker-compose -f publish.yaml up
    

    これによって行われることは、

    1. santatrackerのソースのビルド
      10分くらいかかるので気長に待ちましょう
    2. ビルドされたものをs3 syncでS3バケットに配置

    です。

    http://xmas.kinoboku.net/ にアクセスするとSanta Tracker が動作します。

    だがしかし!

    悔しながら青い画面が出たきりでサンタさんの村は出てきません。。マジつらい。

    ChromeのDeveloper Consoleを見ると

    elements_en.js:16280
    Uncaught TypeError: (intermediate value)(intermediate value)(intermediate value)(intermediate value)(...) is not a function(…)(anonymous function) @ elements_en.js:16280
    

    というメッセージが出ておりビルドしたSanta Trackerのソースにエラーがあるようです。
    Santa Trackerのビルドはgulpfile.jsを見ていただくとわかるようにClosure Compilerで連結+minifyをしています。ここの処理で作られるelements_en.jsに何か問題があるようです。力尽きてしまったのでどなたか教えていただけると幸いです。

    2015年版のSanta Trackerのソースには公式READMEどおりに素直にビルドできないいくつかの問題がありました。Dockerfileの中でパッチを当てて吸収したつもりなのですが、対処方法に間違っているところがあるのかもしれません。

    Dockerfileでやっているパッチ内容を簡単に解説します。

    1. 実はgulp-cliが必要

    公式説明ではnpm installだけでいいぜ、となっているのですが、package.jsonのpost installでgulp-cliを必要としています。

    2. Dockerコンテナ内でrootユーザーで動かすにはbowerにオプション指定が必要

    bower installは非rootユーザー前提にしているらしく、rootユーザーで実行するには--allow-rootオプションが必要でした。
    (これは私がDockerですべてを片付けようとして、めんどくさいからrootユーザーを使ったが故の問題です)

    3. closure-compilerのjarにバージョン番号が付いている

    gulp-closure-compiler./components/closure-compiler/compiler.jar というファイルを期待しているのですが、bowerでインストールした場合にファイル名が異なるようでシンボリックリンクを作りました。

    4. そもそもコンパイルでコケる

    Googleの担当によると「2016年版で直しとくよ!」ということらしい。


    ということで結果的には残念ながらサンタ村が出てこないというトホホな事態に陥りましたが、みなさん良いクリスマスを!

    この投稿は Serverless(2) Advent Calendar 201624日目の記事です。