sveltekit-auth-example 1.0.15 → 1.0.19

package/CHANGELOG.md

@@ -1,9 +1,22 @@
 # Backlog
-* [Bug] Address TypeScript issues found during `npm run check` (11 errors) - most related to use of Action type
+* Add username and Avatar icon to menu bar
 * Consider not setting defaultUser in loginSession as it would simplify +layout.svelte.
 * Refactor $env/dynamic/private and public
 * Add password complexity checking on /register and /profile pages (only checks for length currently despite what the pages say)
 
+# 1.0.19
+* Added SvelteKit's cookies implementation in RequestEvent
+* [Bug] Logout then go to http://localhost/admin gives error on auth.ts:39
+
+# 1.0.18
+* Bump dependencies
+
+# 1.0.17
+* Bump dependencies
+
+# 1.0.16
+* [Bug] Fixed LayoutServerLoad typing
+
 # 1.0.15
 * [Bug] Replaced use of Action type in +server.ts files (only works for +page.server.ts)
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sveltekit-auth-example",
   "description": "SvelteKit Authentication Example",
-  "version": "1.0.15",
+  "version": "1.0.19",
   "private": false,
   "author": "Nate Stuyvesant",
   "license": "https://github.com/nstuyvesant/sveltekit-auth-example/blob/master/LICENSE",
@@ -34,13 +34,12 @@
   },
   "engines": {
     "node": "~18.8.0",
-    "npm": "^8.18.0"
+    "npm": "^8.19.1"
   },
   "type": "module",
   "dependencies": {
-    "cookie": "^0.5.0",
-    "dotenv": "^16.0.1",
-    "google-auth-library": "^8.4.0",
+    "dotenv": "^16.0.2",
+    "google-auth-library": "^8.5.1",
     "jsonwebtoken": "^8.5.1",
     "pg": "^8.8.0"
   },
@@ -52,21 +51,21 @@
     "@types/google.accounts": "0.0.2",
     "@types/jsonwebtoken": "^8.5.9",
     "@types/pg": "^8.6.5",
-    "@typescript-eslint/eslint-plugin": "^5.35.0",
-    "@typescript-eslint/parser": "^5.35.0",
-    "bootstrap": "^5.2.0",
+    "@typescript-eslint/eslint-plugin": "^5.36.1",
+    "@typescript-eslint/parser": "^5.36.1",
+    "bootstrap": "^5.2.1",
     "bootstrap-icons": "^1.9.1",
     "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-svelte3": "^4.0.0",
     "prettier": "^2.7.1",
     "prettier-plugin-svelte": "^2.7.0",
-    "sass": "^1.54.5",
-    "svelte": "^3.49.0",
-    "svelte-check": "^2.8.1",
+    "sass": "^1.54.8",
+    "svelte": "^3.50.0",
+    "svelte-check": "^2.9.0",
     "svelte-preprocess": "^4.10.7",
     "tslib": "^2.4.0",
     "typescript": "^4.7.4",
-    "vite": "^3.0.9"
+    "vite": "^3.1.0"
   }
 }

package/src/hooks.ts

@@ -1,9 +1,8 @@
-import * as cookie from 'cookie'
 import type { Handle, RequestEvent } from '@sveltejs/kit'
 import { query } from './routes/_db'
 
 // Attach authorization to each server request (role may have changed)
