WordPress通过wp_login钩子实现GA4登录事件追踪失效问题

wp_login 钩子触发于用户凭证校验通过、登录会话写入完成的节点，钩子执行完毕后WordPress会立刻发起登录后跳转。此时直接输出JS脚本的话，浏览器还没完成当前页面的解析渲染，就会收到跳转指令，这段脚本根本没有执行机会，自然无法完成GA4事件上报。

单独测试时两个逻辑都能跑通的原因很简单：写Cookie是通过HTTP响应头完成的，不需要页面渲染，完全不受后续跳转影响；单独执行JS输出逻辑时没有触发跳转流程，浏览器可以正常解析执行脚本。

最稳妥的实现方式是通过临时标记做中转：登录成功时先写入一个超短有效期的临时Cookie，等跳转到登录后落地页时，再检测标记输出上报脚本，执行完成后立刻清除标记避免重复上报。

完整可直接使用的代码如下，放到主题functions.php文件中即可：

// 1. 登录成功后写入临时追踪标记
add_action('wp_login', 'gal_set_login_track_flag', 90);
function gal_set_login_track_flag() {
    // 标记有效期设为60秒，足够覆盖登录跳转全流程
    setcookie(
        'ga_login_event_flag',
        '1',
        time() + 60,
        COOKIEPATH,
        COOKIE_DOMAIN,
        is_ssl(),
        true
    );
}

// 2. 前端页面底部检测标记，输出GA4上报脚本
add_action('wp_footer', 'gal_render_login_track_script', 99);
function gal_render_login_track_script() {
    // 没有检测到标记直接退出
    if (!isset($_COOKIE['ga_login_event_flag']) || $_COOKIE['ga_login_event_flag'] !== '1') {
        return;
    }
    // 上报完成立刻清除标记，防止重复上报
    setcookie(
        'ga_login_event_flag',
        '',
        time() - 3600,
        COOKIEPATH,
        COOKIE_DOMAIN,
        is_ssl(),
        true
    );
    ?>
    <script>
        // 兼容GA4/GTM脚本未提前初始化的场景，避免JS报错
        window.dataLayer = window.dataLayer || [];
        dataLayer.push({
            event: 'login',
            login_method: 'default_wp_account'
        });
    </script>
    <?php
}

• 不要在wp_login、wp_logout这类会触发服务端重定向的钩子中直接输出前端JS/HTML内容，这类钩子执行阶段还没进入页面渲染流程，输出内容不仅不会正常执行，还可能触发WordPress的"Cannot modify header information"报错。
• 如果你的站点有缓存插件，记得给登录用户跳过页脚缓存，否则标记检测逻辑可能因为缓存静态页面失效。
• 可以根据自身业务需要，在dataLayer推送的参数里补充用户角色、登录入口等自定义维度，方便GA4做更细的分析。

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