Skip to content
GitLab
Commit 1bb98d22 authored by Patrick Ade's avatar Patrick Ade
Browse files

Add axios for API requests and refactor authentication store to use axios;... 

Add axios for API requests and refactor authentication store to use axios; remove old auth store, witched to JWT
parent f32849fe
Hide whitespace changes
Inline Side-by-side
backend/app/urls.py
View file @ 1bb98d22
from django.urls import path from django.urls import path
from . import views from . import views
# old api calls without ninja
urlpatterns = [ urlpatterns = [
path("api/set_csrf_token/", views.set_csrf_token, name="set_csrf_token"), path("api/set_csrf_token/", views.set_csrf_token, name="set_csrf_token"),
......
backend/core/urls.py
View file @ 1bb98d22
...@@ -4,6 +4,6 @@ from app.api import api ...@@ -4,6 +4,6 @@ from app.api import api
urlpatterns = [ urlpatterns = [
path("admin/", admin.site.urls), path("admin/", admin.site.urls),
path("", include("app.urls")), # path("", include("app.urls")), # old api calls without ninja
path("api/", api.urls), path("api/", api.urls),
] ]
frontend/package-lock.json
View file @ 1bb98d22
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
"name": "frontend", "name": "frontend",
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"axios": "^1.10.0",
"chart.js": "^4.4.9", "chart.js": "^4.4.9",
"pinia": "^3.0.1", "pinia": "^3.0.1",
"vue": "^3.5.13", "vue": "^3.5.13",
...@@ -2364,6 +2365,23 @@ ...@@ -2364,6 +2365,23 @@
"dev": true, "dev": true,
"license": "Python-2.0" "license": "Python-2.0"
}, },
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
"license": "MIT"
},
"node_modules/axios": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.10.0.tgz",
"integrity": "sha512-/1xYAC4MP/HEG+3duIhFr4ZQXR4sQXOIe+o6sdqzeykGLx6Upp/1p8MHqhINOvGeP7xyNHe7tsiJByc4SSVUxw==",
"license": "MIT",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
"proxy-from-env": "^1.1.0"
}
},
"node_modules/balanced-match": { "node_modules/balanced-match": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
...@@ -2459,6 +2477,19 @@ ...@@ -2459,6 +2477,19 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/call-bind-apply-helpers": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
"integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
"license": "MIT",
"dependencies": {
"es-errors": "^1.3.0",
"function-bind": "^1.1.2"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/callsites": { "node_modules/callsites": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
...@@ -2539,6 +2570,18 @@ ...@@ -2539,6 +2570,18 @@
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"license": "MIT",
"dependencies": {
"delayed-stream": "~1.0.0"
},
"engines": {
"node": ">= 0.8"
}
},
"node_modules/concat-map": { "node_modules/concat-map": {
"version": "0.0.1", "version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
...@@ -2677,6 +2720,29 @@ ...@@ -2677,6 +2720,29 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"license": "MIT",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/dunder-proto": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
"integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
"license": "MIT",
"dependencies": {
"call-bind-apply-helpers": "^1.0.1",
"es-errors": "^1.3.0",
"gopd": "^1.2.0"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.5.161", "version": "1.5.161",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.161.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.161.tgz",
...@@ -2706,6 +2772,51 @@ ...@@ -2706,6 +2772,51 @@
"url": "https://github.com/sponsors/antfu" "url": "https://github.com/sponsors/antfu"
} }
}, },
"node_modules/es-define-property": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
"integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
"license": "MIT",
"engines": {
"node": ">= 0.4"
}
},
"node_modules/es-errors": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
"integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
"license": "MIT",
"engines": {
"node": ">= 0.4"
}
},
"node_modules/es-object-atoms": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
"integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
"license": "MIT",
"dependencies": {
"es-errors": "^1.3.0"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/es-set-tostringtag": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
"integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
"license": "MIT",
"dependencies": {
"es-errors": "^1.3.0",
"get-intrinsic": "^1.2.6",
"has-tostringtag": "^1.0.2",
"hasown": "^2.0.2"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/esbuild": { "node_modules/esbuild": {
"version": "0.25.5", "version": "0.25.5",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.5.tgz", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.5.tgz",
...@@ -3225,6 +3336,42 @@ ...@@ -3225,6 +3336,42 @@
"dev": true, "dev": true,
"license": "ISC" "license": "ISC"
}, },
"node_modules/follow-redirects": {
"version": "1.15.9",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.9.tgz",
"integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==",
"funding": [
{
"type": "individual",
"url": "https://github.com/sponsors/RubenVerborgh"
}
],
"license": "MIT",
"engines": {
"node": ">=4.0"
},
"peerDependenciesMeta": {
"debug": {
"optional": true
}
}
},
"node_modules/form-data": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.3.tgz",
"integrity": "sha512-qsITQPfmvMOSAdeyZ+12I1c+CKSstAFAwu+97zrnWAbIr5u8wfsExUzCesVLC8NgHuRUqNN4Zy6UPWUTRGslcA==",
"license": "MIT",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"es-set-tostringtag": "^2.1.0",
"hasown": "^2.0.2",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/fs-extra": { "node_modules/fs-extra": {
"version": "11.3.0", "version": "11.3.0",
"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.0.tgz", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.0.tgz",
...@@ -3255,6 +3402,15 @@ ...@@ -3255,6 +3402,15 @@
"node": "^8.16.0 || ^10.6.0 || >=11.0.0" "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
} }
}, },
"node_modules/function-bind": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
"integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
"license": "MIT",
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/gensync": { "node_modules/gensync": {
"version": "1.0.0-beta.2", "version": "1.0.0-beta.2",
"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
...@@ -3265,6 +3421,43 @@ ...@@ -3265,6 +3421,43 @@
"node": ">=6.9.0" "node": ">=6.9.0"
} }
}, },
"node_modules/get-intrinsic": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
"integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
"license": "MIT",
"dependencies": {
"call-bind-apply-helpers": "^1.0.2",
"es-define-property": "^1.0.1",
"es-errors": "^1.3.0",
"es-object-atoms": "^1.1.1",
"function-bind": "^1.1.2",
"get-proto": "^1.0.1",
"gopd": "^1.2.0",
"has-symbols": "^1.1.0",
"hasown": "^2.0.2",
"math-intrinsics": "^1.1.0"
},
"engines": {
"node": ">= 0.4"
},
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/get-proto": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
"integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
"license": "MIT",
"dependencies": {
"dunder-proto": "^1.0.1",
"es-object-atoms": "^1.0.0"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/get-stream": { "node_modules/get-stream": {
"version": "9.0.1", "version": "9.0.1",
"resolved": "https://registry.npmjs.org/get-stream/-/get-stream-9.0.1.tgz", "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-9.0.1.tgz",
...@@ -3308,6 +3501,18 @@ ...@@ -3308,6 +3501,18 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/gopd": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
"integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
"license": "MIT",
"engines": {
"node": ">= 0.4"
},
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/graceful-fs": { "node_modules/graceful-fs": {
"version": "4.2.11", "version": "4.2.11",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
...@@ -3332,6 +3537,45 @@ ...@@ -3332,6 +3537,45 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/has-symbols": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
"integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
"license": "MIT",
"engines": {
"node": ">= 0.4"
},
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/has-tostringtag": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
"integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
"license": "MIT",
"dependencies": {
"has-symbols": "^1.0.3"
},
"engines": {
"node": ">= 0.4"
},
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/hasown": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
"integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
"license": "MIT",
"dependencies": {
"function-bind": "^1.1.2"
},
"engines": {
"node": ">= 0.4"
}
},
"node_modules/he": { "node_modules/he": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
...@@ -3717,6 +3961,15 @@ ...@@ -3717,6 +3961,15 @@
"@jridgewell/sourcemap-codec": "^1.5.0" "@jridgewell/sourcemap-codec": "^1.5.0"
} }
}, },
"node_modules/math-intrinsics": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
"integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
"license": "MIT",
"engines": {
"node": ">= 0.4"
}
},
"node_modules/memorystream": { "node_modules/memorystream": {
"version": "0.3.1", "version": "0.3.1",
"resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz", "resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz",
...@@ -3750,6 +4003,27 @@ ...@@ -3750,6 +4003,27 @@
"node": ">=8.6" "node": ">=8.6"
} }
}, },
"node_modules/mime-db": {
"version": "1.52.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"license": "MIT",
"engines": {
"node": ">= 0.6"
}
},
"node_modules/mime-types": {
"version": "2.1.35",
"resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"license": "MIT",
"dependencies": {
"mime-db": "1.52.0"
},
"engines": {
"node": ">= 0.6"
}
},
"node_modules/minimatch": { "node_modules/minimatch": {
"version": "9.0.5", "version": "9.0.5",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
...@@ -4232,6 +4506,12 @@ ...@@ -4232,6 +4506,12 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
"license": "MIT"
},
"node_modules/punycode": { "node_modules/punycode": {
"version": "2.3.1", "version": "2.3.1",
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
......
frontend/package.json
View file @ 1bb98d22
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
"format": "prettier --write src/" "format": "prettier --write src/"
}, },
"dependencies": { "dependencies": {
"axios": "^1.10.0",
"chart.js": "^4.4.9", "chart.js": "^4.4.9",
"pinia": "^3.0.1", "pinia": "^3.0.1",
"vue": "^3.5.13", "vue": "^3.5.13",
......
frontend/src/main.ts
View file @ 1bb98d22
...@@ -13,6 +13,5 @@ app.use(createPinia()) ...@@ -13,6 +13,5 @@ app.use(createPinia())
app.use(router) app.use(router)
const authStore = useAuthStore() const authStore = useAuthStore()
authStore.setCsrfToken()
app.mount('#app') app.mount('#app')
frontend/src/services/apiClient.ts 0 → 100644
View file @ 1bb98d22
import axios from 'axios'
const api = axios.create({
baseURL: 'http://localhost:8000/api',
headers: {
'Content-Type': 'application/json',
},
})
// Automatically inject token into headers
api.interceptors.request.use(config => {
const token = localStorage.getItem('token')
if (token) {
config.headers.Authorization = `Bearer ${token}`
}
return config
})
export default api
\ No newline at end of file
frontend/src/stores/auth.ts
View file @ 1bb98d22
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { type Router } from 'vue-router' import { type Router } from 'vue-router'
import api from '@/services/apiClient'
interface AuthState { interface AuthState {
user: User | null user: User | null
...@@ -8,8 +9,9 @@ interface AuthState { ...@@ -8,8 +9,9 @@ interface AuthState {
interface User { interface User {
id: number id: number
email: string username: string
[key: string]: any // Add more fields as needed email?: string
[key: string]: any
} }
export const useAuthStore = defineStore('auth', { export const useAuthStore = defineStore('auth', {
...@@ -22,131 +24,77 @@ export const useAuthStore = defineStore('auth', { ...@@ -22,131 +24,77 @@ export const useAuthStore = defineStore('auth', {
isAuthenticated: false, isAuthenticated: false,
} }
}, },
actions: {
async setCsrfToken(): Promise<void> {
await fetch('http://localhost:8000/api/set_csrf_token', {
method: 'GET',
credentials: 'include',
})
},
async login(email: string, password: string, router: Router | null = null): Promise<void> { actions: {
const response = await fetch('http://localhost:8000/api/login', { async login(username: string, password: string, router: Router | null = null): Promise<void> {
method: 'POST', try {
headers: { const response = await api.post('/auth/login', {
'Content-Type': 'application/json', username,
'X-CSRFToken': getCSRFToken(),
},
body: JSON.stringify({
email,
password, password,
}), })
credentials: 'include',
}) const token = response.data.token
const data = await response.json() if (!token) throw new Error('No token received')
if (data.success) {
// Save JWT to localStorage
localStorage.setItem('token', token)
this.isAuthenticated = true this.isAuthenticated = true
this.saveState() await this.fetchUser()
if (router) { if (router) {
await router.push({ await router.push({ name: 'home' })
name: 'home',
})
} }
} else { } catch (error) {
console.error('Login error:', error)
this.user = null this.user = null
this.isAuthenticated = false this.isAuthenticated = false
this.saveState() this.saveState()
}
},
async logout(router: Router | null = null): Promise<void> {
try {
const response = await fetch('http://localhost:8000/api/logout', {
method: 'POST',
headers: {
'X-CSRFToken': getCSRFToken(),
},
credentials: 'include',
})
if (response.ok) {
this.user = null
this.isAuthenticated = false
this.saveState()
if (router) {
await router.push({
name: 'login',
})
}
}
} catch (error) {
console.error('Logout failed', error)
throw error throw error
} }
}, },
async fetchUser(): Promise<void> { async fetchUser(): Promise<void> {
const token = localStorage.getItem('token')
if (!token) {
this.user = null
this.isAuthenticated = false
this.saveState()
return
}
try { try {
const response = await fetch('http://localhost:8000/api/user', { const response = await api.get('/auth/me')
credentials: 'include', this.user = response.data
headers: { this.isAuthenticated = true
'Content-Type': 'application/json',
'X-CSRFToken': getCSRFToken(),
},
})
if (response.ok) {
const data: User = await response.json()
this.user = data
this.isAuthenticated = true
} else {
this.user = null
this.isAuthenticated = false
}
} catch (error) { } catch (error) {
console.error('Failed to fetch user', error) console.error('Fetch user error:', error)
this.user = null this.user = null
this.isAuthenticated = false this.isAuthenticated = false
} }
this.saveState() this.saveState()
}, },
saveState(): void { logout(router: Router | null = null): void {
/* localStorage.removeItem('token')
We save state to local storage to keep the this.user = null
state when the user reloads the page. this.isAuthenticated = false
this.saveState()
if (router) {
router.push({ name: 'login' })
}
},
This is a simple way to persist state. For a more robust solution, saveState(): void {
use pinia-persistent-state.
*/
localStorage.setItem( localStorage.setItem(
'authState', 'authState',
JSON.stringify({ JSON.stringify({
user: this.user, user: this.user,
isAuthenticated: this.isAuthenticated, isAuthenticated: this.isAuthenticated,
}), })
) )
}, },
}, },
}) })
export function getCSRFToken(): string {
/*
We get the CSRF token from the cookie to include in our requests.
This is necessary for CSRF protection in Django.
*/
const name = 'csrftoken'
let cookieValue: string | null = null
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';')
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim()
if (cookie.substring(0, name.length + 1) === name + '=') {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1))
break
}
}
}
if (cookieValue === null) {
throw new Error('Missing CSRF cookie.')
}
return cookieValue
}
\ No newline at end of file
frontend/src/stores/authold.js deleted 100644 → 0
View file @ f32849fe
import { defineStore } from 'pinia'
export const useAuthStore = defineStore('auth', {
state: () => {
const storedState = localStorage.getItem('authState')
return storedState
? JSON.parse(storedState)
: {
user: null,
isAuthenticated: false,
}
},
actions: {
async setCsrfToken() {
await fetch('http://localhost:8000/api/set-csrf-token', {
method: 'GET',
credentials: 'include',
})
},
async login(email, password, router = null) {
const response = await fetch('http://localhost:8000/api/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': getCSRFToken(),
},
body: JSON.stringify({
email,
password,
}),
credentials: 'include',
})
const data = await response.json()
if (data.success) {
this.isAuthenticated = true
this.saveState()
if (router) {
await router.push({
name: 'home',
})
}
} else {
this.user = null
this.isAuthenticated = false
this.saveState()
}
},
async logout(router = null) {
try {
const response = await fetch('http://localhost:8000/api/logout', {
method: 'POST',
headers: {
'X-CSRFToken': getCSRFToken(),
},
credentials: 'include',
})
if (response.ok) {
this.user = null
this.isAuthenticated = false
this.saveState()
if (router) {
await router.push({
name: 'login',
})
}
}
} catch (error) {
console.error('Logout failed', error)
throw error
}
},
async fetchUser() {
try {
const response = await fetch('http://localhost:8000/api/user', {
credentials: 'include',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': getCSRFToken(),
},
})
if (response.ok) {
const data = await response.json()
this.user = data
this.isAuthenticated = true
} else {
this.user = null
this.isAuthenticated = false
}
} catch (error) {
console.error('Failed to fetch user', error)
this.user = null
this.isAuthenticated = false
}
this.saveState()
},
saveState() {
/*
We save state to local storage to keep the
state when the user reloads the page.
This is a simple way to persist state. For a more robust solution,
use pinia-persistent-state.
*/
localStorage.setItem(
'authState',
JSON.stringify({
user: this.user,
isAuthenticated: this.isAuthenticated,
}),
)
},
},
})
export function getCSRFToken() {
/*
We get the CSRF token from the cookie to include in our requests.
This is necessary for CSRF protection in Django.
*/
const name = 'csrftoken'
let cookieValue = null
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';')
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim()
if (cookie.substring(0, name.length + 1) === name + '=') {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1))
break
}
}
}
if (cookieValue === null) {
throw 'Missing CSRF cookie.'
}
return cookieValue
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal