🐍

pythonanywhereでサイトを公開してみよう【flask】

に公開

はじめに

こんにちは
pythonでwebアプリを一旦無料で公開したいときってありますよね
そんなときはpythonanywhereがおすすめです
pythonanywhereは少しの操作とファイル転送だけで無料で公開ができ、有料プランだと5GBのプランや50GBのプランがあり、カスタムプランだと選べたりもして、本番環境でも使えます
pythonanywhereでサイトを公開してみましょう

pythonanywhereとは

↓wikiからの引用

PythonAnywhere is an online integrated development environment (IDE) and web
hosting service (Platform as a service) based on the Python programming language.
[1] Founded by Giles Thomas and Robert Smithson in 2012, it provides in-browser 
access to server-based Python and Bash command-line interfaces, along with a code 
editor with syntax highlighting. Program files can be transferred to and from the 
service using the user's browser. Web applications hosted by the service can be 
written using any WSGI-based application framework.

https://en.wikipedia.org/wiki/PythonAnywhere

日本語でにすると
「PythonAnywhereは、Pythonプログラミング言語を基盤としたオンライン統合開発環境(IDE)およびウェブホスティングサービス(Platform as a Service)である。[1] 2012年にGiles ThomasとRobert Smithsonによって設立され、ブラウザ内でのサーバーベースのPythonおよびBashコマンドラインインターフェースへのアクセス、ならびに構文強調表示機能を備えたコードエディタを提供する。プログラムファイルはユーザーのブラウザを介してサービスとの間で転送可能です。本サービスでホストされるウェブアプリケーションは、任意のWSGIベースのアプリケーションフレームワークを使用して記述できます。」
です
pythonで作ったサイトを公開できてIDE、Bashもあるって感じです

↓リンク
https://www.pythonanywhere.com/

アカウント登録

pythonanywhereのサイトを開いて右上のPricing & signupを押すと、プランが表示されます
ひとまず無料プランで始めたいので上の方にあるCreate Beginner accountを押してください
そうしたらアカウント登録のフォームが出てきます
独自ドメインを使わず公開する場合はドメインがUsernameで決まり、もしUsernameをhelloworldにした場合のurlは

helloworld.pythonanywhere.com

となります
希望のurlの名前をUsernameにしましょう
Email、Passwordは普通にEメールとパスワードを打ってください
Password (again)はパスワードの再確認なのでPasswordと同じのを打ってください

打ち終わったら、

I agree to the Terms and Conditions and the Privacy and Cookies Policy, and confirm that I am at least 13 years old. 

この「利用規約とプライバシーポリシーに同意し、自分が13歳以上であることに同意する」というボタンを押して同意しRegisterを押すと、Eメールにurlが送られてくるので指示通りurlを開けばアカウント登録は完了です

サイトを公開してみよう

これはdjangoやそれ以外のでもできるのですが、今回の場合はflaskで話を進めます
まずダッシュボートを開いて右側にあるWeb appsのOpen Web tabを押してください
そしたら今ログインしてるアカウントで公開してるサイトが表示されます(無料プランの場合一つしか公開できない)
次に左上にあるAdd a new web appというのを押してください
独自ドメイン、カスタムドメインは無料プランでは使えないため強制的にユーザーネームに.pythonanywhere.comの形になるという内容の英語が出てくるので出てきたタブの右下のNextを押しましょう
そしたらSelect a Python Web frameworkというのが出てくると思います
今回はflaskで公開したいのでflaskを選択し今あなたが使っているpythonのバージョンを次に選んでください
そしたらQuickstart new Flask projectというのが出ますが、特にファイル名のこだわりがない限りそのままNextで良いです
そしてちょっと待ってたらサイトの公開が完了です
Configuration for ...の...の部分のurlをクリックすると公開したサイトが開けます
しかし、このままでは下のようなものしか表示されないはずです

これは、pythonanywhereでflaskのwebアプリを作った際の初期画面です
これから用意したwebアプリにするにはコードをアップロードしなければいけません

サイトを自分が用意したサイトに更新しよう

まず自分でflaskで書いたサイトを用意しましょう
今回は例として以下のコードでやります

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return '''<p>
    いろはにほへと<br>
    ちりぬるを<br>
    わかよたれそ<br>
    つねならむ<br>
    うゐのおくやま<br>
    けふこえて<br>
    あさきゆめみし<br>
    ゑひもせす
    </p>'''

if __name__ == '__main__':
    app.run(host='localhost', port=8000)

これはいろは歌を表示するシンプルなサイトです
そしたら、ダッシュボードを開き左から二個目のFilesを開いてください
次に左側にあるディレクトリからmysite(自分でファイル名を変えた場合はそのファイルの場所)を開いてください
その次右側のflask_app.py(これも自分でファイル名を変えた場合はそのファイル名)を押してください

このようなコードが出てくると思います

# A very simple Flask Hello World app for you to get started with...

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello_world():
    return 'Hello from Flask!'

これは編集可能なので、すべて消して先程の用意したコードをコピペしてください
そしたら右上のSaveを押して保存してください
次にダッシュボードに戻り、右のWeb appsを開いてください
最後真ん中に表示されるReloadボタンを押して更新されるまで
待つと、更新が完了です
また自分のサイトを開いてみると

これが表示されるはずです
これは打ち込んだコードがちゃんと実行されている画面です
これで更新が完了です

複数のファイル、フォルダのサイトの場合

この場合は、FilesにあるUpload a fileやNew Directoryを使って、中心のファイル(flask_app.py)の周りのフォルダやファイルを用意したサイトと同じように組めば大丈夫です

おわりに

これでpythonanywhereでサイトを公開できます
無料で本番環境と似た感じでサイトを公開できたり、他の人に作ったサイトを見せたりできて便利です
皆さんもpythonaynwhereを使ってデバックなどのために無料で本番環境と似た感じでサイトを公開したり、他の人に作ったサイトを見せて自慢したりしましょう
さようなら

Discussion