ミニマムなVue.jsコンポーネントプログラミングその5(動的なデータ取得:サーバ準備)
その1:ミニマムなシングルコンポーネントVue
その2:ミニマムなルータ
その3:ミニマムなサブコンポーネント
その4;ミニマムなデータ取得(静的)
ときたので、今回は動的なデータ取得ですが、まずはデータを取得できるサーバを準備します。
WebAPIサーバを外部に立てて、WebAPIコールで画面に表示するデータを更新します。
画面サーバを立てるわけではないので、CakePHPとか、ララベルとかそういった
リッチサーバフレームワークは不要なので、軽量かつ直感的にコード実装できる
Flaskを使いたいと思います。(RestFullなWebAPIを実装するためのライブラリも充実してるようだし)
Flaskが動作して外部公開できるサーバなら何でもよく、無料レンタルサーバとか、選択肢は
いろいろあるのでしょうが、ここは流行りのAWS上にサーバ立てしようと思います。
AWSへのアカウント登録の説明ははしょりますが、ベーシック(無料枠)で登録しました。
NC2インスタンスの生成/起動
なにはなくとも、まずこれです。
いろんなAWSサービスも、立てたEC2インスタンスの上で動作しています。
サーバサービスを実装/実行する仮想マシンインスタンスって感じでしょうか。
EC2ダッシュボードでEC2のインスタンスを生成します。
AMI(Amazon マシンイメージ)は「Ubuntu Server 18.04 LTS」を選択しました。
セキュリティグループは以下のように設定しておきます。
- SSH:TCP:22:マイIP
- カスタム TCP:TCP:5000:マイIP
ここが大事なところで、個人開発目的なので、自分しかアクセスできない
ようにしておきます。ポート5000は後で説明するFlaskが公開するポート番号です。
このように設定しておくことで、以下の制約がかけられます。
- sshによるログインは自分PCからのみ。
- NC2内で立てたWebサーバ等に対するアクセスは自分PCからのみ。
セキュリティグループには後から設定追加できるので、随時アクセス可能な
範囲を広げていくこともできます。
【注意】
wimax等の無線サービスを使っている場合、自分PCのIPアドレスは毎回変動します。
その場合、NC2のセキュリティグループを再編集してください。
SSH、カスタムTCPともに、マイIPを選択し直すと、その時点でのIPアドレスを
自動取得してくれます。EC2のインスタンスは再起動する必要はなく、即反映されます。
このことを知らずにssh接続にいくと、Connection timedoutと
怒られて困惑することになります。
生成したインスタンスを起動すると、インスタンスの状態が
- running
- 2/2のチェックに成功しました
になるので、sshで接続します。
接続ボタンを押すと、sshを使うならこんなコマンドだよ、と画面に
ポップアップ表示されるのでコピペして打ち込みます。
ssh -i キーペアファイル ubuntu@パブリックDNS名
パブリックDNS名はインスタンス画面に表示されています。
キーペアはインスタンス生成のどっかで自動生成促されるので、それです。
自分PCのどっかに物理ファイル保存されているはずです。
インスタンスを停止しておけば課金されないので、使わないときは
インスタンスを停止するのがよいでしょう。(小心者)
たぶん、一年間の無料枠においては、上げっぱなしでも課金されない・・
と思いますが、いつ改定されるかもしれずだし。
うっかり2つインスタンスを起動すると2倍の速度で無料枠を使い切るので
注意しましょう。
インスタンスを停止すると作ったファイルは削除されるのでは?
と一瞬心配しましたが、Readme.txtとか作って、停止→起動→接続すると
無事残ってました。世の中に流れている、S3にログ保存、ってなんなんだろう。
ちなみに選択したAMIの説明文は以下です。
Ubuntu Server 18.04 LTS (HVM),EBS General Purpose (SSD) Volume Type. Support available from Canonical (http://www.ubuntu.com/cloud/services).
EBSとは、「EC2 ブロックストレージボリューム」のことで、
https://aws.amazon.com/jp/ebs/pricing/
を確認すると、
「AWS 無料利用枠には、Amazon Elastic Block Store (EBS) のストレージ 30 GB、I/O 200 万回、スナップショットストレージ 1 GB が含まれています。」
とあるので、ちゃんと保存されるんでしょう。
ストレージ容量は全然構わないんですが、しかし気になるのはI/O 200万回です。
AWSのトップページ=>サービス=>Billingで「無料じゃなくなるかもよ」という
警告が出るのを日々、確認するとよいでしょう。
NC2インスタンス環境整備
接続したコンソールで確認してみます。
python3 => 入ってる。
pip => 入ってない。
足りないもの入れていきます。
sudo apt-get update <== 大事
sudo apt-get install python-pip
sudo apt-get install python3-pip
pip3 install beautifulsoup
pip3 install flask
Flaskサーバ起動
コード作成(main.py)
from flask import Flask
app = Flask(__name__)
@app.route('/')
def hello():
return 'Hello,Flask on AWS!'
if __name__ == '__main__':
app.run(host='0.0.0.0', debug=True)
flaskはデフォルトでは外部公開されていないので、host='0.0.0.0'で公開します。
といっても、EC2のセキュリティグループ設定でマイIPしか接続できませんが。
以下のようにFlask起動します。
python3 main.py
AWSで立てたマイWebサーバへアクセス
http://パブリックDNS:5000と打つ。
パブリックDNSは、sshでログインしたときに使ったやつです。
おぉ、出た・・感動。
AWSってなんか敷居が高そうな気がしてたけど、
NC2インスタンス生成/起動
インスタンス内でFlask起動
外部PCからアクセス
たったこれだけです!!(本質的には)
次回はWebAPI実装していきたいと思います。
Author And Source
この問題について(ミニマムなVue.jsコンポーネントプログラミングその5(動的なデータ取得:サーバ準備)), 我々は、より多くの情報をここで見つけました https://qiita.com/helloworld2/items/8a42b717dec713a7aa49著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .