如何修复Gtag增强转化实施失败及em参数缺失问题

核心问题总结 #

你的代码存在四个关键问题，直接导致Network Tab缺失em参数：

• 未对邮箱做SHA-256哈希处理（Google增强转化要求用户数据必须哈希后传输）
• script标签存在语法错误
• 用户数据设置时机晚于config请求发送
• 依赖jQuery但未做兼容性校验

逐一修复步骤 #

1. 修复script标签语法错误 #

第二个script标签的type属性多了一个冗余双引号，修正为：

<script type="text/plain">

2. 添加SHA-256哈希函数 #

Google增强转化要求邮箱必须是先转小写+去除首尾空格+SHA-256哈希后的值，新增哈希处理函数：

function sha256(str) {
  return crypto.subtle.digest('SHA-256', new TextEncoder().encode(str.trim().toLowerCase()))
    .then(buf => {
      return Array.prototype.map.call(new Uint8Array(buf), x => ('00' + x.toString(16)).slice(-2)).join('');
    });
}

3. 调整执行顺序，确保用户数据先于config设置 #

把gtag('config')放到用户数据哈希完成后执行，避免请求发送时还未传入邮箱参数：

方案A（保留jQuery）

<head>
<!-- Google tag (gtag.js) -->
<script type="text/plain" async src="https://www.googletagmanager.com/gtag/js?id=AW-12345"></script>

<script type="text/plain">
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

$(document).ready(async function() {
  const userEmail = $("#email").val();
  if (userEmail) {
    const hashedEmail = await sha256(userEmail);
    gtag('set', 'user_data', {
      "email": hashedEmail
    });
  }
  // 无论是否获取到邮箱，都触发config
  gtag('config', 'AW-12345', {'allow_enhanced_conversions': true});
  gtag('config', 'AW-12346', {'allow_enhanced_conversions': true});
});

function sha256(str) {
  return crypto.subtle.digest('SHA-256', new TextEncoder().encode(str.trim().toLowerCase()))
    .then(buf => {
      return Array.prototype.map.call(new Uint8Array(buf), x => ('00' + x.toString(16)).slice(-2)).join('');
    });
}
</script>
</head>

方案B（原生DOM，不依赖jQuery）

如果页面未引入jQuery，改用原生写法避免报错：

<head>
<!-- Google tag (gtag.js) -->
<script type="text/plain" async src="https://www.googletagmanager.com/gtag/js?id=AW-12345"></script>

<script type="text/plain">
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

document.addEventListener('DOMContentLoaded', async function() {
  const emailInput = document.getElementById('email');
  if (emailInput && emailInput.value) {
    const hashedEmail = await sha256(emailInput.value);
    gtag('set', 'user_data', {
      "email": hashedEmail
    });
  }
  gtag('config', 'AW-12345', {'allow_enhanced_conversions': true});
  gtag('config', 'AW-12346', {'allow_enhanced_conversions': true});
});

function sha256(str) {
  return crypto.subtle.digest('SHA-256', new TextEncoder().encode(str.trim().toLowerCase()))
    .then(buf => {
      return Array.prototype.map.call(new Uint8Array(buf), x => ('00' + x.toString(16)).slice(-2)).join('');
    });
}
</script>
</head>

4. 验证要点 #

• 检查页面是否已引入jQuery（方案A需确保jQuery在gtag脚本前加载）
• 在浏览器控制台执行document.getElementById('email').value，确认目标输入框存在且有值
• 清除浏览器缓存后测试，查看googleanalytics.com/g/collect请求是否包含em参数

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