hachiNote

勉強したことをメモします。

HerokuとMongoDB AtlasでDevHubを動作させる

目的

私、DevHubというコミュニケーションツールを長年愛用しています。今ではこれなしでは何もできません。おそらく世界一のヘビーユーザだと自負しています。

github.com

このDevHub、Node.js+MongoDBで動いてまして、とりあえずクラウド上にデプロイして使ってみたいなという場合は、HerokuにデプロイしてMongoDBはHerokuのAdd-onであるmLabを使う、というのが選択肢の一つでした。

しかし、2020年11月10日でmLabはHeroku Add-onの提供を終了するとアナウンスがありました。

Shutdown of mLab's Heroku Add-on on November 10, 2020 | mLab Documentation & Support

DevHubをHeroku上で動作させる場合、このmLabというHeroku Add-onは大変使い勝手が良く、Herokuの管理画面上でぽちぽちっと少しやるだけですぐMongoDBが使えるようになる大変ありがたい存在でした。しかしこれが使えなくなる……これは事件です。

mLabの代わりとして、Herokuは別のAdd-onを紹介していますが値段が結構高く、無料プランもありません。一方、mLab自体はMongo DB AtlasというMongoDB as a Serviceに移行することを勧めています。

MongoDB AtlasはHerokuとはまったく別のサービスなので当然Herokuとは別にアカウントを作る必要があり、Heroku Add-onと比べると運用上の手間は増えます。しかしMongoDB AtlasはmLabとほぼ同じようなプランを取り揃えいて値段もむしろ安くなっています。なんといっても無料プランもちゃんとある!

ということで本記事では、DevHubのソースコードはHerokuにデプロイしてHeroku上で動作させ、MongoDBは別サービスであるMongoDB Atlasを使う、というのをやってみます。新規にDevHubを構築する例とします。すでにHeroku上で動いているものがある場合は前述のサイトに移行(Migration)手順の紹介がありますのでそちらを参考にしてください。

注意

DevHubはチャット+共有メモが使える大変使い勝手の良いツールですが、セキュリティやユーザ管理には重きを置いていない設計なので基本的に社内とかの閉じた環境で使う前提のツールです。クラウド上で使用するのはあくまで自己責任でお願いします。

一応Basic認証もありますので、機密性がさほど高くないデータを扱うのであればクラウド上に配置するのもありですが、会社で使うのであればクラウド上へのデプロイはやめておいた方がいいです。大人しくSlackとか使いましょう。

全体の流れ

  • Herokuで新規アプリケーションを作成し、GitHubにあるDevHubのリポジトリを関連づけてデプロイする。
  • Herokuの管理画面で、環境変数を追加する。
  • MongoDB AtlasでClusterを新規作成する。
  • 作成したClusterに対する接続文字列を手に入れ、Herokuの管理画面で環境変数として設定する。
  • うまくいけばこれでDevHubが使えるようになる。

HerokuでDevHubをデプロイする

Herokuで新規アプリケーションを作成する

  • Herokuのアカウントをまだ作成していない場合は作成する。有料プランを使うつもりがないならクレジットカードの登録はしなくても大丈夫。
  • Herokuのダッシュボードで、Node.jsの新規アプリケーションを作成する。名称(URLにも使われる)と、Regeionを選ぶだけ。RegionはUnited StatesとEuropeが選べたが、デフォルトでUnited Statesが選択されていたのでそれにした。

DevHubのリポジトリを関連づけてデプロイ

私の場合、volpe28v/DevHub をFolkしていたので自分のリポジトリを関連づけた形になりますが、Folkしていない場合はHeroku CLIを使ったやり方が必要かもしれません(後述)。

  • 作ったアプリケーションの"Deploy"画面に自動的に遷移してくるので、"Deployment method"のところで"GitHub"をクリック。

    f:id:hachiilcane:20200817003837p:plain
    HerokuでDeployment methodを選択

  • GitHubの認証画面らしきものが表示されるので、紐付けたいアカウントで認証を通す(自分の場合はすでにログイン済みだったのでいきなり自分のGitHubアカウントが表示された)。

  • うまくいくと"Deploy"画面に"Connect to GitHub"が表示されているので、使用したいリポジトリをSearchして"Connect"ボタンをクリック。
  • リポジトリがConnectedになると、"Deploy"画面上に"Automatic deploys"と"Manual deploy"が表示される。どちらでも好きな方を使える。どちらの場合も使いたいブランチ名をプルダウンから選んでボタンをクリックするだけ。ブランチ名を選べるので、masterブランチじゃないブランチをデプロイしたい場合にも対応できそう。

    f:id:hachiilcane:20200817004505p:plain
    HerokuのAutomatic deploysとManual deploy

  • 今回は"Manual deploy"でブランチを選択し、"Deploy Branch"ボタンをクリック。

  • GitHubからソースを持ってきてBuildが始まる。Buildのログはブラウザ上でリアルタイムに表示されるので安心。何も問題なかったらこれでDeployが完了する。
  • この時点ではまだアプリケーションを開かないほうがいい。

GitHubリポジトリと直接連携する以外の方法

なお、今回はGitHubリポジトリと直接連携する方法を選びましたが、GitHubのDevHubをCloneして、手元にあるソースコードをHerokuにデプロイすることも可能です。その場合、"Deployment Method"で"Heroku Git"を選べば、やり方が表示されます。大まかにはHeroku CLIというコマンドラインツールをインストールして、コマンドラインからherokuにpushするやり方です。さほど難しくはないので、マニュアルをよく読んで対応しましょう。

