Resolve siteId dynamically via x-site-id header for multisite (#3700)

Resolve siteId dynamically via x-site-id header for multisite

Author: unandyala

packages/pwa-kit-create-app/CHANGELOG.md

@@ -1,5 +1,6 @@
 ## [Unreleased]
 - Add configuration flag `disableHttpOnlySessionCookies` to `ssrParameters` [#3635](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3635)
+- Add `x-site-id` request header to read HttpOnly cookies on the server [#3700](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3700)
 
 ## v3.17.0-dev
 - Clear verdaccio npm cache during project generation [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)

packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/components/_app-config/index.jsx.hbs

@@ -57,7 +57,8 @@ const AppConfig = ({children, locals = {}}) => {
     const {correlationId} = useCorrelationId()
     const headers = {
         'correlation-id': correlationId,
-        sfdc_user_agent: sfdcUserAgent
+        sfdc_user_agent: sfdcUserAgent,
+        'x-site-id': locals.site?.id
     }
 
     const commerceApiConfig = locals.appConfig.commerceAPI

packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/app/components/_app-config/index.jsx.hbs

@@ -57,7 +57,8 @@ const AppConfig = ({children, locals = {}}) => {
     const {correlationId} = useCorrelationId()
     const headers = {
         'correlation-id': correlationId,
-        sfdc_user_agent: sfdcUserAgent
+        sfdc_user_agent: sfdcUserAgent,
+        'x-site-id': locals.site?.id
     }
 
     const commerceApiConfig = locals.appConfig.commerceAPI

packages/pwa-kit-runtime/CHANGELOG.md

@@ -1,6 +1,7 @@
 ## [Unreleased]
 - Add HttpOnly session cookies for SLAS private client proxy [#3680](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3680)
 - Handle logout when HttpOnly session cookies is enabled  [#3699](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3699)
+- Add `x-site-id` request header to read HttpOnly cookies on the server [#3700](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3700)
 
 ## v3.17.0-dev
 - Add Node 24 support. Migrate deprecated Node.js `url.parse()` and `url.format()` to the WHATWG `URL` [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)

packages/pwa-kit-runtime/src/ssr/server/build-remote-server.js

@@ -16,7 +16,7 @@ import {
     X_ENCODED_HEADERS,
     CONTENT_SECURITY_POLICY,
     SLAS_TOKEN_RESPONSE_ENDPOINTS,
-    SLAS_ENDPOINTS_REQUIRING_ACCESS_TOKEN
+    SLAS_LOGOUT_ENDPOINT
 } from './constants'
 import {
     catchAndLog,
@@ -64,7 +64,7 @@ import {ApiGatewayV1Adapter} from '@h4ad/serverless-adapter/lib/adapters/aws'
 import {ExpressFramework} from '@h4ad/serverless-adapter/lib/frameworks/express'
 import {is as typeis} from 'type-is'
 import {getConfig} from '../../utils/ssr-config'
-import {applyHttpOnlySessionCookies} from './process-token-response'
+import {setHttpOnlySessionCookies} from './process-token-response'
 
 /**
  * An Array of mime-types (Content-Type values) that are considered
@@ -94,6 +94,47 @@ export const isBinary = (headers) => {
     return isContentTypeBinary(headers)
 }
 
+/**
+ * Inject Bearer token and refresh token from HttpOnly cookies for the SLAS logout endpoint.
+ * Reads the access token and refresh token from cookies keyed by siteId (from the x-site-id header),
+ * sets the Authorization header, and appends refresh_token to the query string.
+ * @private
+ */
+export const setTokensInLogoutRequest = (proxyRequest, incomingRequest) => {
+    const cookieHeader = incomingRequest.headers.cookie
+    if (!cookieHeader) return
+
+    const cookies = cookie.parse(cookieHeader)
+    const siteId = incomingRequest.headers['x-site-id']
+    if (!siteId) {
+        logger.warn(
+            'x-site-id header is missing on SLAS logout request. ' +
+                'Token injection skipped. ' +
+                'Ensure the x-site-id header is set in CommerceApiProvider headers.',
+            {namespace: 'setTokensInLogoutRequest'}
+        )
+        return
+    }
+
+    // Inject Bearer token from access token cookie
+    const accessToken = cookies[`cc-at_${siteId}`]
+    if (accessToken) {
+        proxyRequest.setHeader('Authorization', `Bearer ${accessToken}`)
+    }
+
+    // Inject refresh_token into query string from HttpOnly cookie
+    const refreshToken = cookies[`cc-nx_${siteId}`]
+    if (refreshToken) {
+        const separator = proxyRequest.path.includes('?') ? '&' : '?'
+        proxyRequest.path += `${separator}refresh_token=${encodeURIComponent(refreshToken)}`
+    } else {
+        logger.warn(
+            `Refresh token cookie (cc-nx_${siteId}) not found for ${incomingRequest.path}. The logout request may fail.`,
+            {namespace: 'setTokensInLogoutRequest'}
+        )
+    }
+}
+
 /**
  * Environment variables that must be set for the Express app to run remotely.
  *
@@ -170,12 +211,6 @@ export const RemoteServerFactory = {
             // cookies applied when that feature is enabled. Users can override this in ssr.js.
             tokenResponseEndpoints: SLAS_TOKEN_RESPONSE_ENDPOINTS,
 
-            // A regex for identifying which SLAS auth endpoints (/shopper/auth/) require the
-            // shopper's access token in the Authorization header (Bearer token from HttpOnly cookie).
-            // Most SLAS auth endpoints use Basic Auth with client credentials, but some like logout
-            // require the shopper's Bearer token. Users can override this in ssr.js.
-            slasEndpointsRequiringAccessToken: SLAS_ENDPOINTS_REQUIRING_ACCESS_TOKEN,
-
             // Custom callback to modify the SLAS private client proxy request. This callback is invoked
             // after the built-in proxy request handling. Users can provide additional
             // request modifications (e.g., custom headers).
@@ -233,16 +268,6 @@ export const RemoteServerFactory = {
         // Note: HttpOnly session cookies are controlled by the MRT_DISABLE_HTTPONLY_SESSION_COOKIES
         // env var (set by MRT in production, pwa-kit-dev locally). Read directly where needed.
 
-        // Extract siteId from app configuration for SCAPI auth
-        // This will be used to read the correct access token cookie
-        try {
-            const config = getConfig({buildDirectory: options.buildDir})
-            options.siteId = config?.app?.commerceAPI?.parameters?.siteId || null
-        } catch (e) {
-            // Config may not be available yet (e.g., during build), that's okay
-            options.siteId = null
-        }
-
         return options
     },
 
@@ -399,8 +424,7 @@ export const RemoteServerFactory = {
      * @private
      */
     _configureProxyConfigs(options) {
-        const siteId = options.siteId || null
-        configureProxyConfigs(options.appHostname, options.protocol, siteId)
+        configureProxyConfigs(options.appHostname, options.protocol)
     },
 
     /**
@@ -979,39 +1003,9 @@ export const RemoteServerFactory = {
                         proxyRequest.setHeader('Authorization', `Basic ${encodedSlasCredentials}`)
                     } else if (
                         process.env.MRT_DISABLE_HTTPONLY_SESSION_COOKIES === 'false' &&
-                        incomingRequest.path?.match(options.slasEndpointsRequiringAccessToken)
+                        incomingRequest.path?.match(SLAS_LOGOUT_ENDPOINT)
                     ) {
-                        // Inject tokens from HttpOnly cookies for endpoints like /oauth2/logout
-                        const cookieHeader = incomingRequest.headers.cookie
-                        if (cookieHeader) {
-                            const cookies = cookie.parse(cookieHeader)
-                            const siteId = options.mobify?.app?.commerceAPI?.parameters?.siteId
-                            if (siteId) {
-                                const site = siteId.trim()
-
-                                // Inject Bearer token from access token cookie
-                                const accessToken = cookies[`cc-at_${site}`]
-                                if (accessToken) {
-                                    proxyRequest.setHeader('Authorization', `Bearer ${accessToken}`)
-                                }
-
-                                // Inject refresh_token into query string from HttpOnly cookie
-                                // refresh_token ishouls required for /oauth2/logout
-                                const refreshToken = cookies[`cc-nx_${site}`]
-                                if (refreshToken) {
-                                    const url = new URL(proxyRequest.path, 'http://localhost')
-                                    url.searchParams.set('refresh_token', refreshToken)
-                                    proxyRequest.path = url.pathname + url.search
-                                } else {
-                                    logger.warn(
-                                        `Registered refresh token cookie (cc-nx_${site}) not found for ${incomingRequest.path}. The logout request may fail.`,
-                                        {
-                                            namespace: '_setupSlasPrivateClientProxy'
-                                        }
-                                    )
-                                }
-                            }
-                        }
+                        setTokensInLogoutRequest(proxyRequest, incomingRequest)
                     }
 
                     // Allow users to apply additional custom modifications to the proxy request
@@ -1043,7 +1037,7 @@ export const RemoteServerFactory = {
                             isTokenEndpoint
                         ) {
                             try {
-                                workingBuffer = applyHttpOnlySessionCookies(
+                                workingBuffer = setHttpOnlySessionCookies(
                                     workingBuffer,
                                     proxyRes,
                                     req,
@@ -1499,10 +1493,7 @@ export const RemoteServerFactory = {
      * @param {RegExp} [options.tokenResponseEndpoints] - A regex pattern to match SLAS endpoints
      * that return tokens in the response body. Used to determine which responses should have HttpOnly
      * session cookies applied. Defaults to /\/oauth2\/(token|passwordless\/token)$/.
-     * @param {RegExp} [options.slasEndpointsRequiringAccessToken] - A regex pattern to match SLAS auth
-     * endpoints (/shopper/auth/) that require the shopper's access token in the Authorization header (Bearer token).
-     * Most SLAS auth endpoints use Basic Auth with client credentials, but some like logout require the shopper's
-     * Bearer token. Defaults to /\/oauth2\/logout/.
+
      * @param {function} [options.onSLASPrivateProxyReq] - Custom callback to modify SLAS private client
      * proxy requests. Called after built-in request handling. Signature: (proxyRequest, incomingRequest, res) => void.
      * Use this to add custom headers or modify the proxy request.

packages/pwa-kit-runtime/src/ssr/server/build-remote-server.test.js

@@ -527,6 +527,7 @@ describe('HttpOnly session cookies', () => {
                     'Cookie',
                     'cc-at_testsite=mock-access-token; cc-nx_testsite=mock-refresh-token'
                 )
+                .set('x-site-id', 'testsite')
 
             expect(response.status).toBe(200)
             expect(response.body.success).toBe(true)
@@ -538,6 +539,62 @@ describe('HttpOnly session cookies', () => {
         }
     })
 
+    test('x-site-id header takes precedence over static config siteId for logout endpoint', async () => {
+        process.env.MRT_DISABLE_HTTPONLY_SESSION_COOKIES = 'false'
+
+        let capturedAuthHeader
+        let capturedRefreshToken
+        const mockSlasServer = mockExpress()
+        mockSlasServer.post('/shopper/auth/v1/oauth2/logout', (req, res) => {
+            capturedAuthHeader = req.headers.authorization
+            capturedRefreshToken = req.query.refresh_token
+            res.status(200).json({success: true})
+        })
+
+        const mockSlasServerInstance = mockSlasServer.listen(0)
+        const mockSlasPort = mockSlasServerInstance.address().port
+
+        try {
+            const app = mockExpress()
+            // Static config has siteId 'default-site', but x-site-id header will be 'othersite'
+            const options = RemoteServerFactory._configure({
+                useSLASPrivateClient: true,
+                slasTarget: `http://localhost:${mockSlasPort}`,
+                mobify: {
+                    app: {
+                        commerceAPI: {
+                            parameters: {
+                                shortCode: 'test',
+                                organizationId: 'f_ecom_test',
+                                clientId: 'test-client-id',
+                                siteId: 'default-site'
+                            }
+                        }
+                    }
+                }
+            })
+
+            process.env.PWA_KIT_SLAS_CLIENT_SECRET = 'test-secret'
+
+            RemoteServerFactory._setupSlasPrivateClientProxy(app, options)
+
+            // Cookies are keyed to 'othersite', and x-site-id header says 'othersite'
+            const response = await request(app)
+                .post('/mobify/slas/private/shopper/auth/v1/oauth2/logout')
+                .set(
+                    'Cookie',
+                    'cc-at_othersite=other-access-token; cc-nx_othersite=other-refresh-token'
+                )
+                .set('x-site-id', 'othersite')
+
+            expect(response.status).toBe(200)
+            expect(capturedAuthHeader).toBe('Bearer other-access-token')
+            expect(capturedRefreshToken).toBe('other-refresh-token')
+        } finally {
+            mockSlasServerInstance.close()
+        }
+    })
+
     test('sets HttpOnly cookies and strips tokens from response body', async () => {
         process.env.MRT_DISABLE_HTTPONLY_SESSION_COOKIES = 'false'
 
@@ -580,9 +637,9 @@ describe('HttpOnly session cookies', () => {
 
             RemoteServerFactory._setupSlasPrivateClientProxy(app, options)
 
-            const response = await request(app).post(
-                '/mobify/slas/private/shopper/auth/v1/oauth2/token'
-            )
+            const response = await request(app)
+                .post('/mobify/slas/private/shopper/auth/v1/oauth2/token')
+                .set('x-site-id', 'testsite')
 
             expect(response.status).toBe(200)
             expect(response.body).not.toHaveProperty('access_token')
@@ -636,9 +693,9 @@ describe('HttpOnly session cookies', () => {
 
             RemoteServerFactory._setupSlasPrivateClientProxy(app, options)
 
-            const response = await request(app).post(
-                '/mobify/slas/private/shopper/auth/v1/oauth2/token'
-            )
+            const response = await request(app)
+                .post('/mobify/slas/private/shopper/auth/v1/oauth2/token')
+                .set('x-site-id', 'testsite')
 
             expect(response.status).toBe(500)
             expect(response.body.error).toBe('Internal server error')
@@ -690,9 +747,9 @@ describe('HttpOnly session cookies', () => {
 
             RemoteServerFactory._setupSlasPrivateClientProxy(app, options)
 
-            const response = await request(app).post(
-                '/mobify/slas/private/shopper/auth/v1/oauth2/passwordless/token'
-            )
+            const response = await request(app)
+                .post('/mobify/slas/private/shopper/auth/v1/oauth2/passwordless/token')
+                .set('x-site-id', 'testsite')
 
             expect(response.status).toBe(200)
             expect(response.body).not.toHaveProperty('access_token')

packages/pwa-kit-runtime/src/ssr/server/constants.js

@@ -31,6 +31,7 @@ export const SLAS_CUSTOM_PROXY_PATH = '/mobify/slas/private'
 // Users can override these in their project's ssr.js options.
 export const SLAS_TOKEN_RESPONSE_ENDPOINTS = /\/oauth2\/(token|passwordless\/token)$/
 
-// Default regex patterns for SLAS endpoints that need access token in authorization header, used when httpOnly session cookies are enabled
-// Users can override these in their project's ssr.js options.
-export const SLAS_ENDPOINTS_REQUIRING_ACCESS_TOKEN = /\/oauth2\/logout/
+// Default regex pattern for the SLAS logout endpoint, used when httpOnly session cookies are enabled
+// to inject Bearer token and refresh token from HttpOnly cookies.
+// Users can override this in their project's ssr.js options.
+export const SLAS_LOGOUT_ENDPOINT = /\/oauth2\/logout/

packages/pwa-kit-runtime/src/ssr/server/process-token-response.js

@@ -67,12 +67,12 @@ function getTokenClaims(accessToken) {
  * strip token fields from body, and append our Set-Cookie headers (preserving upstream cookies).
  * @private
  */
-export function applyHttpOnlySessionCookies(responseBuffer, proxyRes, req, res, options) {
-    const siteId = options.mobify?.app?.commerceAPI?.parameters?.siteId
-    if (!siteId || typeof siteId !== 'string' || siteId.trim() === '') {
+export function setHttpOnlySessionCookies(responseBuffer, proxyRes, req, res, options) {
+    const siteId = req.headers?.['x-site-id']
+    if (!siteId) {
         throw new Error(
             'HttpOnly session cookies are enabled but siteId is missing. ' +
-                'Set mobify.app.commerceAPI.parameters.siteId in your app config.'
+                'Ensure the x-site-id header is set on the request.'
         )
     }
 
@@ -83,7 +83,7 @@ export function applyHttpOnlySessionCookies(responseBuffer, proxyRes, req, res,
         return responseBuffer
     }
 
-    const site = siteId.trim()
+    const site = siteId
 
     // Decode JWT and extract claims
     let isGuest = true