")
60 | def home(path):
61 | return render_template("index.html")
62 |
63 |
64 | @app.route("/api/login", methods=["POST"])
65 | def login():
66 | data = request.json
67 | username = data.get("username")
68 | password = data.get("password")
69 |
70 | for user in users:
71 | if user["username"] == username and user["password"] == password:
72 | user_model = User()
73 | user_model.id = user["id"]
74 | login_user(user_model)
75 | return jsonify({"login": True})
76 |
77 | return jsonify({"login": False})
78 |
79 |
80 | @app.route("/api/data", methods=["GET"])
81 | @login_required
82 | def user_data():
83 | user = get_user(current_user.id)
84 | return jsonify({"username": user["username"]})
85 |
86 |
87 | @app.route("/api/getsession")
88 | def check_session():
89 | if current_user.is_authenticated:
90 | return jsonify({"login": True})
91 |
92 | return jsonify({"login": False})
93 |
94 |
95 | @app.route("/api/logout")
96 | @login_required
97 | def logout():
98 | logout_user()
99 | return jsonify({"logout": True})
100 |
101 |
102 | if __name__ == "__main__":
103 | app.run(debug=True, load_dotenv=True)
104 |
--------------------------------------------------------------------------------
/flask-spa-jinja/src/App.svelte:
--------------------------------------------------------------------------------
1 |
80 |
81 |
86 |
87 |
88 |
89 | {#if isAuthenticated}
90 |
You are authenticated!
91 |
92 |
93 | {:else}
94 | Log in
95 |
103 | {/if}
104 |
105 |
106 |
--------------------------------------------------------------------------------
/flask-spa-same-origin/backend/app.py:
--------------------------------------------------------------------------------
1 | from flask import Flask, jsonify, request
2 | from flask_login import (
3 | LoginManager,
4 | UserMixin,
5 | current_user,
6 | login_required,
7 | login_user,
8 | logout_user,
9 | )
10 | from flask_wtf.csrf import CSRFProtect, generate_csrf
11 |
12 | app = Flask(__name__, static_folder="public")
13 | app.config.update(
14 | DEBUG=True,
15 | SECRET_KEY="secret_sauce",
16 | SESSION_COOKIE_HTTPONLY=True,
17 | REMEMBER_COOKIE_HTTPONLY=True,
18 | SESSION_COOKIE_SAMESITE="Strict",
19 | )
20 |
21 | login_manager = LoginManager()
22 | login_manager.init_app(app)
23 | login_manager.session_protection = "strong"
24 |
25 | csrf = CSRFProtect(app)
26 |
27 | # database
28 | users = [
29 | {
30 | "id": 1,
31 | "username": "test",
32 | "password": "test",
33 | }
34 | ]
35 |
36 |
37 | class User(UserMixin):
38 | ...
39 |
40 |
41 | def get_user(user_id: int):
42 | for user in users:
43 | if int(user["id"]) == int(user_id):
44 | return user
45 | return None
46 |
47 |
48 | @login_manager.user_loader
49 | def user_loader(id: int):
50 | user = get_user(id)
51 | if user:
52 | user_model = User()
53 | user_model.id = user["id"]
54 | return user_model
55 | return None
56 |
57 |
58 | @app.route("/api/ping", methods=["GET"])
59 | def home():
60 | return jsonify({"ping": "pong!"})
61 |
62 |
63 | @app.route("/api/getcsrf", methods=["GET"])
64 | def get_csrf():
65 | token = generate_csrf()
66 | response = jsonify({"detail": "CSRF cookie set"})
67 | response.headers.set("X-CSRFToken", token)
68 | return response
69 |
70 |
71 | @app.route("/api/login", methods=["POST"])
72 | def login():
73 | data = request.json
74 | username = data.get("username")
75 | password = data.get("password")
76 |
77 | for user in users:
78 | if user["username"] == username and user["password"] == password:
79 | user_model = User()
80 | user_model.id = user["id"]
81 | login_user(user_model)
82 | return jsonify({"login": True})
83 |
84 | return jsonify({"login": False})
85 |
86 |
87 | @app.route("/api/data", methods=["GET"])
88 | @login_required
89 | def user_data():
90 | user = get_user(current_user.id)
91 | return jsonify({"username": user["username"]})
92 |
93 |
94 | @app.route("/api/getsession")
95 | def check_session():
96 | if current_user.is_authenticated:
97 | return jsonify({"login": True})
98 |
99 | return jsonify({"login": False})
100 |
101 |
102 | @app.route("/api/logout")
103 | @login_required
104 | def logout():
105 | logout_user()
106 | return jsonify({"logout": True})
107 |
108 |
109 | if __name__ == "__main__":
110 | app.run(debug=True, host="0.0.0.0")
111 |
--------------------------------------------------------------------------------
/flask-spa-cross-origin/backend/app.py:
--------------------------------------------------------------------------------
1 | from flask import Flask, jsonify, request
2 | from flask_cors import CORS
3 | from flask_login import (
4 | LoginManager,
5 | UserMixin,
6 | current_user,
7 | login_required,
8 | login_user,
9 | logout_user,
10 | )
11 | from flask_wtf.csrf import CSRFProtect, generate_csrf
12 |
13 | app = Flask(__name__, static_folder="public")
14 | app.config.update(
15 | DEBUG=True,
16 | SECRET_KEY="secret_sauce",
17 | SESSION_COOKIE_HTTPONLY=True,
18 | REMEMBER_COOKIE_HTTPONLY=True,
19 | SESSION_COOKIE_SAMESITE="Lax",
20 | )
21 |
22 | login_manager = LoginManager()
23 | login_manager.init_app(app)
24 | login_manager.session_protection = "strong"
25 |
26 | csrf = CSRFProtect(app)
27 | cors = CORS(
28 | app,
29 | resources={r"*": {"origins": "http://localhost:8080"}},
30 | expose_headers=["Content-Type", "X-CSRFToken"],
31 | supports_credentials=True,
32 | )
33 |
34 | # database
35 | users = [
36 | {
37 | "id": 1,
38 | "username": "test",
39 | "password": "test",
40 | }
41 | ]
42 |
43 |
44 | class User(UserMixin):
45 | ...
46 |
47 |
48 | def get_user(user_id: int):
49 | for user in users:
50 | if int(user["id"]) == int(user_id):
51 | return user
52 | return None
53 |
54 |
55 | @login_manager.user_loader
56 | def user_loader(id: int):
57 | user = get_user(id)
58 | if user:
59 | user_model = User()
60 | user_model.id = user["id"]
61 | return user_model
62 | return None
63 |
64 |
65 | @app.route("/api/ping", methods=["GET"])
66 | def home():
67 | return jsonify({"ping": "pong!"})
68 |
69 |
70 | @app.route("/api/getcsrf", methods=["GET"])
71 | def get_csrf():
72 | token = generate_csrf()
73 | response = jsonify({"detail": "CSRF cookie set"})
74 | response.headers.set("X-CSRFToken", token)
75 | return response
76 |
77 |
78 | @app.route("/api/login", methods=["POST"])
79 | def login():
80 | data = request.json
81 | username = data.get("username")
82 | password = data.get("password")
83 |
84 | for user in users:
85 | if user["username"] == username and user["password"] == password:
86 | user_model = User()
87 | user_model.id = user["id"]
88 | login_user(user_model)
89 | return jsonify({"login": True})
90 |
91 | return jsonify({"login": False})
92 |
93 |
94 | @app.route("/api/data", methods=["GET"])
95 | @login_required
96 | def user_data():
97 | user = get_user(current_user.id)
98 | return jsonify({"username": user["username"]})
99 |
100 |
101 | @app.route("/api/getsession", methods=["GET"])
102 | def check_session():
103 | if current_user.is_authenticated:
104 | return jsonify({"login": True})
105 |
106 | return jsonify({"login": False})
107 |
108 |
109 | @app.route("/api/logout", methods=["GET"])
110 | @login_required
111 | def logout():
112 | logout_user()
113 | return jsonify({"logout": True})
114 |
115 |
116 | if __name__ == "__main__":
117 | app.run(debug=True)
118 |
--------------------------------------------------------------------------------
/flask-spa-same-origin/frontend/src/App.svelte:
--------------------------------------------------------------------------------
1 |
94 |
95 |
100 |
101 |
102 |
103 | {#if isAuthenticated}
104 |
You are authenticated!
105 |
106 |
107 | {:else}
108 | Log in
109 |
117 | {/if}
118 |
119 |
120 |
--------------------------------------------------------------------------------
/flask-spa-cross-origin/frontend/src/App.svelte:
--------------------------------------------------------------------------------
1 |
95 |
96 |
101 |
102 |
103 |
104 | {#if isAuthenticated}
105 |
You are authenticated!
106 |
107 |
108 | {:else}
109 | Log in
110 |
118 | {/if}
119 |
120 |
121 |
--------------------------------------------------------------------------------
/flask-spa-jinja/scripts/setupTypeScript.js:
--------------------------------------------------------------------------------
1 | // @ts-check
2 |
3 | /** This script modifies the project to support TS code in .svelte files like:
4 |
5 |
8 |
9 | As well as validating the code for CI.
10 | */
11 |
12 | /** To work on this script:
13 | rm -rf test-template template && git clone sveltejs/template test-template && node scripts/setupTypeScript.js test-template
14 | */
15 |
16 | const fs = require("fs")
17 | const path = require("path")
18 | const { argv } = require("process")
19 |
20 | const projectRoot = argv[2] || path.join(__dirname, "..")
21 |
22 | // Add deps to pkg.json
23 | const packageJSON = JSON.parse(fs.readFileSync(path.join(projectRoot, "package.json"), "utf8"))
24 | packageJSON.devDependencies = Object.assign(packageJSON.devDependencies, {
25 | "svelte-check": "^2.0.0",
26 | "svelte-preprocess": "^4.0.0",
27 | "@rollup/plugin-typescript": "^8.0.0",
28 | "typescript": "^4.0.0",
29 | "tslib": "^2.0.0",
30 | "@tsconfig/svelte": "^2.0.0"
31 | })
32 |
33 | // Add script for checking
34 | packageJSON.scripts = Object.assign(packageJSON.scripts, {
35 | "check": "svelte-check --tsconfig ./tsconfig.json"
36 | })
37 |
38 | // Write the package JSON
39 | fs.writeFileSync(path.join(projectRoot, "package.json"), JSON.stringify(packageJSON, null, " "))
40 |
41 | // mv src/main.js to main.ts - note, we need to edit rollup.config.js for this too
42 | const beforeMainJSPath = path.join(projectRoot, "src", "main.js")
43 | const afterMainTSPath = path.join(projectRoot, "src", "main.ts")
44 | fs.renameSync(beforeMainJSPath, afterMainTSPath)
45 |
46 | // Switch the app.svelte file to use TS
47 | const appSveltePath = path.join(projectRoot, "src", "App.svelte")
48 | let appFile = fs.readFileSync(appSveltePath, "utf8")
49 | appFile = appFile.replace("
8 |
9 | As well as validating the code for CI.
10 | */
11 |
12 | /** To work on this script:
13 | rm -rf test-template template && git clone sveltejs/template test-template && node scripts/setupTypeScript.js test-template
14 | */
15 |
16 | const fs = require("fs")
17 | const path = require("path")
18 | const { argv } = require("process")
19 |
20 | const projectRoot = argv[2] || path.join(__dirname, "..")
21 |
22 | // Add deps to pkg.json
23 | const packageJSON = JSON.parse(fs.readFileSync(path.join(projectRoot, "package.json"), "utf8"))
24 | packageJSON.devDependencies = Object.assign(packageJSON.devDependencies, {
25 | "svelte-check": "^2.0.0",
26 | "svelte-preprocess": "^4.0.0",
27 | "@rollup/plugin-typescript": "^8.0.0",
28 | "typescript": "^4.0.0",
29 | "tslib": "^2.0.0",
30 | "@tsconfig/svelte": "^2.0.0"
31 | })
32 |
33 | // Add script for checking
34 | packageJSON.scripts = Object.assign(packageJSON.scripts, {
35 | "check": "svelte-check --tsconfig ./tsconfig.json"
36 | })
37 |
38 | // Write the package JSON
39 | fs.writeFileSync(path.join(projectRoot, "package.json"), JSON.stringify(packageJSON, null, " "))
40 |
41 | // mv src/main.js to main.ts - note, we need to edit rollup.config.js for this too
42 | const beforeMainJSPath = path.join(projectRoot, "src", "main.js")
43 | const afterMainTSPath = path.join(projectRoot, "src", "main.ts")
44 | fs.renameSync(beforeMainJSPath, afterMainTSPath)
45 |
46 | // Switch the app.svelte file to use TS
47 | const appSveltePath = path.join(projectRoot, "src", "App.svelte")
48 | let appFile = fs.readFileSync(appSveltePath, "utf8")
49 | appFile = appFile.replace("
8 |
9 | As well as validating the code for CI.
10 | */
11 |
12 | /** To work on this script:
13 | rm -rf test-template template && git clone sveltejs/template test-template && node scripts/setupTypeScript.js test-template
14 | */
15 |
16 | const fs = require("fs")
17 | const path = require("path")
18 | const { argv } = require("process")
19 |
20 | const projectRoot = argv[2] || path.join(__dirname, "..")
21 |
22 | // Add deps to pkg.json
23 | const packageJSON = JSON.parse(fs.readFileSync(path.join(projectRoot, "package.json"), "utf8"))
24 | packageJSON.devDependencies = Object.assign(packageJSON.devDependencies, {
25 | "svelte-check": "^2.0.0",
26 | "svelte-preprocess": "^4.0.0",
27 | "@rollup/plugin-typescript": "^8.0.0",
28 | "typescript": "^4.0.0",
29 | "tslib": "^2.0.0",
30 | "@tsconfig/svelte": "^2.0.0"
31 | })
32 |
33 | // Add script for checking
34 | packageJSON.scripts = Object.assign(packageJSON.scripts, {
35 | "check": "svelte-check --tsconfig ./tsconfig.json"
36 | })
37 |
38 | // Write the package JSON
39 | fs.writeFileSync(path.join(projectRoot, "package.json"), JSON.stringify(packageJSON, null, " "))
40 |
41 | // mv src/main.js to main.ts - note, we need to edit rollup.config.js for this too
42 | const beforeMainJSPath = path.join(projectRoot, "src", "main.js")
43 | const afterMainTSPath = path.join(projectRoot, "src", "main.ts")
44 | fs.renameSync(beforeMainJSPath, afterMainTSPath)
45 |
46 | // Switch the app.svelte file to use TS
47 | const appSveltePath = path.join(projectRoot, "src", "App.svelte")
48 | let appFile = fs.readFileSync(appSveltePath, "utf8")
49 | appFile = appFile.replace("