自定义Safari扩展集成Google OAuth遇阻，求文档及解决方案

一、相关文档参考 #

• Safari扩展没有Chrome那样的Google专属OAuth文档，但可以结合两类官方资源：
  • Apple官方的Safari扩展开发文档，重点查看Safari App Extension身份验证指南，里面有第三方OAuth的通用实现规范
  • Google OAuth 2.0官方文档中的浏览器应用部分，结合Safari扩展的上下文调整适配

二、当前代码的问题分析 #

你使用的browser.identity.getAuthToken是Chromium系扩展（Chrome/Edge等）的专属API，Safari并不支持：

• Safari扩展的身份验证API是safari.identity，但它没有getAuthToken这个方法，提供的是openAuthWindow这类原生方法来处理OAuth流程
• 直接调用browser.identity.getAuthToken在Safari中会因API不存在而失效

修正后的实现思路及代码示例 #

1. 构造Google OAuth授权URL，包含客户端ID、Safari扩展专属重定向URI（格式为safari-extension://<你的扩展ID>/callback.html）、权限范围等参数
2. 用safari.identity.openAuthWindow打开授权窗口
3. 在回调页面提取授权码，向Google令牌端点请求换取access_token
4. 用Safari扩展推荐的safari.extension.settings存储token（而非localStorage，避免上下文限制）

// 替换为你的Google客户端ID和扩展重定向URI
const clientId = "你的Google客户端ID";
const redirectUri = "safari-extension://你的扩展ID/callback.html";

// 构造Google授权URL
const authUrl = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${clientId}&redirect_uri=${encodeURIComponent(redirectUri)}&response_type=code&scope=openid%20email%20profile&access_type=offline`;

// 打开授权窗口
safari.identity.openAuthWindow(authUrl, redirectUri, { width: 600, height: 400 }, (callbackUrl) => {
  // 从回调URL中提取授权码
  const code = new URL(callbackUrl).searchParams.get("code");
  
  // 向Google请求换取access_token
  fetch("https://oauth2.googleapis.com/token", {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: `client_id=${clientId}&redirect_uri=${encodeURIComponent(redirectUri)}&code=${code}&grant_type=authorization_code`
  })
  .then(res => res.json())
  .then(data => {
    // 存储token到扩展设置中
    safari.extension.settings.accessToken = data.access_token;
  })
  .catch(err => console.error("获取token失败:", err));
});

额外注意事项：

• 必须在Google Cloud控制台的OAuth客户端设置中，添加你的Safari扩展重定向URI到授权列表
• 扩展ID可在Safari开发者工具的扩展管理页面查看
• 确保扩展已在Safari中启用网络请求权限

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