fix: clickjacking (#18516)

Signed-off-by: -LAN- <laipz8200@outlook.com>
Co-authored-by: -LAN- <laipz8200@outlook.com>

web/middleware.ts

@@ -3,10 +3,26 @@ import { NextResponse } from 'next/server'
 
 const NECESSARY_DOMAIN = '*.sentry.io http://localhost:* http://127.0.0.1:* https://analytics.google.com googletagmanager.com *.googletagmanager.com https://www.google-analytics.com https://api.github.com'
 
+const wrapResponseWithXFrameOptions = (response: NextResponse, pathname: string) => {
+  // prevent clickjacking: https://owasp.org/www-community/attacks/Clickjacking
+  // Chatbot page should be allowed to be embedded in iframe. It's a feature
+  if (process.env.NEXT_PUBLIC_ALLOW_EMBED !== 'true' && !pathname.startsWith('/chat'))
+    response.headers.set('X-Frame-Options', 'DENY')
+
+  return response
+}
 export function middleware(request: NextRequest) {
+  const { pathname } = request.nextUrl
+  const requestHeaders = new Headers(request.headers)
+  const response = NextResponse.next({
+    request: {
+      headers: requestHeaders,
+    },
+  })
+
   const isWhiteListEnabled = !!process.env.NEXT_PUBLIC_CSP_WHITELIST && process.env.NODE_ENV === 'production'
   if (!isWhiteListEnabled)
-    return NextResponse.next()
+    return wrapResponseWithXFrameOptions(response, pathname)
 
   const whiteList = `${process.env.NEXT_PUBLIC_CSP_WHITELIST} ${NECESSARY_DOMAIN}`
   const nonce = Buffer.from(crypto.randomUUID()).toString('base64')
@@ -33,7 +49,6 @@ export function middleware(request: NextRequest) {
     .replace(/\s{2,}/g, ' ')
     .trim()
 
-  const requestHeaders = new Headers(request.headers)
   requestHeaders.set('x-nonce', nonce)
 
   requestHeaders.set(
@@ -41,17 +56,12 @@ export function middleware(request: NextRequest) {
     contentSecurityPolicyHeaderValue,
   )
 
-  const response = NextResponse.next({
-    request: {
-      headers: requestHeaders,
-    },
-  })
   response.headers.set(
     'Content-Security-Policy',
     contentSecurityPolicyHeaderValue,
   )
 
-  return response
+  return wrapResponseWithXFrameOptions(response, pathname)
 }
 
 export const config = {