I am trying to include a str.js and jit.js file in nev.html. Both are in same directories but it is giving me a reference error:
flask file in flask/app1.py
JavaScript
x
21
21
1
import json2
import simplejson3
from flask import Flask, render_template, request4
app = Flask(__name__)5
6
@app.route('/')7
def hello():8
return 'client.html'9
10
@app.route('/returnjson')11
def returnjson():12
str1 = json.dumps({"name":"Infinetly Beta","friends":[{"name":"Aamir","friends":[{"name":"Jesal","friends":[]}]},{"name":"Neville","friends":[{"name":"Kapil","friends":[]}]}]})13
return str114
15
@app.route('/neville')16
def index():17
return render_template('nev.html')18
19
if __name__ == "__main__":20
app.run(debug=True)21
When I run it using flask, it gives this error:
JavaScript
1
11
11
1
neville@neville-laptop:~/Flask$ python app1.py2
* Running on http://127.0.0.1:5000/3
* Restarting with reloader4
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /neville HTTP/1.1" 200 -5
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /jit.js HTTP/1.1" 404 -6
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /css/base.css HTTP/1.1" 404 -7
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /css/RGraph.css HTTP/1.1" 404 -8
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /str.js HTTP/1.1" 404 -9
127.0.0.1 - - [30/Jan/2012 02:01:53] "GET /favicon.ico HTTP/1.1" 404 -10
127.0.0.1 - - [30/Jan/2012 02:01:54] "GET /returnjson HTTP/1.1" 200 -11
directory structure /flask/templates
JavaScript
1
14
14
1
neville@neville-laptop:~/Flask$ ls -lc templates2
total 9123
-rw-r--r-- 1 neville neville 533 2012-01-29 04:52 client_(copy).html4
-rw-r--r-- 1 neville neville 586 2012-01-28 05:01 client.html5
drwxr-xr-x 2 neville neville 4096 2012-01-29 05:44 css6
-rwxr-xr-x 1 neville neville 1628 2012-01-30 01:47 example1.html7
-rw-r--r-- 1 neville neville 677 2012-01-27 14:03 ify.html8
-rwxr-xr-x 1 neville neville 479578 2012-01-27 14:43 jit.js9
-rwxr-xr-x 1 neville neville 158518 2012-01-27 14:43 jit-yc.js10
-rw-r--r-- 1 neville neville 248235 2012-01-29 04:50 jquery.js11
-rw-r--r-- 1 neville neville 1165 2012-01-30 02:01 nev.html12
-rwxr-xr-x 1 neville neville 6963 2012-01-30 01:08 stripped.js13
-rwxrwxrwx 1 neville neville 5767 2012-01-30 01:40 str.js14
directory structure /flask
JavaScript
1
11
11
1
neville@neville-laptop:~/Flask$ ls -lc 2
total 7443
-rw-r--r-- 1 neville neville 524 2012-01-30 01:51 app1.py4
-rw-r--r-- 1 neville neville 540 2012-01-28 01:27 app2.py5
drwxr-xr-x 5 neville neville 4096 2012-01-27 07:19 env6
-rw-r--r-- 1 neville neville 432 2012-01-28 04:58 hello.py7
-rwxr-xr-x 1 neville neville 479578 2012-01-29 08:49 jit.js8
-rw-r--r-- 1 neville neville 248235 2012-01-29 04:50 jquery.js9
-rwxrwxrwx 1 neville neville 5767 2012-01-30 01:57 str.js10
drwxr-xr-x 3 neville neville 4096 2012-01-30 02:01 templates11
str.js file
JavaScript
1
5
1
function init(data){ 2
document.getElementById('container').innerHTML = data.name;3
} 4
5
nev.html
JavaScript
1
36
36
1
<html>2
<head>3
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>4
<!-- JIT Library File -->5
<script language="javascript" type="text/javascript" src="jit.js"></script>6
7
<!-- CSS Files -->8
<link type="text/css" href="/css/base.css" rel="stylesheet" />9
<link type="text/css" href="/css/RGraph.css" rel="stylesheet" />10
11
<title>WikiG</title>12
13
<!-- Example File -->14
<script language="JavaScript" type="text/JavaScript" src="str.js"></script>15
16
<script type="text/javascript">17
$(document).ready(function(){18
$("button").click(function(){19
$.getJSON("/returnjson",20
function(data){21
init(data);22
});//getjson23
});//click24
});//ready25
26
</script>27
28
</head>29
30
<body>31
32
<button>Click me</button>33
<div id="container">34
</body>35
</html>36
Advertisement
Answer
Keep css and js in a folder under ‘static’ folder in Flask app root directory. Something like following hierarchy helps:
JavaScript
1
3
1
Flask/static/javascripts/*.js2
Flask/static/stylesheets/*.css3
and change references in templates and other files.