0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Cloud Shell Editor上でプレビューできなくて困った(Streamlit)

Posted at

困ったこと

Google CloudのCloud Shell Editor上で、Streamlitを起動してプレビューしようとしたら、ふにゃふにゃ(スケルトン)になって表示されず焦りました。

スクリーンショット 2024-06-14 003649.png

解決策

CORSをオフにすることです。

すなわち、Streamlitの起動オプションに、

--server.enableCORS=false

をつければ良いです。

詳細は、本家のドキュメントのSymptom #2を参考にしてください。

(記録用)解決までの道のり

味気ないので記録として、残させてください。

状況

Cloud Shell Editorの中で環境は作り終え、次のように起動しました。

streamlit hello --server.port 8080 

8080ポートをCloud Shell Editorではプレビューにデフォルトで対応していたから指定しています。

すると、スケルトンの要素がうにゃうにゃと、蠢くのみ。。。

観察

なぜだめなのか?ブラウザの検証で状況を把握しようとしました。

すると、ソースには

You need to enable JavaScript to run this app.

の文字が。

検索 と 実践

このまま検索すると、Streamlitのコミュニティ投稿に当たるも、ピンポイントのものは見つからなかった。
下の方に、公式ドキュメントのページがあるのを見つけ、これがヒット。

とりあえず上から試してみて、

# Symptom #1: The app never loads
python -m http.server 8080

これはOK。だが、解決ではない。

次、

# Symptom #2: The app says "Please wait..." or shows skeleton elements forever
streamlit run app.py --server.port 8080 --server.enableCORS=false

ヒット!
あと、そこで初めて、あの”うにょうにょ”がskelton elementsと呼ばれていることを知る。(今日イチの学び)


こうして、Cloud Shell EditorがStreamlitの勉強に使えるとわかってホッとしました。Cloud Shell Editorには週50時間という上限があるので、この数字が与える影響次第では、Cloud9でも使っちゃおうかな~と思っています。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?