From 0d5c416cba313287bbcb3745ae74701aa42dfc78 Mon Sep 17 00:00:00 2001
From: chenhang <averych@126.com>
Date: Wed, 17 Jun 2026 11:14:13 +0800
Subject: [PATCH] fix(images): allowlist Facebook avatar hosts in next/image
 remotePatterns
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Facebook OAuth login returns avatar URLs from
platform-lookaside.fbsbx.com (and occasionally graph.facebook.com).
next/image's optimizer rejects these with 400 Bad Request when they
are not in the allowlist, so chat/sidebar/subscription avatar
<Image> components all fail to render.

Add images.remotePatterns entries for both hosts. Three <Image>
consumers (message-avatar, user-header, subscription-user-row) need
no changes — they all pass the avatarUrl through verbatim and will
work once the optimizer accepts the host.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 next.config.ts | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/next.config.ts b/next.config.ts
index 50a0f3d8..cf915a5f 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -26,6 +26,22 @@ const nextConfig: NextConfig = {
     // 关闭静态优化以规避 16.2.7 global-error prerender bug
     staticGenerationRetryCount: 0,
   },
+  images: {
+    // Facebook OAuth 登录后，`picture.type(large)` 返回
+    //   platform-lookaside.fbsbx.com/platform/profilepic/?asid=...&hash=...
+    // 该 URL 是**下载链接**而非可缓存图片，next/image 优化器需要显式 allowlist。
+    // graph.facebook.com 兜底：Graph 偶尔返回直链头像 / OG 图。
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "platform-lookaside.fbsbx.com",
+      },
+      {
+        protocol: "https",
+        hostname: "graph.facebook.com",
+      },
+    ],
+  },
 };
 
 export default withSerwist(nextConfig);
\ No newline at end of file