Difficulty with using Flask to host static and templates files
I want to host 3 files in app.py using the Flask framework. Here is what it looks like.
Project
├── templates
│ └── index.html
├── static
│ ├── index.js
│ └── style.css
└── app.py
How do I host these files in app.py using the Flask framework? Here is my attempt at it, but it is giving me an error that the site can't be reached when I run the app.py server file.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
@app.route('/index.js')
def index_js():
return render_template('index.js')
@app.route('/style.css')
def style_css():
return render_template('style.css')
if __name__ == '__main__':
app.run(debug=True)
Here is also what that is included in my index.html
<script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
One more thing, when I inspect the page and go to sources, none of my index.js, style.css, and index.html files are there. This basically means that app.py can't find none of those files that are located in my templates and static folder.
javascript python html css flask
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
add a comment |
I want to host 3 files in app.py using the Flask framework. Here is what it looks like.
Project
├── templates
│ └── index.html
├── static
│ ├── index.js
│ └── style.css
└── app.py
How do I host these files in app.py using the Flask framework? Here is my attempt at it, but it is giving me an error that the site can't be reached when I run the app.py server file.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
@app.route('/index.js')
def index_js():
return render_template('index.js')
@app.route('/style.css')
def style_css():
return render_template('style.css')
if __name__ == '__main__':
app.run(debug=True)
Here is also what that is included in my index.html
<script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
One more thing, when I inspect the page and go to sources, none of my index.js, style.css, and index.html files are there. This basically means that app.py can't find none of those files that are located in my templates and static folder.
javascript python html css flask
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06
add a comment |
I want to host 3 files in app.py using the Flask framework. Here is what it looks like.
Project
├── templates
│ └── index.html
├── static
│ ├── index.js
│ └── style.css
└── app.py
How do I host these files in app.py using the Flask framework? Here is my attempt at it, but it is giving me an error that the site can't be reached when I run the app.py server file.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
@app.route('/index.js')
def index_js():
return render_template('index.js')
@app.route('/style.css')
def style_css():
return render_template('style.css')
if __name__ == '__main__':
app.run(debug=True)
Here is also what that is included in my index.html
<script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
One more thing, when I inspect the page and go to sources, none of my index.js, style.css, and index.html files are there. This basically means that app.py can't find none of those files that are located in my templates and static folder.
javascript python html css flask
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
I want to host 3 files in app.py using the Flask framework. Here is what it looks like.
Project
├── templates
│ └── index.html
├── static
│ ├── index.js
│ └── style.css
└── app.py
How do I host these files in app.py using the Flask framework? Here is my attempt at it, but it is giving me an error that the site can't be reached when I run the app.py server file.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
@app.route('/index.js')
def index_js():
return render_template('index.js')
@app.route('/style.css')
def style_css():
return render_template('style.css')
if __name__ == '__main__':
app.run(debug=True)
Here is also what that is included in my index.html
<script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
One more thing, when I inspect the page and go to sources, none of my index.js, style.css, and index.html files are there. This basically means that app.py can't find none of those files that are located in my templates and static folder.
javascript python html css flask
javascript python html css flask
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
asked Nov 25 '18 at 20:23
AnonymousAnonymous
12
12
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06
add a comment |
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06
add a comment |
1 Answer
1
active
oldest
votes
They are already hosted you can acces them from an html file let's say:
index.html
<html>
<head>
<link rel="stylesheet" href="../static/style.css">
</head>
<body>
<script src="../static/index.js"></script>
</body>
</html>
app.py
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53471566%2fdifficulty-with-using-flask-to-host-static-and-templates-files%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
They are already hosted you can acces them from an html file let's say:
index.html
<html>
<head>
<link rel="stylesheet" href="../static/style.css">
</head>
<body>
<script src="../static/index.js"></script>
</body>
</html>
app.py
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
add a comment |
They are already hosted you can acces them from an html file let's say:
index.html
<html>
<head>
<link rel="stylesheet" href="../static/style.css">
</head>
<body>
<script src="../static/index.js"></script>
</body>
</html>
app.py
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
add a comment |
They are already hosted you can acces them from an html file let's say:
index.html
<html>
<head>
<link rel="stylesheet" href="../static/style.css">
</head>
<body>
<script src="../static/index.js"></script>
</body>
</html>
app.py
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
They are already hosted you can acces them from an html file let's say:
index.html
<html>
<head>
<link rel="stylesheet" href="../static/style.css">
</head>
<body>
<script src="../static/index.js"></script>
</body>
</html>
app.py
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index_html():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
answered Nov 25 '18 at 22:05
Bogdan BibinaBogdan Bibina
786
786
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53471566%2fdifficulty-with-using-flask-to-host-static-and-templates-files%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
I don't understand why you have done this. JS and CSS are not templates, they are static files.
– Daniel Roseman
Nov 25 '18 at 20:27
Remove the routes for your static files. Those are likely interfering with what Flask would otherwise do.
– Dave W. Smith
Nov 26 '18 at 1:06