記事にするほどでも備忘録的に投稿
ngrokとは
ローカル環境を動作確認をスマホなどの実機で行うことができる
環境情報
環境はVagrantを使って以下
| 種類 | バージョン |
|---|---|
| OS | centos6.7 |
Vagrantファイルの修正
ポートの設定
# NOTE: This will enable public access to the opened port
- # config.vm.network "forwarded_port", guest: 80, host: 8080
+ config.vm.network "forwarded_port", guest: 80, host: 1234
※別ですでに8080使ってたので変えました
IPの設定
# Create a private network, which allows host-only access to the machine
# using a specific IP.
- # config.vm.network "private_network", ip: "192.168.33.10"
+ config.vm.network "private_network", ip: "192.168.33.10"
vagrant起動&SSHログイン
$ vagrant up
$ vagrant ssh
Apache,PHPのインストール
$ sudo yum install -y php
$ sudo yum install -y httpd
apacheにphpを対応
$ sudo vi /etc/httpd/conf/httpd.conf
一番下に以下を追加
AddType application/x-httpd-php .php
AddType application/x-httpd-php-source .phps
Apache起動と自動起動設定
$ sudo /etc/init.d/httpd start
$ sudo chkconfig httpd on
ngrokインストール
最新版をダウンロード
$ wget https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
解凍するためにunzipをインストール
$ sudo yum install -y unzip
解凍
$ unzip ngrok-stable-linux-amd64.zip
パスが通ってるディレクトリに移動させる
$ sudo mv ngrok /usr/local/bin
確認
↓こんなん表示されたらOK
$ ngrok -v
ngrok version 2.2.8
疎通確認用のファイルをドキュメントルートに配置する
※ドキュメントルートの設定を確認したい人は↓でDocumentRoot "{PATH}"みたいな設定があるのでそこを確認してください
$ vi /etc/httpd/conf/httpd.conf
ということで今回はデフォルトの設定のままなので /var/www/html配下に配置します。
$ sudo vi /var/ww/html/index.php
ファイルの中身はシンプルに↓
<?php
echo "OK";
疎通確認
192.168.33.10に接続する
↓こんなん出たらOK
ngrok起動
$ ngrok http 80
Session Status online
Session Expires 7 hours, 59 minutes
Version 2.2.8
Region United States (us)
Web Interface http://127.0.0.1:4040
Forwarding http://xxxxxxx.ngrok.io -> localhost:80
Forwarding https://xxxxxxx.ngrok.io -> localhost:80
Connections ttl opn rt1 rt5 p50 p90
0 0 0.00 0.00 0.00 0.00
上記のようなメッセージが出てくるのでForwardingに記載されているURLにアクセスすると先ほどの画面が表示されたらOK
ngrokを利用するとどの環境からも(URLさえ知っていれば誰でも)アクセス可能なので利用には十分注意してください
ランダムでURLが生成されているとはいえ,悪意あるユーザからのアクセスが可能性としては0ではありません
Basic認証を用いたngrokの利用方法もあるので↓の記事を参考にしてください。
少しでも安全にngrokを使用する(Basic認証)