refactor: move handlers to separate files

Author: Varixo

packages/qwik-router/src/buildtime/build-layout.unit.ts

@@ -4,7 +4,7 @@ const test = testAppSuite('Build Layout');
 
 test('total layouts', ({ ctx: { layouts } }) => {
   // $ find starters/apps/qwikrouter-test/src/routes -name layout*tsx | wc -l
-  assert.equal(layouts.length, 13, JSON.stringify(layouts, null, 2));
+  assert.equal(layouts.length, 14, JSON.stringify(layouts, null, 2));
 });
 
 test('nested named layout', ({ assertLayout }) => {

packages/qwik-router/src/middleware/request-handler/action-endpoints.ts renamed to packages/qwik-router/src/middleware/request-handler/handlers/action-handler.ts

@@ -3,18 +3,12 @@ import type {
   JSONObject,
   RequestEvent,
   RequestHandler,
-} from '../../runtime/src/types';
-import { runValidators } from './loader-endpoints';
-import {
-  getRequestActions,
-  getRequestMode,
-  RequestEvQwikSerializer,
-  type RequestEventInternal,
-} from './request-event';
-import { measure, verifySerializable } from './resolve-request-handlers';
-import type { QwikSerializer } from './types';
-import { IsQAction, QActionId } from './user-response';
-import { _UNINITIALIZED, type ValueOrPromise } from '@qwik.dev/core/internal';
+} from '../../../runtime/src/types';
+import { runValidators } from './loader-handler';
+import { getRequestActions, getRequestMode, type RequestEventInternal } from '../request-event';
+import { measure, verifySerializable } from '../resolve-request-handlers';
+import { IsQAction, QActionId } from '../user-response';
+import { _serialize, _UNINITIALIZED, type ValueOrPromise } from '@qwik.dev/core/internal';
 
 export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
   return async (requestEvent: RequestEvent) => {
@@ -33,7 +27,6 @@ export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
     // Execute just this action
     const actions = getRequestActions(requestEv);
     const isDev = getRequestMode(requestEv) === 'dev';
-    const qwikSerializer = requestEv[RequestEvQwikSerializer];
     const method = requestEv.method;
 
     if (isDev && method === 'GET') {
@@ -62,11 +55,11 @@ export function actionHandler(routeActions: ActionInternal[]): RequestHandler {
         return;
       }
 
-      await executeAction(action, actions, requestEv, isDev, qwikSerializer);
+      await executeAction(action, actions, requestEv, isDev);
 
       if (requestEv.request.headers.get('accept')?.includes('application/json')) {
         // only return the action data if the client accepts json, otherwise return the html page
-        const data = await qwikSerializer._serialize([actions[actionId]]);
+        const data = await _serialize([actions[actionId]]);
         requestEv.headers.set('Content-Type', 'application/json; charset=utf-8');
         requestEv.send(200, data);
         return;
@@ -79,8 +72,7 @@ async function executeAction(
   action: ActionInternal,
   actions: Record<string, ValueOrPromise<unknown> | undefined>,
   requestEv: RequestEventInternal,
-  isDev: boolean,
-  qwikSerializer: QwikSerializer
+  isDev: boolean
 ) {
   const selectedActionId = action.__id;
   requestEv.sharedMap.set(QActionId, selectedActionId);
@@ -98,7 +90,7 @@ async function executeAction(
         )
       : await action.__qrl.call(requestEv, result.data as JSONObject, requestEv);
     if (isDev) {
-      verifySerializable(qwikSerializer, actionResolved, action.__qrl);
+      verifySerializable(actionResolved, action.__qrl);
     }
     actions[selectedActionId] = actionResolved;
   }

packages/qwik-router/src/middleware/request-handler/handlers/csrf-handler.ts

@@ -0,0 +1,42 @@
+import type { RequestEvent } from '@qwik.dev/router/middleware/request-handler';
+
+export function isContentType(headers: Headers, ...types: string[]) {
+  const type = headers.get('content-type')?.split(/;/, 1)[0].trim() ?? '';
+  return types.includes(type);
+}
+
+export function csrfLaxProtoCheckMiddleware(requestEv: RequestEvent) {
+  checkCSRF(requestEv, true);
+}
+export function csrfCheckMiddleware(requestEv: RequestEvent) {
+  checkCSRF(requestEv);
+}
+function checkCSRF(requestEv: RequestEvent, laxProto?: true) {
+  const isForm = isContentType(
+    requestEv.request.headers,
+    'application/x-www-form-urlencoded',
+    'multipart/form-data',
+    'text/plain'
+  );
+  if (isForm) {
+    const inputOrigin = requestEv.request.headers.get('origin');
+    const origin = requestEv.url.origin;
+    let forbidden = inputOrigin !== origin;
+
+    if (
+      forbidden &&
+      laxProto &&
+      inputOrigin?.replace(/^http(s)?/g, '') === origin.replace(/^http(s)?/g, '')
+    ) {
+      forbidden = false;
+    }
+
+    if (forbidden) {
+      throw requestEv.error(
+        403,
+        `CSRF check failed. Cross-site ${requestEv.method} form submissions are forbidden.
+The request origin "${inputOrigin}" does not match the server origin "${origin}".`
+      );
+    }
+  }
+}

packages/qwik-router/src/middleware/request-handler/handlers/csrf-handler.unit.ts

@@ -0,0 +1,47 @@
+import { describe, expect, it, vi } from 'vitest';
+import { csrfCheckMiddleware, isContentType } from './csrf-handler';
+import { RequestEvent } from '@qwik.dev/router/middleware/request-handler';
+
+describe('csrf handler', () => {
+  it.each([
+    {
+      contentType: 'application/x-www-form-urlencoded',
+    },
+    {
+      contentType: 'multipart/form-data',
+    },
+    {
+      contentType: 'text/plain',
+    },
+  ])('should throw an error if the origin does not match for $contentType', ({ contentType }) => {
+    const errorFn = vi.fn();
+    const requestEv = {
+      request: {
+        headers: new Headers({
+          'content-type': contentType,
+          origin: 'http://example.com',
+        }),
+      },
+      url: new URL('http://bad-example.com'),
+      error: errorFn,
+    } as unknown as RequestEvent;
+
+    try {
+      csrfCheckMiddleware(requestEv);
+    } catch (_) {
+      // ignore the error here, we just want to check the errorFn
+    }
+
+    expect(errorFn).toBeCalledWith(403, expect.stringMatching('CSRF check failed'));
+  });
+
+  describe('isContentType', () => {
+    it('should correctly identify form/data', () => {
+      const headers = new Headers({
+        'content-type':
+          'multipart/form-data; boundary=---------------------------5509475224001460121912752931',
+      });
+      expect(isContentType(headers, 'multipart/form-data')).toBe(true);
+    });
+  });
+});

packages/qwik-router/src/middleware/request-handler/loader-endpoints.ts renamed to packages/qwik-router/src/middleware/request-handler/handlers/loader-handler.ts

@@ -1,21 +1,39 @@
+import qwikRouterConfig from '@qwik-router-config';
 import { _serialize, _UNINITIALIZED } from '@qwik.dev/core/internal';
 import type {
   DataValidator,
   LoaderInternal,
   RequestHandler,
   ValidatorReturn,
-} from '../../runtime/src/types';
+} from '../../../runtime/src/types';
+import { getPathnameForDynamicRoute } from '../../../utils/pathname';
 import {
   getRequestLoaders,
   getRequestLoaderSerializationStrategyMap,
   getRequestMode,
   RequestEventInternal,
-} from './request-event';
-import { measure, verifySerializable } from './resolve-request-handlers';
-import type { RequestEvent } from './types';
-import { IsQLoader, IsQLoaderData, QLoaderId } from './user-response';
-import qwikRouterConfig from '@qwik-router-config';
-import { getPathnameForDynamicRoute } from '../../utils/pathname';
+} from '../request-event';
+import { measure, verifySerializable } from '../resolve-request-handlers';
+import type { RequestEvent } from '../types';
+import { IsQLoader, IsQLoaderData, QLoaderId } from '../user-response';
+
+export function loadersMiddleware(routeLoaders: LoaderInternal[]): RequestHandler {
+  return async (requestEvent: RequestEvent) => {
+    const requestEv = requestEvent as RequestEventInternal;
+    if (requestEv.headersSent) {
+      requestEv.exit();
+      return;
+    }
+    const loaders = getRequestLoaders(requestEv);
+    const isDev = getRequestMode(requestEv) === 'dev';
+    if (routeLoaders.length > 0) {
+      const resolvedLoadersPromises = routeLoaders.map((loader) =>
+        executeLoader(loader, loaders, requestEv, isDev)
+      );
+      await Promise.all(resolvedLoadersPromises);
+    }
+  };
+}
 
 export function loaderDataHandler(routeLoaders: LoaderInternal[]): RequestHandler {
   return async (requestEvent: RequestEvent) => {

packages/qwik-router/src/middleware/request-handler/handlers/path-handler.ts

@@ -0,0 +1,28 @@
+import { RequestEvent } from '../types';
+import { isQDataRequestBasedOnSharedMap } from '../resolve-request-handlers';
+import { HttpStatus } from '../http-status-codes';
+
+export function fixTrailingSlash(ev: RequestEvent) {
+  const { basePathname, originalUrl, sharedMap } = ev;
+  const { pathname, search } = originalUrl;
+  const isQData = isQDataRequestBasedOnSharedMap(sharedMap);
+  if (!isQData && pathname !== basePathname && !pathname.endsWith('.html')) {
+    // only check for slash redirect on pages
+    if (!globalThis.__NO_TRAILING_SLASH__) {
+      // must have a trailing slash
+      if (!pathname.endsWith('/')) {
+        // add slash to existing pathname
+        throw ev.redirect(HttpStatus.MovedPermanently, pathname + '/' + search);
+      }
+    } else {
+      // should not have a trailing slash
+      if (pathname.endsWith('/')) {
+        // remove slash from existing pathname
+        throw ev.redirect(
+          HttpStatus.MovedPermanently,
+          pathname.slice(0, pathname.length - 1) + search
+        );
+      }
+    }
+  }
+}

packages/qwik-router/src/middleware/request-handler/qdata-endpoints.ts renamed to packages/qwik-router/src/middleware/request-handler/handlers/qdata-handler.ts

@@ -1,10 +1,8 @@
-// requestEv.sharedMap.get(RequestEvSharedActionId)
-
+import { _serialize } from '@qwik.dev/core/internal';
 import type { RequestEvent } from '@qwik.dev/router';
-import { _serialize } from 'packages/qwik/core-internal';
-import { RequestEvIsRewrite } from './request-event';
-import { getPathname } from './resolve-request-handlers';
-import { IsQData } from './user-response';
+import { RequestEvIsRewrite } from '../request-event';
+import { getPathname } from '../resolve-request-handlers';
+import { IsQData } from '../user-response';
 
 export interface QData {
   status: number;

packages/qwik-router/src/middleware/request-handler/handlers/redirect-handler.ts

@@ -0,0 +1,53 @@
+import { RedirectMessage, RequestEvent } from '@qwik.dev/router/middleware/request-handler';
+import { OriginalQDataName } from '../user-response';
+import { isQDataRequestBasedOnSharedMap } from '../resolve-request-handlers';
+
+export async function handleRedirect(requestEv: RequestEvent) {
+  const isPageDataReq = isQDataRequestBasedOnSharedMap(requestEv.sharedMap);
+  if (!isPageDataReq) {
+    return;
+  }
+
+  try {
+    await requestEv.next();
+  } catch (err) {
+    if (!(err instanceof RedirectMessage)) {
+      throw err;
+    }
+  }
+  if (requestEv.headersSent) {
+    return;
+  }
+
+  const status = requestEv.status();
+  const location = requestEv.headers.get('Location');
+  const isRedirect = status >= 301 && status <= 308 && location;
+
+  if (isRedirect) {
+    const adaptedLocation = makeQDataPath(location, requestEv.sharedMap);
+    if (adaptedLocation) {
+      requestEv.headers.set('Location', adaptedLocation);
+      requestEv.getWritableStream().close();
+      return;
+    } else {
+      requestEv.status(200);
+      requestEv.headers.delete('Location');
+    }
+  }
+}
+
+function makeQDataPath(href: string, sharedMap: Map<string, unknown>) {
+  if (href.startsWith('/')) {
+    const url = new URL(href, 'http://localhost');
+    const pathname = url.pathname.endsWith('/') ? url.pathname.slice(0, -1) : url.pathname;
+    const append = sharedMap.get(OriginalQDataName) as string;
+
+    if (!append) {
+      return undefined;
+    }
+
+    return pathname + (append.startsWith('/') ? '' : '/') + append + url.search;
+  } else {
+    return undefined;
+  }
+}

packages/qwik-router/src/middleware/request-handler/handlers/server-function-handler.ts

@@ -0,0 +1,71 @@
+import { RequestEvent, ServerError } from '@qwik.dev/router/middleware/request-handler';
+import { QFN_KEY } from '../../../runtime/src/constants';
+import { getRequestMode } from '../request-event';
+import type { ErrorCodes } from '../types';
+import { encoder, measure, verifySerializable } from '../resolve-request-handlers';
+import type { QRL } from '@qwik.dev/core';
+import { _serialize } from '@qwik.dev/core/internal';
+
+function isAsyncIterator(obj: unknown): obj is AsyncIterable<unknown> {
+  return obj ? typeof obj === 'object' && Symbol.asyncIterator in obj : false;
+}
+
+const isQrl = (value: any): value is QRL => {
+  return typeof value === 'function' && typeof value.getSymbol === 'function';
+};
+
+export async function pureServerFunction(ev: RequestEvent) {
+  const fn = ev.query.get(QFN_KEY);
+  if (
+    fn &&
+    ev.request.headers.get('X-QRL') === fn &&
+    ev.request.headers.get('Content-Type') === 'application/qwik-json'
+  ) {
+    ev.exit();
+    const isDev = getRequestMode(ev) === 'dev';
+    const data = await ev.parseBody();
+    if (Array.isArray(data)) {
+      const [qrl, ...args] = data;
+      if (isQrl(qrl) && qrl.getHash() === fn) {
+        let result: unknown;
+        try {
+          if (isDev) {
+            result = await measure(ev, `server_${qrl.getSymbol()}`, () =>
+              (qrl as Function).apply(ev, args)
+            );
+          } else {
+            result = await (qrl as Function).apply(ev, args);
+          }
+        } catch (err) {
+          if (err instanceof ServerError) {
+            throw ev.error(err.status as ErrorCodes, err.data);
+          }
+          throw ev.error(500, 'Invalid request');
+        }
+        if (isAsyncIterator(result)) {
+          ev.headers.set('Content-Type', 'text/qwik-json-stream');
+          const writable = ev.getWritableStream();
+          const stream = writable.getWriter();
+          for await (const item of result) {
+            if (isDev) {
+              verifySerializable(item, qrl);
+            }
+            const message = await _serialize([item]);
+            if (ev.signal.aborted) {
+              break;
+            }
+            await stream.write(encoder.encode(`${message}\n`));
+          }
+          stream.close();
+        } else {
+          verifySerializable(result, qrl);
+          ev.headers.set('Content-Type', 'application/qwik-json');
+          const message = await _serialize([result]);
+          ev.send(200, message);
+        }
+        return;
+      }
+    }
+    throw ev.error(500, 'Invalid request');
+  }
+}

packages/qwik-router/src/middleware/request-handler/request-event.ts

@@ -19,7 +19,7 @@ import {
   RewriteMessage,
   ServerError,
 } from '@qwik.dev/router/middleware/request-handler';
-import { executeLoader } from './loader-endpoints';
+import { executeLoader } from './handlers/loader-handler';
 import { encoder } from './resolve-request-handlers';
 import type {
   CacheControl,