##MongoDB Atlasを用いて、ローカルホスト以外からMongoDBに接続できるようにする
MongoDB Atlas:MongoDB公式が提供している、MongoDBのホスティングサービス。( https://www.mongodb.com/cloud/atlas )
・MongoDB Atlasにアカウントを作成する(googleアカウントでsign in可能)。MongoDBデータベース、1つだけなら無料で使用することができる。
・「Create New Cluster」ページが立ち上がるので、作成したいデータベースの設定を行う
※clusterとは、複数のサーバーから接続できるMongoDBデータベースのこと。
![スクリーンショット 2020-07-18 16.36.45.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fff607bdf-c586-656f-aee5-61313283b4ea.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=96195c3da412dd8866cd4735afd59a44)
![スクリーンショット 2020-07-18 16.36.55.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F00e42ed4-4773-ff0d-f9ac-b11e9f872300.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=e719661a2c055c93d194fca6754bd792)
Clusterをすでに作成している状態だと有料だが、最初の一つは無料で作成可能。
無料でサポートしている地域に東京はないが、シンガポールに設定しても問題なく動く。
・「Create Cluster」をクリックし、Clusterが作成されるのをしばらく待つ。
Clusterが作成されると以下の画面が「SANDBOX」に表示される。
![スクリーンショット 2020-07-18 16.44.50.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fcdc32f36-bd02-d638-d7cc-3793058027c3.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=b686f74b13f3370e45d46416067f2ec2)
・「SANDBOX」の「CONNECT」をクリックし、Clusterをセットアップする。
![スクリーンショット 2020-07-18 16.49.15.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F980cd3b2-d247-3dac-73f3-d63e1c619278.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=4c26ab6144695a68a2ceabfa235a3aa7)
①「Add a Different IP Address」をクリックし、IP Addressに「0.0.0.0/0」を入力。
※「0.0.0.0/0」は全てのホスト、任意の宛先、という意味。
これを設定することにより、複数のサーバーからこのClusterにアクセスできるようになる。
②データベースで使用するUsernameとPasswordを設定する。
IPアドレスに「0.0.0.0/0」を設定しているため、UsernameとPasswordによってアクセスを制限する必要がある。
・接続方法を設定する。
![スクリーンショット 2020-07-18 16.53.10.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F567c2ccd-32bb-2f39-fab6-369174452388.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=070a32cb3f42d10e3f2b025c0423f9c3)
・「自分のアプリから接続する」を設定する前に、MongoDB Compassからデータベースに接続しておくと、アプリに接続したデータベースの中身を見て確認できるので便利。
・「MongoDB Compass」とは、MongoDB公式が提供する、MongoDB用のGUI。以前Qiitaに投稿した「Robo3T」と類似したもの(※Robo3TからはMongoDB Atlasに接続できない)。
→「Connect using MongoDB Compass」を選択
##MongoDB Compassを設定する
・「I do not have MongoDB Compass」を選択
![スクリーンショット 2020-07-18 17.00.10.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fffc54fc2-c2aa-3fe3-0c1f-b2574c3cc61f.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=907b17ea59b3d3ee87d4b4c7a52e41c5)
①MongoDB AtlasからMongoDB Compassをダウンロード
・ダウンロードされたMongoDB Copmassを設定する
アプリを開き、
「Connect to Host」画面で接続するホストを設定する。
「Fill in connection Individually」で接続を確認。
![スクリーンショット 2020-07-18 17.08.10.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F304ae81a-04d5-ff9c-ac70-4728e7a3d009.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=72e3cacb2ee0cd94e2b67b27a96fc058)
![スクリーンショット 2020-07-18 17.08.18.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F93441422-efc2-e0c7-c23a-d0520a3dc30c.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=ce7a404964f32cfe121e3b3e769f0681)
デフォルトでで、ローカルホストのMongoDB(ポート番号:27017)に接続できるようになっている。
「Connect」
をクリックするとローカルホストのMongoDBに接続できるようになる。
##MongoDB CompassからMongoDB Atlasに接続する
・一旦、ローカルホストのMongoDBはDisconnectする
・MongoDB Atlasの「I do not have MongoDB Compass」画面を再び参照
②「Copy the connection string, then open MongoDB Compass.」に書かれているURLの、「@」より後、「/」より前をコピー。
・MongoDB Compassの「New Connection」を作成。
・「Hostname」に、先ほど MongoDB Atlasからコピーしたものを貼りつける。
・UsernameとPasswordに、MongoDB Atlasで設定したUsernameとPasswordを貼り付ける。
注)
②データベースで使用するUsernameとPasswordを設定する。
IPアドレスに「0.0.0.0/0」を設定しているため、UsernameとPasswordによってアクセスを制限する必要がある。
の箇所にて設定
![スクリーンショット 2020-07-18 17.16.30.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F6fc68a13-66c4-3c89-9c85-bfe6d1910de5.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=d787e19b92d100734f801687663099c8)
・「More Option」はデフォルトのままでOK
・「Connect」で、MongoDB Atlasからアクセスできるデータベースを作成することができる。
・MongoDB Atlas側から確認する
![スクリーンショット 2020-07-18 17.37.02.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fe2289839-335d-11ae-3d51-dddcb9b9073b.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=bedc61500fdc5e26d0c1c581ee0c8b3f)
「MongoDB Atlas」の「Database Access」の項目から「Edit」をクリックすると、パスワードの再編集ができる。
![スクリーンショット 2020-07-18 17.38.45.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F96bcd290-d75d-d777-ebf3-0c5b88810416.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=4452656535e554d281b0720f084d85c3)
「Network Address」の項目からは、アクセスを要求可能なIPアドレスの確認、再設定ができる
![スクリーンショット 2020-07-18 17.39.22.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2F856259ee-12b8-b601-8771-cea28782c113.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=0c81884510322e16902c79256c1bb7fa)
![スクリーンショット 2020-07-18 17.39.43.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fa8a7dc60-515f-1179-cd10-c50cdabde2f9.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=a8dc009350b953ba6559dbde108cb1f4)
「Cluster」の「COLLECTION」からは、MongoDB Atlasから作成済みのデータベースが見れる。
##Herokuにデプロイする
・環境変数の設定
「dev.env」ファイルを作成し、環境変数として設定する値を設定する。 環境変数を呼び出す時は「process.env.〜」で呼び出す。PORT=3010
MONGODB_URL=mongodb://127.0.0.1:27017/task-manager-api
・「PORT:」アプリが動くポートの設定。
「PORT=3010」にすると、Herokuにデプロイ後はHerokuの提供するポート、それ以外の時は3010のポートでアプリが起動する。
※コード側の記述
・index.js
const port = process.env.PORT
・「MONGODB_URL:」MongoDBの接続設定。
接続するMongoDBデータベースを格納する。
※コードの記述
・mongoose.js
const mongoose = require('mongoose')
mongoose.connect(process.env.MONGODB_URL, {
useNewUrlParser: true,
useUnifiedTopology: true,
useFindAndModify: false
});
※プログラムコードの中に、外からは見せたくないものがある場合の処理
例)暗号化のためのキー(JWT_SECRET) コード中に、データを暗号化するためのキーを書いている箇所がある。 キーは「thisisaseacretkey」だが、これをそのままコード内に書いたままgitやHerokuにデプロイすると、暗号化のためのキーが丸見えになってしまい、セキュリティ上最悪に。 ↓ 暗号のためのキーを環境変数に設定する。 「dev.env」ファイルの中にJWT_SECRET=thisisaseacretkey
を設定。
暗号化のためのキーをそのまま打ち込んでいた箇所は、
「process.env.JWT_SECRET」
というコードで記述。
例)
const sgMail = require('@sendgrid/mail')
sgMail.setApiKey(process.env.SENDGRID_API_Key)
↓
githubにデプロイ
※「dev.env」ファイルは「.gitignore」でデプロイしないようにしておく。↓
Herokuにアプリを作成
ターミナルに、 「heroku create (アプリ名)」 でherokuアプリを作成。「git push heroku master」でデプロイする前に、環境設定を行う
↓
「heroku config」コマンドを用いて、環境変数の設定を行う!
Heroku環境変数の設定
ターミナルに、heroku config:set key=value
と打ち込むことで環境変数の設定。
herkou config:unset key
で環境変数を削除できる。
heroku config
で、設定した環境変数一覧を確認できる。
↓
・「JWT_SECRET」の設定
heroku config:set JWT_SECRET=thisisaseacretkey
・「MONGODB_URL」の設定
※MongoDB Atlasが提供する、接続のための文字列を取得する必要がある!!
![スクリーンショット 2020-07-19 10.38.35.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Fb7050a1d-aca6-4e53-f253-caee5328b98a.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=d175591e371e4150f47a619d36e3471e)
Clusterの「CONNECT」より、「Connect your Application」を選択
![スクリーンショット 2020-07-19 10.39.53.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Ff1492d67-fd0b-7e84-1a54-93e4f7aa3bbb.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=ed0bf04954d05c8d3f1aa36abad24426)
②のアドレスをコピー
を削除し、最初に設定したデータベースのパスワードを入力
を削除し、接続したいデータベースの名前を入力
編集したものをコピー
ターミナルに
heroku config:set MONGODB_URL='先ほどコピーしたアドレス'
実行
・「PORT」
PORTはherokuがデフォルトで提供している環境なので設定不要
↓
・Herokuにデプロイ
git push heroku maser
##MongoDB Compassからデータベースを確認
![スクリーンショット 2020-07-19 10.49.57.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F595580%2Ffe46915c-330c-de06-c063-bf8452cdeb69.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=bf6cf5c9463b8d93593f4b26a8814e0d)
先ほど作成した「MongoDB Atlasからアクセスできるデータベース」に、MongoDB Compassからアクセス。
ここから、Herokuにデプロイしたアプリにつながっているデータベースを確認できる