先生と生徒の会話形式で理解しよう

生徒

「FlaskでWebアプリを作っているのですが、画像や動画をたくさん表示させると動きが重くなってしまいます。何か良い解決策はありますか？」

先生

「画像などの静的ファイルは、アプリ本体とは別の場所に保存して配信するのがプロのやり方です。AWSのS3というサービスを使ってみましょう。」

生徒

「エススリー、ですか？クラウドに画像を預けるイメージでしょうか？」

先生

「その通りです！大きな荷物は専用の倉庫（S3）に預けて、必要な時にだけ取り出す仕組みを作れば、アプリがとても軽快に動くようになりますよ。」

1. FlaskとAWS S3連携の基本を理解しよう

まず、Webアプリ制作で欠かせない言葉を覚えましょう。静的ファイル（せいてきファイル）とは、画像、写真、動画、デザインを決めるCSS、動きをつけるJavaScriptなど、中身が勝手に変わらないファイルのことです。これらをFlaskのプログラムと同じ場所に詰め込みすぎると、アプリの動作が遅くなる原因になります。

そこで登場するのがAWS S3（エーダブリューエス・エススリー）です。これはAmazonが提供する「インターネット上の巨大なファイル置き場」です。ここには無限に近い量のデータを保存でき、かつ非常に高速に配信できるという特徴があります。FlaskとS3を連携させることで、アプリの処理スピードを上げつつ、ストレージの容量不足という悩みからも解放されます。

2. AWS S3でバケットを作成する準備手順

S3を使うためには、まずファイルをいれる「箱」を作る必要があります。この箱のことをバケットと呼びます。AWSの管理画面にログインしたら、S3のページへ移動して「バケットを作成」をクリックしましょう。

ここで決めるバケット名は、世界中でたった一つの名前にしなければなりません。誰かが使っている名前は使えないので、自分の名前や日付を組み合わせるのがコツです。また、今回は静的ファイルを公開するので、セキュリティ設定で「パブリックアクセスをすべてブロック」のチェックを外し、外部から画像が見えるように許可を出しておく必要があります。初めての方は、まず「バケットはファイルを整理するためのフォルダのようなもの」と覚えておけば大丈夫です。

3. 連携に必要なBoto3ライブラリを導入しよう

Pythonで作ったFlaskアプリからAWSを操作するには、Boto3（ボトスリー）という専用のライブラリ（便利な道具セット）が必要です。これをパソコンにインストールすることで、プログラムから「S3に画像をアップロードして！」といった命令が出せるようになります。

インストールは非常に簡単です。パソコンのコマンド入力画面（ターミナルなど）で、以下の呪文を入力するだけです。これにより、PythonがAWSと通信するための準備が整います。


pip install boto3 flask

4. FlaskからS3へ画像をアップロードするプログラム

それでは、実際にFlaskからS3へファイルを送るプログラムを書いてみましょう。以下のコードは、画像を受け取ってS3という倉庫へ転送するシンプルな例です。


import boto3
from flask import Flask, request

app = Flask(__name__)

# AWSの接続情報を設定します（本来は環境変数を使います）
s3 = boto3.client('s3', 
    aws_access_key_id='あなたのアクセスキー',
    aws_secret_access_key='あなたの秘密鍵'
)

@app.route('/upload', methods=['POST'])
def upload_file():
    # 画面から送られてきたファイルを取得します
    file = request.files['image_file']
    
    # S3のバケットへアップロード命令を出します
    s3.upload_fileobj(
        file,
        'あなたのバケット名',
        file.filename,
        ExtraArgs={'ContentType': file.content_type}
    )
    return "アップロードが完了しました！"

if __name__ == "__main__":
    app.run()

このプログラムでは、boto3.client('s3')という部分で「今からS3を使いますよ」と宣言しています。upload_fileobjが、実際にファイルをクラウドに放り投げる魔法の言葉です。これだけで、自分のパソコンの中にあるファイルが、アメリカや日本のどこかにあるAmazonの巨大なサーバーへと送られます。

5. 保存したファイルをHTMLで表示させる方法

