チュートリアル

Python

この Python の例では、Flask フレームワークを使用します。提供されたリンクから完全なソースコードをダウンロードできます。

必要に応じて、Python 3.7+ をインストールし、pip が使用可能であることを確認します。

python3 -m ensurepip --upgrade

また、新しい Python 仮想環境を設定して有効にすることをおすすめします。

python3 -m venv .classroom-addon-env
source .classroom-addon-env/bin/activate

ダウンロードしたサンプルの各チュートリアルのサブディレクトリには、requirements.txt があります。pip を使用すると、必要なライブラリをすばやくインストールできます。最初のチュートリアルに必要なライブラリをインストールするには、次のコマンドを使用します。

cd flask/01-basic-app
pip install -r requirements.txt

Node.js

この Node.js の例では、Express フレームワークを使用しています。完全なソースコードは提供リンクからダウンロードできます。

この例では、Node.js v16.13 以降が必要です。

npm を使用して必要なノード モジュールをインストールします。

npm install

Java

この Java の例では、Spring Boot フレームワークを使用しています。完全なソースコードは提供リンクからダウンロードできます。

Java 11 以降をマシンにインストールしていない場合はインストールします。

Spring Boot アプリケーションは、Gradle または Maven を使用してビルドを処理し、依存関係を管理できます。この例には、Maven 自体をインストールせずに正常なビルドを実現する Maven ラッパーが含まれています。

プロジェクトをダウンロードまたはクローンを作成したディレクトリで次のコマンドを実行して、プロジェクトを実行するための前提条件があることを確認します。

java --version
./mvnw --version

Windows の場合:

java -version
mvnw.cmd --version

Python

• ディレクトリ ルートには、次のファイルが含まれています。

  • main.py - Python アプリケーションのエントリ ポイント。使用するサーバー構成をこのファイルに指定し、実行してサーバーを起動します。
  • requirements.txt - ウェブアプリの実行に必要な Python モジュール。pip install -r requirements.txt を使用して自動的にインストールできます。

  • client_secret.json - Google Cloud からダウンロードしたクライアント シークレット ファイル。これはサンプル アーカイブには含まれていません。ダウンロードした認証情報ファイルの名前を変更し、各ディレクトリのルートにコピーする必要があります。

• config.py - Flask サーバーの構成オプション。

• webapp ディレクトリには、ウェブ アプリケーションのコンテンツが含まれています。次のツールが含まれています。

• さまざまなページ用の Jinja テンプレートが格納されている /templates/ ディレクトリ。

• 画像、CSS、補助的な JavaScript ファイルが含まれる /static/ ディレクトリ。

• routes.py - ウェブ アプリケーション ルートのハンドラ メソッド。

• __init__.py - webapp モジュールのイニシャライザ。このイニシャライザは、Flask サーバーを起動し、config.py に設定された構成オプションを読み込みます。

• 特定のチュートリアル ステップで必要となる追加のファイル。

Node.js

ウォークスルーの各ステップは、それぞれの <step> サブフォルダ内にあります。各ステップには以下が含まれます。

• ./<step>/public フォルダには、JavaScript、CSS、画像などの静的ファイルがあります。
• Express ルーターは ./<step>/routes フォルダにあります。
• HTML テンプレートは ./<step>/views フォルダにあります。
• サーバー アプリケーションは ./<step>/app.js です。

Java

プロジェクト ディレクトリには次のものが含まれます。

