見出し画像

ぼーっとニュースが読める「パラパラニュース動画」が作れるツール作ってみた【第３回】

朝日新聞社 メディア研究開発センター

どうも皆さんこんにちは。赤い人です。

第２回では、フラッシュニュースがどのような技術で生成されているかを書いた。最後となる第３回では、システム構成と、開発時に苦労したことを書いていく。

第１回はこちら

第２回はこちら

▼フラッシュニュースはこちら↓

大まかなシステム構成

DockerでUbuntuの仮想環境を立てexpressを使ってRESTful APIを構築した。

画像1

プログラマブルな動画編集ということで、コマンドライン動画編集ではド定番である「ffmpeg」などをフル活用することになるのだが、今回、編集項目をJson形式で書くことのできる便利なnpmパッケージを発見したので、それを使った。

editlyというnpmパッケージである。

nodeからffmpegを叩くには、OSにインストールしたffmpegを直接叩く方法やfluent-ffmpegのようなnpmパッケージを使って叩く方法など様々ある。editlyは後者。editlyは動画の構築の書きやすさという点で非常に使いやすかったのでおすすめ。

さて、今回の一番のポイントは、システムがnpmパッケージで完結しない点である。

ffmpegはOS(今回はLinux)上で動かす必要がある。したがって、Linuxにffmpegをインストールしなくてはならないのだ。

すべてnodeで完結するアプリケーションであれば、わざわざDocker化する必要もないのだが、Linuxモジュールも関係してくる以上、最初からDockerを使ってシステムを組んでいったほうが楽だと思い、その構成にした。

ちなみに僕の場合、会社から2台PCを割り当てられており、会社で作業する時と自宅で作業する時のPC(OSも)が異なるため、ローカル環境を意識せずに開発環境を整えられるDockerは非常に都合が良かった。

※更にちなみに
弊社開発部ではWindows機一台とMacbook Proが一台貸与されます！開発部ではMacで開発している人が多いイメージですが、僕はWSL2が使えるようになって以降、Windowsで開発することが多いです。個人開発も基本WSL2ですね。高校生のころからMacユーザーだったんですけど、2020年の1月くらいからは完全にWindowsオンリーになってしまって、個人所有のMacはホコリを被っています。

Cloud RunでIP制限したい！

ip制限

今回このツールは社内限定での運用を考えていたので、IPアドレスでのアクセス制限をする必要があった。

AWSであれば、セキュリティーグループを作ってインバウンドルールを書けば済む話だが、今回はCloud Run(フルマネージド)をデプロイ先として選択したので、それと同様のことはできない。

ということで、今回はアプリケーション層でのIP制限を行うことにした。

今回一番難航した部分はここである。

expressでIP制限を行うときは、express-ipfilter等を使って実装すれば良い。しかし、今回express-ipfilterでIP制限を行ったものをCloud Runにデプロイすると、うまくIP制限をすることができなかった。

Cloud Runにデプロイしたサービスから、アクセス元IPアドレスを確認してみると、Google FrontendのIPアドレスらしきものが表示されていた。つまり、express-ipfilterでクライアントのIP制限をしてもうまく動作しないのである。

調べたところ、X-Fowarded-ForにクライアントのIPアドレスが付与されていた。したがって、headerからX-Fowarded-Forを取得し、そのIPアドレスを使ってIPアドレスによるアクセス制限を実装すればよい。

いかがだったでしょうか

今回は「フラッシュニュース」の紹介ということで、どのような思想からこのツールを開発し、どのようなロジックで稼働しているのか、どのようなシステム構成になっているのかなどを記した。

紙からデジタルへの変革の時代。ITエンジニアも率先して、新たなニュースの魅せ方を考え、作っていかなくてはいけないと考えている。

今回開発したツールもまだまだ改善することはあり、このフォーマットがすべてを解決するわけではない。しかし、「動画」というアプローチは重視していくべきだと思っている。4Gにより動画コンテンツが当たり前の時代となった。そして5Gが到来し、ますます動画コンテンツは当たり前となり、次は3Dコンテンツが一般的になってゆくだろう。

動画コンテンツを作る技術知見はどんどんためていきたいと思う。

（ICTRAD・赤澤豪将）