S3に保存した画像は、固有の住所（URL）を持ちます。これをFlaskのHTMLテンプレート（画面のデザインファイル）で読み込むことで、ユーザーのブラウザに画像を表示させることができます。通常、S3のURLは「https://バケット名.s3.amazonaws.com/ファイル名」という形になります。

HTMLで表示させる際は、以下のように記述します。Flask側でURLを作成して渡してあげるとスマートです。


<div class="card p-3 shadow">
    <h3>S3から配信されている画像</h3>
    <img src="https://my-bucket.s3.amazonaws.com/my-photo.jpg" alt="風景写真" class="img-fluid">
    <p>この写真はクラウドから直接配信されています。</p>
</div>

このようにすることで、Flaskが動いているサーバーを通さずに、直接S3から画像がユーザーに届きます。これをオフローディングと言います。メインのプログラムの負担が減り、サイトがサクサク動くようになる重要なテクニックです。

6. ファイルをダウンロードするためのコード例

アップロードだけでなく、保存されているファイルをユーザーが自分のパソコンに保存（ダウンロード）できるようにする機能も作ってみましょう。以下のコードは、S3にあるファイルへの一時的なアクセス許可を与える方法です。


@app.route('/download/<filename>')
def download_file(filename):
    # 数分間だけ有効な特別なURLを作成します
    url = s3.generate_presigned_url('get_object',
        Params={'Bucket': 'あなたのバケット名', 'Key': filename},
        ExpiresIn=3600 # 1時間だけ有効
    )
    return f"ダウンロード用URLはこちら: {url}"

ここでは、署名付きURL（しょめいつきユーアールエル）という仕組みを使っています。普段は鍵をかけて誰にも見せないようにしておき、必要な時だけ「1時間だけ有効な特別な合鍵」を発行するようなイメージです。これを使えば、有料会員だけに動画を見せるといった高度なサービスも作ることができます。

7. セキュリティを守るためのIAM設定

クラウド連携で一番怖いのは、他人に勝手にファイルを見られたり、消されたりすることです。そのためにIAM（アイエーエム）という設定で、誰が何をできるかの権限を厳しく管理します。プログラムの中に直接「アクセスキー」を書くのは、実は少し危険な行為です。

初心者のうちは練習用として記述することもありますが、慣れてきたら「環境変数」という仕組みを使いましょう。これは、プログラムの外側に秘密のパスワードを隠しておく方法です。また、S3のバケットポリシーという設定画面で「このプログラムからしかアクセスできません」というルールを作ることもできます。安全にクラウドを使いこなすために、セキュリティ意識は常に持っておきましょう。

8. S3にあるファイルの一覧を取得する機能

「どんな画像が保存されているかな？」と確認するために、一覧を表示する機能も作ってみましょう。これは、管理画面などを作るときに非常に役立ちます。以下のコードを使えば、バケットの中身をスキャンして名前を取得できます。


@app.route('/list')
def list_files():
    file_names = []
    # バケット内のファイル情報をすべて取得します
    response = s3.list_objects_v2(Bucket='あなたのバケット名')
    
    if 'Contents' in response:
        for obj in response['Contents']:
            file_names.append(obj['Key'])
            
    return f"保存されているファイル: {', '.join(file_names)}"

list_objects_v2という命令を使うことで、S3の中身を覗き見ることができます。これをFlaskの画面にループ（繰り返し）を使って表示させれば、立派なフォトギャラリーサイトが完成します。こうした連携機能が充実しているのも、FlaskとS3の強みですね。

9. クラウド連携でアプリを成長させよう

FlaskとS3を組み合わせることができれば、もうファイルの容量不足に怯える必要はありません。ユーザーから投稿された大量の写真を保存したり、大きな動画を配信したりすることも自由自在です。最初は「バケットって何？」「Boto3ってどう使うの？」と戸惑うかもしれませんが、何度もコードを書いて試すうちに、自然とクラウドの感覚が身についてきます。

パソコンを触ったことがない方でも、まずは画像を一枚クラウドへ送ることから始めてみてください。自分の書いた一行のコードが、インターネットという大きな海にファイルを届ける瞬間を体験すれば、プログラミングがもっともっと楽しくなるはずです。これからも一歩ずつ、Flaskとクラウドの世界を探求していきましょう！