基于wxt.dev开发浏览器扩展：调用Chrome Cookies API返回undefined求助

1. 修复API拼写错误 #

你的代码里写的是chrome.cookie.get，但Chrome Cookies API的正确写法是**chrome.cookies.get**（注意是复数cookies），这是最可能导致返回undefined的原因。

修正后的函数：

function getCookies(domain: string, name: string, callback: (value: string | undefined) => void) {
  chrome.cookies.get({ url: domain, name: name }, function (cookie) {
    if (callback) {
      // 先判断cookie是否存在，避免访问null的value属性
      callback(cookie ? cookie.value : undefined);
    }
  });
}

getCookies("https://www.linkedin.com/", "id", function (id) {
  alert(id);
});

2. 配置正确的权限 #

在WXT项目中，必须在配置文件里声明cookies权限以及目标域名的主机权限，否则API会因为权限不足返回空结果。

修改wxt.config.ts，添加权限配置：

export default defineConfig({
  manifest: {
    permissions: ["cookies"],
    host_permissions: ["https://www.linkedin.com/*"],
  },
});

注意：host_permissions要覆盖你要获取Cookie的域名，这里用https://www.linkedin.com/*来匹配该域名下的所有路径。

3. 验证Cookie是否存在 #

如果上述两步都做了还是没结果，可能是目标域名下根本没有名为id的Cookie。可以用chrome.cookies.getAll来列出该域名下的所有Cookie，确认目标Cookie是否存在：

chrome.cookies.getAll({ url: "https://www.linkedin.com/" }, (cookies) => {
  console.log("所有Cookie:", cookies);
});

打开浏览器开发者工具的控制台，查看输出的Cookie列表，确认有没有你要找的id。

4. 检查Cookie的匹配规则 #

有些Cookie的domain属性是.linkedin.com（带前置点），这种情况下用https://www.linkedin.com/作为url是可以匹配的，但如果Cookie的path属性不是/，你可能需要在chrome.cookies.get的参数里加上path字段，比如：

chrome.cookies.get({ url: "https://www.linkedin.com/", name: "id", path: "/" }, ...);

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