feat: add setRequestToken and fetchRequestToken methods

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

Author: susnux

.gitignore

@@ -6,13 +6,16 @@ logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-
 # Runtime data
 pids
 *.pid
 *.seed
 *.pid.lock
 
+# Tests
+.vitest*
+__screenshots__/
+
 # Directory for instrumented libs generated by jscoverage/JSCover
 lib-cov
 

lib/globals.d.ts globals.d.tslib/globals.d.ts renamed to globals.d.ts

@@ -4,6 +4,9 @@
  */
 
 declare global {
+	// eslint-disable-next-line camelcase
+	var _nc_auth_requesttoken: string | undefined
+
 	interface Window {
 		_oc_isadmin?: boolean
 	}

lib/eventbus.d.ts

@@ -7,6 +7,7 @@ import type { NextcloudUser } from './user.ts'
 
 declare module '@nextcloud/event-bus' {
 	export interface NextcloudEvents {
+		'csrf-token-update': { token: string, _internal?: true }
 		// mapping of 'event name' => 'event type'
 		'user:info:changed': NextcloudUser
 	}

lib/index.ts

@@ -8,5 +8,5 @@ export type { NextcloudUser } from './user.ts'
 
 export { getCSPNonce } from './csp-nonce.ts'
 export { getGuestNickname, getGuestUser, setGuestNickname } from './guest.ts'
-export { getRequestToken, onRequestTokenUpdate } from './requesttoken.ts'
+export { fetchRequestToken, getRequestToken, onRequestTokenUpdate, setRequestToken } from './requesttoken.ts'
 export { getCurrentUser } from './user.ts'

lib/requesttoken.ts

@@ -3,48 +3,113 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import { subscribe } from '@nextcloud/event-bus'
+import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
+import { generateUrl } from '@nextcloud/router'
 
 export interface CsrfTokenObserver {
 	(token: string): void
 }
 
-let token: string | null | undefined
-const observers: CsrfTokenObserver[] = []
+_subscribeToTokenUpdates() // TODO: remove once we drop support for Nextcloud 33 and before
 
 /**
  * Get current request token
  *
  * @return Current request token or null if not set
  */
 export function getRequestToken(): string | null {
-	if (token === undefined) {
-		// Only on first load, try to get token from document
-		token = document.head.dataset.requesttoken ?? null
+	if (globalThis._nc_auth_requestToken) {
+		return globalThis._nc_auth_requestToken
 	}
-	return token
+
+	if (globalThis.document) {
+		// for service workers or other contexts without DOM we need to safeguard this
+		return document.head.dataset.requesttoken ?? null
+	}
+	return null
 }
 
 /**
- * Add an observer which is called when the CSRF token changes
+ * Set a new CSRF token (e.g. because of session refresh).
+ * This also emits an event bus event for the updated token.
  *
- * @param observer The observer
+ * @param token - The new token
+ * @throws {Error} - If the passed token is not a potential valid token
  */
-export function onRequestTokenUpdate(observer: CsrfTokenObserver): void {
-	observers.push(observer)
+export function setRequestToken(token: string): void {
+	if (!token || typeof token !== 'string') {
+		throw new Error('Invalid CSRF token given', { cause: { token } })
+	}
+
+	if (globalThis._nc_auth_requestToken === token) {
+		// token is the same as before, no need to update and especially no need to notify the observers
+		return
+	}
+
+	globalThis._nc_auth_requestToken = token
+	if (globalThis.document) {
+		// For DOM environments we also set the token to the DOM, so it is available for legacy code
+		document.head.dataset.requesttoken = token
+	}
+
+	emit('csrf-token-update', { token, _internal: true })
 }
 
-// Listen to server event and keep token in sync
-subscribe('csrf-token-update', (e: unknown) => {
-	token = (e as { token: string }).token
+/**
+ * Fetch the request token from the API.
+ * This does also set it on the current context, see `setRequestToken`.
+ *
+ * @throws {Error} - If the request failed
+ */
+export async function fetchRequestToken(): Promise<string> {
+	const url = generateUrl('/csrftoken')
+
+	const response = await fetch(url)
+	if (!response.ok) {
+		throw new Error('Could not fetch CSRF token from API', { cause: response })
+	}
+
+	try {
+		const { token } = await response.json()
+		setRequestToken(token)
+		return token
+	} catch (error) {
+		throw new Error('Could not parse CSRF token from API response', { cause: error })
+	}
+}
 
-	observers.forEach((observer) => {
+/**
+ * Add an observer which is called when the CSRF token changes
+ *
+ * @param observer The observer
+ * @return A function to unsubscribe the observer
+ */
+export function onRequestTokenUpdate(observer: CsrfTokenObserver): () => void {
+	const wrapper = async ({ token }: { token: string }) => {
 		try {
-			observer(token!)
+			observer(token)
 		} catch (error) {
 			// we cannot use the logger as the logger uses this library = circular dependency
 			// eslint-disable-next-line no-console
 			console.error('Error updating CSRF token observer', error)
 		}
+	}
+
+	subscribe('csrf-token-update', wrapper)
+	return () => unsubscribe('csrf-token-update', wrapper)
+}
+
+/**
+ * Subscribe to token update events from server.
+ *
+ * @todo - This is legacy and not needed once all supported server versions use `setRequestToken` of this library.
+ */
+function _subscribeToTokenUpdates(): void {
+	// Listen to server event and keep token in sync
+	subscribe('csrf-token-update', ({ token, _internal }) => {
+		if (!_internal) {
+			// Only update the token if the event is not emitted from this library, otherwise we would end in a loop
+			setRequestToken(token)
+		}
 	})
-})
+}