DevHubで使用するいくつかの環境変数を設定する

  • アプリケーションの画面を開く前に、"Settings"の画面に行き、環境変数の設定をする。"Reveal Config Vars"ボタンをクリックすると設定できる。以下のKEY/VALUEを設定する。
KEY VALUE 説明
BASIC_AUTH_USER 任意のユーザ名 これを設定するとBasic認証が使えるようになります
BASIC_AUTH_PASS 任意のパスワード 同上
FORCE_SSL true httpsを強要できます
GRIDFS true アップロードファイルがDB内に格納されるようになります。falseの場合、デプロイされたOS上のファイルシステムに直接ファイルとして保存されます。
TZ タイムゾーン(Asia/Tokyoとか) いらないかもしれない

MongoDB Atlasのアカウントを作り、Clusterを新規作成する

アカウント作成

  • MongoDB Atlasのサイトに行き、"Start Free"のボタンをクリックしてアカウントを作成する。言われる通りに進めれば作れる。作ると早速Clusterを作るように言われるが、いったんキャンセルしておく。有料プランを使うつもりがないなら、クレジットカードの登録はなくて大丈夫。 Managed MongoDB Hosting | Database-as-a-Service | MongoDB

Organization / Project / Cluster という概念を理解しておく

MongoDB Atlasは、Organization / Project / Cluster という階層構造になっているので、まずはこの用語の意味を押さえておく。こちらの記事が大変参考になりました。

MongoDB Atlasを使い始める (MongoDB as a Service) - Qiita

データベースアクセス用のユーザを作成する

前述の記事にも書いてあるように、MongoDBにアクセスするにはAtlasのユーザとは別にMongoDBアクセス用のユーザが必要になります。このユーザはProjectに紐づきます。Clusterを作成してからでもいいです。

  • "Database Access"からデータベースアクセス用のユーザを一つ作成した。ロールは"atlasAdmin@admin"という一番強そうなやつを選んだ。

Clusterを新規作成する

  • Project名はデフォルトでは"Project 0"とかになっているので、変えたければ変えておく(後からでも変えられる)。
  • Projectを選び、"Clusters"からClusterを新規作成する。"Build a cluster"ボタンがあったのでそれをクリック。
  • "Shared Clusters", "Dedicated Clusters", "Dedicated Multi-Region clusters"の3つから選ぶ。後ろ2つは有料なので、"Shared Clusters"を選ぶ。これはFREE。
  • 次の画面で細かな設定やプランを選択する。"Cloud Provider & Region"で好きなプロバイダーとリージョンを選ぶ。よくわからないのでデフォルトのままにしておいた(AWS, us-east-1)。"Cluster Tier"は"M0 Sandbox (Shared RAM, 512MB Storage)"、"Additional Settings"は"MongoDB 4.2, No Backup"、"Cluster Name"で好みのCluster名をつける。Cluster名はあとで変更することはできないのでこのタイミングでちゃんと考えてつける。
    f:id:hachiilcane:20200817004756p:plain
    MongoDB Atlasでの Cloud Provider & Region の選択
    f:id:hachiilcane:20200817004855p:plain
    MongoDB Atlasでの Cluster Tier などの選択
  • Clusterが作成されたのを確認して(数分かかる)、"Network Access"から"IP Whitelist"の設定をする。"+ADD IP ADDRESS"ボタンをクリックし、"ALLOW ACCESS FROM ANYWHERE"ボタンをクリックすると"Whitelist Entry"に"0.0.0.0/0"が入力されるのでこれで"Confirm"ボタン。HerokuはIPアドレスが固定ではないという話があったので(公式情報は未確認だが)こうしておいた。

接続文字列を手に入れ、Herokuの管理画面で環境変数として設定する

MongoDB Atlasの画面で、Clusterに対する接続文字列を手に入れる

  • "Clusters"からClusterを表示すると、"CONNECT"ボタンがあるのでクリック。すると"Choose a connection method"という画面が表示されるので、"Connect your application"を選択。
  • "Select your driver and version"でDriverとして"Node.js"、Versionとして"3.6 or later"を選択。すると、"Add your connection string into your application code"のところに接続文字列が表示されるのでコピーしておく、ユーザ名は事前に作成しておいたMongoDBユーザの名前がすでに入っている。<password>はユーザのパスワードで置き換え、<dbname>のところは"the name of the database that connections will use by default"と説明があるのでそれで置き換える。たぶん実際はなんでもいいんだろうけど、とりあえずDevHubのデフォルトDB名である"devhub_db"にしておく。

Heroku側で環境変数を追加

  • Herokuの"Settings"の画面に戻り、環境変数の追加をする。"MONGODB_URI"というKEY名にVALUEとしてさっき手に入れたMongoDBの接続文字列を入れる。
KEY VALUE 説明
MONGODB_URI 先ほど手に入れた"mongodb+srv://"で始まる接続文字列

DevHubが動くかどうか確認

Herokuの管理画面に"Open app"というボタンがあるのでそれをクリックするとデプロイしたアプリケーションの画面に飛べる。

ここまでの作業がちゃんとできていれば、ユーザ名を入れてすぐに使える状態になっている。

画面は表示されるけど歯車のマークがずっとグルグル回っている状態になっている場合は、データベースに関する設定がうまくいっていないことが多いので見直してみてください。