• src.main ディレクトリには、アプリケーションを正常に実行するためのソースコードと構成が含まれています。このディレクトリには、次のものが含まれます。 + java.com.addons.spring ディレクトリには、Application.java ファイルと Controller.java ファイルが含まれます。Application.java ファイルはアプリケーション サーバーの実行を行い、Controller.java ファイルはエンドポイント ロジックを処理します。+ resources ディレクトリには、HTML ファイルと JavaScript ファイルを含む templates ディレクトリが含まれます。また、サーバーを実行するポート、キーストア ファイルのパス、templates ディレクトリへのパスを指定する application.properties ファイルも含まれます。この例では、キーストア ファイルが resources ディレクトリにあります。任意の場所に保存できますが、その場合は適切なパスで application.properties ファイルを更新してください。
  • pom.xml には、プロジェクトのビルドと必要な依存関係の定義に必要な情報が含まれています。
  • .gitignore には、git にアップロードすべきでないファイル名が含まれています。この .gitignore にキーストアへのパスを必ず追加してください。この例では、secrets/*.p12 です（キーストアの目的については後述します）。チュートリアル 2 以降では、シークレットがリモート リポジトリに含まれないように、client_secret.json ファイルのパスも含める必要があります。チュートリアル 3 以降では、H2 データベース ファイルとファイル データストア ファクトリへのパスを追加する必要があります。これらのデータストアの設定の詳細については、再訪問の処理に関する 3 番目のチュートリアルをご覧ください。
  • mvnw と mvnw.cmd は、それぞれ Unix と Windows 用の Maven ラッパー実行可能ファイルです。たとえば、Unix で ./mvnw --version を実行すると、Apache Maven のバージョンなどの情報が出力されます。
  • .mvn ディレクトリには、Maven ラッパーの構成が含まれています。

Python

Oauth 認証情報

前述の説明のとおりに OAuth 認証情報を作成してダウンロードします。JSON ファイルを、アプリケーションのサーバー起動ファイルとともにルート ディレクトリに配置します。

サーバーを構成する

ウェブサーバーを実行するには、いくつかの方法があります。Python ファイルの末尾に次のいずれかを追加します。

1. localhost は保護されていません。これは、ブラウザ ウィンドウで直接テストする場合に適しています。保護されていないドメインは、Classroom アドオンの iframe で読み込めません。

   if __name__ == "__main__":
     # Disable OAuthlib's HTTPs verification.
     os.environ["OAUTHLIB_INSECURE_TRANSPORT"] = "1"
   
     # Run the web app at http://localhost:5000.
     app.run(debug=True)
   

2. localhost を保護。ssl_context 引数には SSL 鍵ファイルのタプルを指定する必要があります。

   if __name__ == "__main__":
     # Run the web app at https://localhost:5000.
     app.run(host="localhost",
             ssl_context=("localhost.pem", "localhost-key.pem"),
             debug=True)
   

3. Gunicorn サーバー。これは、本番環境対応のサーバーまたはクラウドへのデプロイに適しています。このリリース オプションで使用する PORT 環境変数を設定することをおすすめします。

   if __name__ == "__main__":
     # Run the web app at https://<your domain>:<server_port>.
     # Defaults to https://<your domain>:8080.
     server_port = os.environ.get("PORT", "8080")
     app.run(debug=True, port=server_port, host="0.0.0.0")
   

サーバーを起動する

Python アプリケーションを実行して、前の手順で構成したサーバーを起動します。

python main.py

表示された URL をクリックして、ウェブアプリをブラウザで表示し、正しく実行されていることを確認します。

Node.js

サーバーを構成する

HTTPS 経由でサーバーを実行するには、HTTPS 経由でアプリケーションを実行するために使用する自己証明書を作成する必要があります。これらの認証情報は、リポジトリのルートフォルダに sslcert/cert.pem と sslcert/key.pem として保存する必要があります。ブラウザでこれらのキーを受け付けるには、これらのキーを OS キーチェーンに追加する必要があります。

ファイルを git に commit しないため、*.pem が .gitignore ファイルに含まれていることを確認してください。

サーバーを起動する

サーバーとして実行したい正しいステップを step01 に置き換えて、次のコマンドでアプリケーションを実行できます（たとえば、01-basic-app は step01、02-sign-in は step02 に置き換えます）。

npm run step01

を選択します。

npm run step02

これにより、https://localhost:5000 のウェブサーバーが起動します。

ターミナルで Control + C を使用してサーバーを終了することもできます。

Java

サーバーを構成する

HTTPS 経由でサーバーを実行するには、HTTPS 経由でアプリケーションを実行するために使用する自己証明書を作成する必要があります。

ローカルでの開発には mkcert の使用を検討してください。mkcert をインストールすると、次のコマンドにより、HTTPS 経由で実行される証明書がローカルに保存されます。

mkcert -install
mkcert -pkcs12 -p12-file <path_to_keystore> <domain_name>

この例では、リソース ディレクトリにキーストア ファイルが含まれています。任意の場所に保存できますが、その場合は適切なパスで application.properties ファイルを更新してください。ドメイン名は、プロジェクトを実行するドメインです（例: localhost）。

ファイルを git に commit しないため、*.p12 が .gitignore ファイルに含まれていることを確認してください。

サーバーを起動する

Application.java ファイルで main メソッドを実行して、サーバーを起動します。たとえば、IntelliJ では、src/main/java/com/addons/spring ディレクトリで Application.java > Run 'Application' を右クリックするか、Application.java ファイルを開いて main(String[] args) メソッドの署名の左側にある緑色の矢印をクリックします。ターミナル ウィンドウでプロジェクトを実行することもできます。

./mvnw spring-boot:run

Windows の場合

mvnw.cmd spring-boot:run

これにより、https://localhost:5000 または application.properties で指定したポートでサーバーが起動します。