You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Contact Form7集成API后,gatewayID无法传入GTM数据层求助

问题:Contact Form7集成API后,数据层无法向GTM传递gatewayID

我正在将Contact Form7与API集成,API功能运行正常,但遇到一个问题:API返回的动态gatewayID需要通过数据层推送给Google Tag Manager,然而数据层完全未被传输。我难以定位问题原因,希望得到建议以确保gatewayID能正确传入数据层供Google Tag Manager接收。

相关PHP代码

/* Function to send contact form 7 data to API */
add_action('wpcf7_before_send_mail', 'send_post_after_cf7');
function send_post_after_cf7($contact_form) {
    $submission = WPCF7_Submission::get_instance();

    if ($submission) {
        $posted_data = $submission->get_posted_data();
        //get form ID, id = post id of cf7
        $form_id = $contact_form->id();
        //global values contain all forms
        $phone = $posted_data['tel'];
        $zip = $posted_data['zip'];
        $referer_url = isset($_SERVER['HTTP_REFERER']) ? $_SERVER['HTTP_REFERER'] : 'N/A';
        $current_date_time = date('Y-m-d H:i:s');
        $newsletter = isset( $posted_data['newsletter'] ) ? true : false;

        //form6
        if ($form_id == '2152452'){
        //get form data
                $email = $posted_data['your-email'];
                $name = $posted_data['your-name'];
                $source = "formcontact";
                $fullName = sanitize_text_field($posted_data['your-name']);

        //get API url
        $api_url = 'https://api.xxxx.com/my-api/form6';
                
        $body = array(
                    'email' => $email,
                    'phone' => $phone, 
                    'zip' => $zip,
                    'source' => $source,
                    "firstName" => $fullName,
                    "sourceUrl" => $referer_url,
                    "gdpr_date" => $current_date_time, 
                    "newsletter" => $newsletter
                );
        } 

        $args = array(
            'method' => 'POST',
            'headers' => array(
                'Content-Type' => 'application/json',
            ),
            'body' => json_encode( $body ),
        );

        $body_json = json_encode($body);
        $response = wp_remote_post($api_url, array(
            'method' => 'POST',
            'headers' => array('Content-Type' => 'application/json; charset=utf-8'),
            'body' => json_encode($body),
            'data_format' => 'body',
        ));

        if (!is_wp_error($response) && wp_remote_retrieve_response_code($response) == 200) {
            $body = wp_remote_retrieve_body($response);
            $data = json_decode($body);
            if (isset($data->gatewayID)) {
                $gatewayID = $data->gatewayID;

                add_action('wp_footer', function() use ($gatewayID, $form_id) {
                    $dataLayerContent = [
                        'event' => 'formSubmissionSuccess',
                        'gatewayID' => $gatewayID,
                    ];
                    if ($form_id == '2152452') {
                        $dataLayerContent['form_type'] = 'formcontact';
                        if (isset($posted_data['tel'])) {
                            $dataLayerContent['phone'] = $posted_data['tel'];
                        }
                        if (isset($posted_data['your-email'])) {
                            $dataLayerContent['email'] = $posted_data['your-email'];
                        }
                        if (isset($posted_data['your-name'])) {
                            $dataLayerContent['name'] = $posted_data['your-name'];
                        }
                        if (isset($posted_data['zip'])) {
                            $dataLayerContent['ZIP'] = $posted_data['zip'];
                        }
                    }
            $jsonContent = json_encode($dataLayerContent);
                    
            error_log("Data Layer content: " . $jsonContent);

            echo "<script type='text/javascript'>
                window.dataLayer = window.dataLayer || [];
                 window.dataLayer.push($jsonContent);
            </script>";
                    

                });
             $response_body = wp_remote_retrieve_body($response);
               error_log("API request successful, sent data to CRM: $body_json, response: $response_body, Data Layer content: " . json_encode($jsonContent));
            }
        }
    }
}

问题定位与修复方案

1. 闭包变量作用域缺失

代码中wp_footer的匿名函数引用了$posted_data,但未通过use关键字将其传入闭包,导致PHP抛出未定义变量错误,直接中断脚本输出。修复方法是在use列表中添加$posted_data:

add_action('wp_footer', function() use ($gatewayID, $form_id, $posted_data) {
    // 原有逻辑保持不变
});

2. 钩子时机选择错误

wpcf7_before_send_mail触发时,页面可能已经开始输出内容,此时添加wp_footer钩子可能错过执行时机。建议改用wpcf7_mail_sent钩子,该钩子在邮件发送完成后触发,更适合处理后续前端数据注入:

// 替换原有的钩子注册
add_action('wpcf7_mail_sent', 'send_post_after_cf7');

3. 避免直接echo脚本,使用WordPress标准方法

直接echo脚本可能导致输出顺序混乱或被主题/插件过滤,建议使用wp_add_inline_script插入数据层代码,确保脚本正确加载到页面底部:

// 替换原有的echo脚本部分
wp_add_inline_script('wp-element', "window.dataLayer = window.dataLayer || []; window.dataLayer.push($jsonContent);");

这里选择wp-element作为依赖脚本(WordPress核心默认加载),也可以替换为你主题中已加载的其他核心脚本。

4. 简化数据判断逻辑

原代码中对$posted_data的重复isset判断可以用PHP空合并运算符简化,让代码更简洁:

$dataLayerContent['phone'] = $posted_data['tel'] ?? '';
$dataLayerContent['email'] = $posted_data['your-email'] ?? '';
$dataLayerContent['name'] = $posted_data['your-name'] ?? '';
$dataLayerContent['ZIP'] = $posted_data['zip'] ?? '';

5. 调试验证步骤

  • 查看PHP错误日志,确认是否存在未定义变量或其他语法错误
  • 检查页面源代码,确认数据层脚本是否出现在</body>标签附近
  • 使用GTM预览模式,监听formSubmissionSuccess事件,验证gatewayID及其他字段是否存在

内容的提问来源于stack exchange,提问作者JohnK

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.29 04:33:12