Flask-Anwendung – So verknüpfen Sie eine Javascript-Datei mit einer Website

Lesezeit: 3 Minuten

Benutzer-Avatar
Benutzer2260199

Ich habe einige Probleme beim Einstieg in die Verwendung von Javascript-Dateien auf meiner Website (eine Flask-Anwendung). Ich starte die Website, indem ich run.py ausführe, das so aussieht:

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

In meiner HTML-Seite habe ich den folgenden Code, der einen 404-Fehler ausgibt:

404 Fehler

Fehlermeldung:

Fehlermeldung

Meine Dateistruktur sieht so aus:

Dateistruktur

Irgendwelche Hinweise, wo ich falsch liege?

  • wo ist die Seite, auf die Sie verweisen? Ich meine die Indexseite..

    – Lala

    3. Mai 2015 um 7:07 Uhr

  • Ich denke, Sie müssen entfernen / Vor javascript in deiner <script> Quelle

    – Lala

    3. Mai 2015 um 7:08 Uhr

  • app/templates/index.html

    – Benutzer2260199

    3. Mai 2015 um 7:09 Uhr

  • okk..könnten Sie bitte auch den Konsolenfehler anzeigen..

    – Lala

    3. Mai 2015 um 7:10 Uhr

  • bitte versuche ./javascript..füge hinzu ein . Vor / in deinem src.

    – Lala

    3. Mai 2015 um 7:11 Uhr

Ah ja, zum Glück entwickle ich gerade eine Flask-Anwendung.

Sie vermissen derzeit die statisch Ordner, in den Flask standardmäßig schaut, eine Ordnerstruktur in etwa wie folgt:

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

Zwei wichtige Standardordner, die Flask in Vorlagen und statisch. Sobald Sie das sortiert haben, verwenden Sie dies, um sich mit Ihren Javascript-Dateien von Ihrer HTML-Seite zu verlinken:

<script src="https://stackoverflow.com/questions/30011170/{{url_for("static', filename="somejavascriptfile.js")}}"></script>

Hoffe das hilft bei Fragen einfach fragen.

Plus – Ein guter Artikel zum Lesen, aber nicht sehr verwandt, aber er spricht über die Ordnerstruktur von Flask: https://www.digitalocean.com/community/tutorials/how-to-deploy-a-flask-application-on-an-ubuntu-vps

  • Wenn sich Ihr Javascript-Code in einer Blaupause befindet, können Sie ihn folgendermaßen aufrufen: mit .notation Auf diese Weise wissen Sie genau, woher diese statische Datei stammt

    – pelos

    13. Dezember 2021 um 22:40 Uhr


Also dein index.html ist bei app/templates/index.htmlund Ihre jQuery ist bei app/javascript/jQuery.js Rechts?

Ich denke, dein Weg ist falsch. Versuche dies:

<script src="https://stackoverflow.com/questions/30011170/javascript/jquery.js"></script>

  • Ich habe es versucht, aber kein Glück!

    – Benutzer2260199

    3. Mai 2015 um 8:27 Uhr

Versuchen Sie es mit src="https://stackoverflow.com/questions/30011170/app/javascript/jquery.js".

Außerdem ist mir aufgefallen, dass Sie jquery.js zweimal einfügen – in Zeile 7 und 28.

  • Bekomme immer noch das gleiche Problem

    – Benutzer2260199

    3. Mai 2015 um 8:02 Uhr

  • Meinst du, du siehst 404 für http://localhost:5000/app/javascript/jquery.js ?

    – dekkard

    3. Mai 2015 um 8:23 Uhr

  • Ich habe auch genau das gleiche Problem und das Verschieben der Javascript-Datei in statische Werke. Aber ich frage mich auch, ob ich die js-Datei in einem anderen Ordner haben kann.

    – Mina

    25. Juli 2016 um 20:01 Uhr

Folgendes hat mir geholfen, den jquery-Teil meines Flask-Projekts zu eliminieren

<!-- 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>

Dies wurde direkt aus der Basisvorlage entnommen, die in gefunden wurde http://getbootstrap.com/getting-started/

1186770cookie-checkFlask-Anwendung – So verknüpfen Sie eine Javascript-Datei mit einer Website

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy