Safari v18中g_csrf_token未随请求传递的技术问题排查

问题现象 #

仅在该环境下出现异常：使用配置了ux_mode: 'redirect'的Google登录JavaScript API（未启用一键登录），重定向回站点后，请求中未携带g_csrf_token参数，但浏览器Storage标签内能找到对应的Cookie。Chrome、Firefox及旧版Safari均无此问题，按Google文档的校验逻辑会直接返回400错误。

相关代码片段：

按钮HTML #

<div
  id="google-button"
  data-button-text="<%= button_text %>"
  data-client-id="<%= google_oauth_client_id %>"
  data-request-url="<%= request_url %>"
>
</div>

初始化Google登录 #

window.addEventListener('load', function() {
  google.accounts.id.initialize({
    client_id: $('#google-button').data('client-id'),
    login_uri: $('#google-button').data('request-url'),
    ux_mode: 'redirect'
  });

  google.accounts.id.renderButton(
    document.getElementById('google-button'),
    { ... }
  );
});

后端校验逻辑 #

if params[:g_csrf_token].blank? || cookies[:g_csrf_token].blank? || params[:g_csrf_token] != cookies[:g_csrf_token]
  head :bad_request
end

可能原因 #

1. Safari 18跨站请求限制强化：该版本对跨站跳转时的参数传递做了更严格的拦截，Google登录redirect流程中自动生成的g_csrf_token参数被阻止附加到请求中，但同域Cookie不受影响。
2. SameSite Cookie策略适配问题：Safari 18对Cookie的SameSite属性校验更严格，若Google API自动设置的g_csrf_token Cookie不符合当前策略，会导致跳转时无法被读取并生成请求参数。

解决方案 #

1. 手动实现自定义CSRF校验 #

绕过Google自动生成的g_csrf_token，自行控制CSRF token的生成与传递：

• 页面加载时生成自定义CSRF token，存入Cookie（设置SameSite=Lax、HttpOnly=false）
• 配置Google登录的login_uri时，手动附加该自定义token作为请求参数
• 后端校验请求参数中的自定义token与Cookie值是否一致

示例调整代码：

<div
  id="google-button"
  data-button-text="<%= button_text %>"
  data-client-id="<%= google_oauth_client_id %>"
  data-request-url="<%= request_url %>?custom_csrf=<%= custom_csrf_token %>"
>
</div>

# 后端校验逻辑替换
if params[:custom_csrf].blank? || cookies[:custom_csrf].blank? || params[:custom_csrf] != cookies[:custom_csrf]
  head :bad_request
end

2. 调整Cookie属性 #

确保g_csrf_token Cookie的SameSite属性设置为Lax（安全且兼容多数场景的设置），若该Cookie由Google API自动生成，可在页面加载时手动覆盖其属性。

3. 升级Google登录API版本 #

确认使用最新版的Google Accounts JavaScript API，Google可能已针对Safari 18的特性发布兼容修复，替换页面中的API引入脚本为最新版本。

4. 临时切换为Popup模式（可选） #

若redirect模式的兼容问题短期内无法解决，可临时切换为ux_mode: 'popup'，该模式下CSRF token的传递逻辑不同，可能避开Safari的限制。

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