Merge pull request #6607 from Shopify/cors-theme-dev-update

prevent possible CORS vulnerability

Author: EvilGenius13

.changeset/frank-lands-hunt.md

@@ -0,0 +1,5 @@
+---
+'@shopify/theme': patch
+---
+
+Fix a possible CORS vulnerability where a website could read data from the localhost server

packages/theme/src/cli/utilities/theme-environment/proxy.ts

@@ -228,6 +228,15 @@ function patchProxiedResponseHeaders(ctx: DevServerContext, rawResponse: Respons
     response.headers.delete(header)
   }
 
+  // Remove CORS headers from the proxied response. Our CORS middleware
+  // will set the correct headers based on the allowed origins.
+  response.headers.delete('access-control-allow-origin')
+  response.headers.delete('access-control-allow-credentials')
+  response.headers.delete('access-control-allow-methods')
+  response.headers.delete('access-control-allow-headers')
+  response.headers.delete('access-control-expose-headers')
+  response.headers.delete('access-control-max-age')
+
   // Link header preloads resources from global CDN, proxy it:
   const linkHeader = response.headers.get('Link')
   if (linkHeader) response.headers.set('Link', injectCdnProxy(linkHeader, ctx))

packages/theme/src/cli/utilities/theme-environment/theme-environment.ts

@@ -98,16 +98,24 @@ interface DevelopmentServerInstance {
 
 function createDevelopmentServer(theme: Theme, ctx: DevServerContext, initialWork: Promise<void>) {
   const app = createApp()
+  const allowedOrigins = [`http://${ctx.options.host}:${ctx.options.port}`, `https://${ctx.session.storeFqdn}`]
 
   app.use(
     defineLazyEventHandler(async () => {
       await initialWork
       return defineEventHandler((event) => {
-        handleCors(event, {
-          origin: '*',
-          methods: '*',
-          preflight: {statusCode: 204},
-        })
+        const origin = event.node.req.headers.origin
+
+        // We only set CORS headers if an Origin header is present in the request.
+        // This prevents wildcard CORS on direct navigation.
+        if (origin) {
+          handleCors(event, {
+            origin: (requestOrigin) => allowedOrigins.includes(requestOrigin),
+            credentials: true,
+            methods: ['GET', 'POST', 'HEAD', 'OPTIONS'],
+            preflight: {statusCode: 204},
+          })
+        }
       })
     }),
   )