Python: flask + pyrebase で Firebase Storage にファイルを投稿したい

Question

こんにちは。
最近 Flask を始めた者です。
調べてみてもやっていることがマイナーなのか中々情報が出てきませんでしたので質問させていただきます。

やりたいこと

Flask で Firebase の Storage を使って 画像・動画 を保存したいです。
もう少し具体的に書くと
HTMLの ファイル選択 から選択した 画像・動画 を Firebase Storage に投稿したいです。

書いてみたコード：

自分なりに調べてみたり、「こう書けばいいのかな...」と試行錯誤してみました。

from flask import Flask, render_template, request, redirect
import pyrebase as pb
import tempfile

app = Flask(__name__)

config = {
  "apiKey": "API-KEY",
  "authDomain": "@@@@.firebaseapp.com",
  "databaseURL": "https://@@@@.firebaseio.com",
  "storageBucket": "@@@@.appspot.com"
}

firebase = pb.initialize_app(config)

@app.route('/', methods=['GET','POST'])
def index():
    if request.method == 'GET':
        return render_template('index.html')
    else:
        picture = request.form['picture']
        firebase.storage().put(picture)
        
        return redirect('/')

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

<div class="container-fluid">
    <h4>ファイルを選択</h4>
    <form action="/" method="POST" enctype="multipart/form-data">
        <input class="form-control" type="file" name="picture" id="picture" >
        <br>
        <button type="submit" class="btn btn-outline-info">送信</button>
    </form>
</div>

質問以外でコードの中で「この書き方良くないよ！」「こうするといいよ！」という点があれば指摘していただきたいです。

よろしくお願いします......!

Comments

[float]

Flaskのエラー表示です。
追記失礼致します。
BadRequestKeyError
werkzeug.exceptions.BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand.
KeyError: 'picture'

Answer 1

あれから海外の方の動画を徹夜であさった結果原因がわかりました。。。！
第一の原因は Firebase 側でした。
Firebase Storage の ルール で認証なしで書き込みができるようにしてやることがポイントです。本番環境ではやらないでね...()

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write
    }
  }
}

そして、Python側。

storage = firebase.storage() # 新しく追加
== 省略 ==
 @app.route('/', methods=['GET','POST'])
def index():
    if request.method == 'GET':
        return render_template('index.html')
    else:
        picture = request.files['picture'] # 修正ポイント1
        storage.child("images/images.png").put(picture) # 修正ポイント2

        return redirect('/')

こんな感じでした。やはり開発には「自分で調べる力」が大事ですね。学びでした