diff --git a/packages/csr/src/reactive-runtime.ts b/packages/csr/src/reactive-runtime.ts index 0478bdb5..12e7a62a 100644 --- a/packages/csr/src/reactive-runtime.ts +++ b/packages/csr/src/reactive-runtime.ts @@ -4138,13 +4138,14 @@ export const REACTIVE_RUNTIME = String.raw` } function callServerFunction(component, functionName, args) { - var csrf = document.querySelector('meta[name="wrnexus-csrf"]'); + var csrfMatch = /(?:^|;\s*)wire-csrf=([^;]+)/.exec(document.cookie || ""); + var csrf = csrfMatch ? decodeURIComponent(csrfMatch[1]) : ""; return fetch("/__wrnexus/rpc", { method: "POST", credentials: "same-origin", headers: { "content-type": "application/json", - "x-csrf-token": csrf ? csrf.getAttribute("content") || "" : "", + "x-csrf-token": csrf, }, body: JSON.stringify({ component: component, function: functionName, args: args || [] }), }).then(function (response) { diff --git a/packages/csr/test/reactive.test.ts b/packages/csr/test/reactive.test.ts index 8c233bc9..e0fe8683 100644 --- a/packages/csr/test/reactive.test.ts +++ b/packages/csr/test/reactive.test.ts @@ -801,6 +801,33 @@ test("an unbound native-named output does not re-enter its DOM handler", () => { expect(outputs).toBe(1); }); +test("component server calls send the CSRF cookie in the RPC header", async () => { + const win = mount( + `