web-dev-qa-db-ja.com

Flaskアプリケーション-JavaScriptファイルをWebサイトにリンクする方法

私のウェブサイト（A Flask application）でJavaScriptファイルの使用を開始するのに問題があります。run.pyを実行して、次のようにウェブサイトを開始します。

#!flask/bin/python
from app import app
app.run(debug=True)

私のhtmlページには、404エラーを生成する次のコードがあります。

404 error

エラーメッセージ：

error message

私のファイル構造は次のようになります：

file structure

私が間違っているところへのヒントはありますか？

javascripthtmlflaskhttp-status-code-404
16
user2260199

ああ、幸い、私は現在flaskアプリケーションを現在開発中です。

現在staticフォルダーがありません。デフォルトではflaskが検索されます。フォルダー構造は次のようになります。

|FlaskApp
----|FlaskApp
--------|templates
        - html files are here
--------|static
        - css and javascript files are here

Flaskはテンプレートを調べ、staticになる2つの重要なデフォルトフォルダー。これをソートしたら、これを使用して、あなたのhtmlページ：

<script src="{{url_for('static', filename='somejavascriptfile.js')}}"></script>

どんな質問にも役立つことを願っています。

プラス-読むのに最適な記事ですが、あまり関連性はありませんが、flaskのフォルダー構造については次のとおりです： https://www.digitalocean.com/community/tutorials/ how-to-deploy-a-flask-application-on-an-ubuntu-vps

44
jonprasetyo

あなたのindex.htmlはapp/templates/index.htmlにあり、jQueryはapp/javascript/jQuery.jsにありますよね？

あなたの道は間違っていると思います。これを試して：

<script src="../javascript/jquery.js"></script>
0
Anakin

src="app/javascript/jquery.js"を使用してみてください。

また、jquery.jsを2回インクルードしていることに気づきました-7行目と28行目。

0
dekkard

ここに私が私のFlaskプロジェクトのjquery部分を排除するのを助けたものがあります

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>

これは http://getbootstrap.com/getting-started/ にある基本テンプレートから直接取得されました

0
carlos rivera