Chrome扩展弹窗在隐身模式下的Fetch登录状态检测问题

核心错误点 #

1. Cookie存储隔离问题：你配置的"incognito": "spanning"模式下，普通窗口和隐身窗口的Cookie存储是完全独立的。调用chrome.cookies.getAll时未指定storeId，默认会获取普通窗口的Cookie，隐身窗口内的弹窗自然拿不到当前隐身窗口的登录Cookie。
2. 跨域Cookie设置无效：弹窗属于扩展内部页面（域为chrome-extension://[你的扩展ID]），和example.com不属于同一域，直接设置document.cookie或调用chrome.cookies.set都无法让后续的fetch请求带上目标网站的Cookie——Cookie的域限制会阻止这种跨域传递。

推荐解决方案 #

方案一：通过内容脚本发起请求（最可靠）

内容脚本运行在目标网站的上下文环境中，会自动携带当前窗口的Cookie，无需手动处理Cookie传递：

1. 更新manifest.json配置：
   添加内容脚本权限和网站访问权限：

   "content_scripts": [
     {
       "matches": ["https://www.example.com/*"],
       "js": ["content.js"]
     }
   ],
   "permissions": ["tabs", "https://www.example.com/*"]
   

2. 编写content.js：
   监听来自弹窗的消息，执行登录状态检测并返回结果：

   chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
     if (request.action === "checkLogin") {
       fetch("https://www.example.com/account/", { credentials: "include" })
         .then(res => {
           sendResponse({
             isLoggedIn: res.url === "https://www.example.com/account/data"
           });
         })
         .catch(err => sendResponse({ error: err.message }));
       return true; // 标记异步响应
     }
   });
   

3. 弹窗代码修改：
   向当前活跃标签页的内容脚本发送检测请求：

   chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
     const currentTab = tabs[0];
     if (!currentTab.url.includes("example.com")) {
       console.log("当前标签页不在example.com域名下，无法检测");
       return;
     }
   
     chrome.tabs.sendMessage(currentTab.id, { action: "checkLogin" }, res => {
       if (res.error) {
         console.error("检测失败:", res.error);
         return;
       }
       console.log(res.isLoggedIn ? "已登录" : "未登录");
     });
   });
   

方案二：通过后台脚本指定Cookie存储发起请求

如果当前标签页不在example.com上，可以用后台脚本获取对应窗口的Cookie存储ID，手动携带Cookie发起请求：

1. 后台脚本background.js：

   chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
     if (request.action === "checkLogin") {
       // 获取当前窗口对应的Cookie存储
       chrome.windows.get(sender.tab.windowId, () => {
         chrome.cookies.getAllCookieStores(stores => {
           const targetStore = stores.find(store => 
             store.tabIds.includes(sender.tab.id)
           );
           if (!targetStore) {
             sendResponse({ isLoggedIn: false });
             return;
           }
   
           // 获取该存储下的example.com Cookie
           chrome.cookies.getAll({ 
             domain: "example.com", 
             storeId: targetStore.id 
           }, cookies => {
             const cookieStr = cookies.map(c => `${c.name}=${c.value}`).join("; ");
             fetch("https://www.example.com/account/", {
               headers: { Cookie: cookieStr },
               redirect: "follow"
             })
             .then(res => {
               sendResponse({
                 isLoggedIn: res.url === "https://www.example.com/account/data"
               });
             })
             .catch(err => sendResponse({ error: err.message }));
           });
         });
       });
       return true;
     }
   });
   

2. 弹窗调用后台脚本：

   chrome.runtime.sendMessage({ action: "checkLogin" }, res => {
     if (res.error) {
       console.error("检测失败:", res.error);
       return;
     }
     console.log(res.isLoggedIn ? "已登录" : "未登录");
   });
   

内容的提问来源于stack exchange，提问作者user7607751