-async function attachUserToRequest(sessionId: string, event: RequestEvent) {
+async function attachUserToRequestEvent(sessionId: string, event: RequestEvent) {
   const sql = `
     SELECT * FROM get_session($1);`
   const { rows } = await query(sql, [sessionId])
@@ -12,24 +11,20 @@ async function attachUserToRequest(sessionId: string, event: RequestEvent) {
   }
 }
 
-function deleteCookieIfNoUser(event: RequestEvent, response: Response) {
-  if (!event.locals.user) {
-    response.headers.set('Set-Cookie', `session=; Path=/; HttpOnly; SameSite=Lax; Expires=${new Date().toUTCString()}`)
-  }
-}
-
 // Invoked for each endpoint called and initially for SSR router
 export const handle: Handle = async ({ event, resolve }) => {
+  const { cookies } = event
+  const sessionId = cookies.get('session')
 
   // before endpoint or page is called
-  const cookies = cookie.parse(event.request.headers.get('Cookie') || '')
-  if (cookies.session) {
-    await attachUserToRequest(cookies.session, event)
+  if (sessionId) {
+    await attachUserToRequestEvent(sessionId, event)
   }
 
   const response = await resolve(event)
 
   // after endpoint or page is called
-  deleteCookieIfNoUser(event, response)
+  if (!event.locals.user) cookies.delete('session')
+
   return response
 }

package/src/routes/+layout.server.ts

@@ -1,6 +1,7 @@
 import type { LayoutServerLoad } from './$types'
 
-export function load({ locals }): LayoutServerLoad {
+export const load: LayoutServerLoad = (event) => {
+  const locals = event.locals
   const { user }: { user: User } = locals // locals.user set by hooks.ts/handle(), undefined if not logged in
   return {
     user

package/src/routes/+layout.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
   import { onMount } from 'svelte'
-  import type { LayoutData } from './$types'
+  import type { LayoutServerData } from './$types'
   import { goto } from '$app/navigation'
   import { page } from '$app/stores'
   import { loginSession, toast } from '../stores'
   import useAuth from '$lib/auth'
   import 'bootstrap/scss/bootstrap.scss' // preferred way to load Bootstrap SCSS for hot module reloading
 
-	export let data: LayoutData
+	export let data: LayoutServerData
 
   // If returning from different website, runs once (as it's an SPA) to restore user session if session cookie is still valid
   const { user } = data

package/src/routes/admin/+page.server.ts

@@ -4,8 +4,9 @@ import type { PageServerLoad } from './$types'
 export const load: PageServerLoad = async ({locals})=> {
 	const { user } = locals
 	const authorized = ['admin']
-	if (user && !authorized.includes(user.role)) {
-		throw redirect(302, '/login?referrer=/admin');
+	console.log('admin/+page.server.ts', user)
+	if (!user || !authorized.includes(user.role)) {
+		throw redirect(302, '/login?referrer=/admin')
 	}
 
 	return {

package/src/routes/api/v1/user/+server.ts

@@ -1,4 +1,5 @@
-import { error, json, type RequestHandler } from '@sveltejs/kit'
+import { error, json} from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
 import { query } from '../../../_db'
 
 export const PUT: RequestHandler = async event => {

package/src/routes/auth/[slug]/+server.ts

@@ -1,4 +1,5 @@
-import { error, json, type RequestHandler } from '@sveltejs/kit'
+import { error, json } from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
 import { query } from '../../_db'
 
 export const POST: RequestHandler = async (event) => {
@@ -15,11 +16,12 @@ export const POST: RequestHandler = async (event) => {
 					sql = `CALL delete_session($1);`
 					result = await query(sql, [event.locals.user.id])
 				}
-				return new Response(JSON.stringify({ message: 'Logout successful.' }), {
+				return json({ message: 'Logout successful.' }, {
 					headers: {
 						'Set-Cookie': `session=; Path=/; SameSite=Lax; HttpOnly; Expires=${new Date().toUTCString()}`
 					}
 				})
+
 			case 'login':
 				sql = `SELECT authenticate($1) AS "authenticationResult";`
 				break

package/src/routes/auth/forgot/+server.ts

@@ -1,4 +1,4 @@
-import type { RequestHandler } from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
 import type { Secret } from 'jsonwebtoken'
 import jwt from 'jsonwebtoken'
 import dotenv from 'dotenv'

package/src/routes/auth/google/+server.ts

@@ -1,4 +1,5 @@
-import { error, type RequestHandler } from '@sveltejs/kit'
+import { error, json } from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
 import { OAuth2Client } from 'google-auth-library'
 import { query } from '../../_db';
 import { config } from '$lib/config'
@@ -50,15 +51,14 @@ export const POST: RequestHandler = async event => {
     // Prevent hooks.ts's handler() from deleting cookie thinking no one has authenticated
     event.locals.user = userSession.user
 
-    return new Response(JSON.stringify({
+    return json({
       message: 'Successful Google Sign-In.',
       user: userSession.user
-    }), {
+    }, {
       headers: {
       'Set-Cookie': `session=${userSession.id}; Path=/; SameSite=Lax; HttpOnly;`}
-      }
-    )
-
+    })
+    
   } catch (err) {
     let message = ''
     if (err instanceof Error) message = err.message

package/src/routes/auth/reset/+server.ts

@@ -1,6 +1,6 @@
 import { json as json$1 } from '@sveltejs/kit';
 import dotenv from 'dotenv'
-import type { RequestHandler } from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
 import type  { JwtPayload } from 'jsonwebtoken'
 import jwt from 'jsonwebtoken'
 import { query } from '../../_db'

package/src/routes/profile/+page.server.ts

@@ -5,7 +5,7 @@ export const load: PageServerLoad = async ({ locals }) => {
   const { user } = locals // populated by /src/hooks.ts
 
   const authorized = ['admin', 'teacher', 'student'] // must be logged-in
-  if (user && !authorized.includes(user.role)) {
+  if (!user || !authorized.includes(user.role)) {
     throw redirect(302, '/login?referrer=/profile')
   }
 

package/src/routes/register/+page.server.ts

@@ -1,10 +1,10 @@
-import { redirect } from '@sveltejs/kit';
+import { redirect } from '@sveltejs/kit'
 import type { PageServerLoad } from './$types'
 
 export const load: PageServerLoad = ({ locals }) => {
 	const { user } = locals
 	if (user) { // Redirect to home if user is logged in already
-		throw redirect(302, '/');
+		throw redirect(302, '/')
 	}
 	return {}
 }

package/src/routes/teachers/+page.server.ts

@@ -2,8 +2,9 @@ import { redirect } from '@sveltejs/kit'
 import type { PageServerLoad } from './$types'
 
 export const load: PageServerLoad = async ({locals}) => {
+	const { user } = locals
 	const authorized = ['admin', 'teacher']
-	if (!locals.user || !authorized.includes(locals.user.role)) {
+	if (!user || !authorized.includes(user.role)) {
 		throw redirect(302, '/login?referrer=/teachers')
 	}