是否可以使用Google标签管理器读取API负载变量

Question

正如标题所述，我正在尝试提取 API 负载中可用的

ssoid

变量的值。用JS可以实现吗？

有效负载对象：

{
    "query": "query Driver_All($customer: DriverInput!) {\n        driver(customer: $customer) {\n                authenticated\n                accounts\n                sharedAccounts\n         units {\n            count\n            previous\n            next\n            facets {\n              name\n              displayName\n              facetValues {\n                value\n                count\n              }\n            }\n            results {\n              productLineDesc\n              hasPendingTasks\n              hasAppointment\n              hasOpenDefects\n              currentStatusStage\n              status\n              activeStatusStep {\n                status\n                description\n                dateTimeFormatted\n                active\n                action\n                transactonDate\n                filterStatus\n              }\n              openDefectDate\n              countOfVehiclesWithPendingTasks\n              showMiles\n              showReeferHours\n              showStandbyHours\n              groups {\n                id\n                name\n              }\n              workflows {\n                section\n                steps {\n                  dateTimeFormatted\n                  description\n                  active\n                  status\n                  action\n                  alwaysLastStep\n                  transactonDate\n                }\n              }\n              unitStatus{\n                maintenanceStatusDate,\n                maintenanceStatusDescription\n                roadsideCaseStatusDate\n                roadsideCaseStatusDescription\n                odometerStatusDate\n                odometerStatusDescription\n               }\n               unitSummary {\n                location {\n                  locationSummary {\n                    locationCode\n                    locationId\n                    locationName\n                    street1\n                    street2\n                    city\n                    state\n                    zip\n                    latitude\n                    longitude\n                  }\n                  shop {\n                    phone\n                  }\n                }\n                unitId\n                unitNumber\n                customerUnitNumber\n                vehicleVin\n                odometer\n                odometerReadingDate\n                chassisMake\n                chassisModel\n                locationNumber\n                locationName\n                nextPM\n                pMLastDate\n                pMNextDate\n                vehicleMake\n                vehicleYear\n                vehicleModel\n              }\n              unitDetail {\n                accountNumber\n                fISAccountNumber\n                customerAssignedNumber\n                isShared\n                engineMake\n                engineModel\n                unitType\n                vehicleLicenseDate\n                vehicleLicenseTag\n                accountMgrNational\n                chassisAxleCount\n                chassisGearRatio\n                transMake\n                transModel\n                transNoSpeeds\n                suspensionMake\n                suspensionModel\n                suspensionType\n                vehicleGVWQty\n                engineEstLife\n                engineHP\n                engineNumCylinders\n                leaseExpirationDate\n                leaseTermMonths\n                tireSizeFront\n                tireSizeRear\n                tTTUnitType\n                billingDistrictCode\n                physicalDistrictCode\n                hasLiftgate\n                isRefrigerated\n                bodyLength\n                bodyHeight\n                bodyWidth\n                bodyType\n                referMake\n                referModel\n                rearAxleMake\n                rearAxleModel\n                rearAxleType\n              }\n              unitAppointment\n              {\n                appointmentId\n                appointmentDate\n                appointmentStatus\n                appointmentEndTime\n                appointmentLocation\n                appointmentStartTime\n                appointmentWorkItems\n                formattedTime\n                formattedAppointmentDate\n              }\n              vehicleOdometer {\n                lastBilledDate\n                billingToDate\n                billingFromDate\n                billingDueDate\n                billedOdometer\n                billedReeferHours\n                billedStdByHours\n                lastReadingDate\n                lastOdometerReading\n                lastReeferHoursReading\n                lastStandByHoursReading\n                odometerUnitOfMeasure\n                source\n              }\n            }\n          }\n        }\n}",
    "variables": {
        "customer": {
            "userName": "abc.com",
            "id": "4b470c91-5425-4b95-9bb9-393a8f4c6af7",
            "ssoid": "14642008",
            "token": "",
            "firstName": "FN",
            "lastName": "LN",
            "accessingOneVehicleNumber": "",
            "unitsPage": "?maximumRows=20&startPageIndex=1&sortBy=StatusOrder ASC, StatusOrder < 16 ? ActiveStatusStep.TransactionDateTime.Value.Date : DateTime.Now.Date ASC, UnitSummary.UnitNumber ASC",
            "phoneNumber": "[phone]"
        }
    }
}```

Answer 1

不确定您希望如何将其与 Google 跟踪代码管理器集成，但此脚本将拦截提取请求并允许您以 JSON 形式访问正文/有效负载，然后在从请求有效负载中获取所需内容后转发请求。在 Chrome 和 Firefox 中测试。感谢以下资源帮助构建此解决方案：捕获获取请求以及此github问题展示了如何克隆请求。

如果您在使用 GTM 进行这项工作时需要帮助，请提供有关您要实现的目标的更多详细信息，我会进行调查。

window.fetch = new Proxy(window.fetch, {
  apply(fetch, that, args) {
    return (async() => {
      try {
        //change this condition to only match the request you want to intercept
        var req = args[0];
        if (req.method === "POST") {
          //clone the request because payload can only be consumed once.
          var payload = await req.clone().json();
          console.log({payload});
        }
      } catch (e) {
        console.log(e)
      };
      //Perform fetch
      const result = fetch.apply(that, args);
      return result;
    })()
  }
});

编辑：

args[0]

应引用 Request 对象。

method

指的是请求方法属性，它应该是

"POST"

，因为您期望随请求一起发送有效负载。

如果由于某种原因 args 数组中的第一项不是请求对象，您可以更改对索引的引用，但我不确定为什么不能。您可以将所有参数记录到控制台以对该部分进行故障排除。

我在评论中提到，您可以更改该条件以满足您的需要。例如，如果您想要定位特定的 URL 路径，则可以将该逻辑添加到 if 语句中。对于其他选项，请查看上面有关请求对象的链接，或者只需将整个内容记录到控制台以查看所有请求属性。

var path = "api/path/";
if (req.method === "POST" && req.url.indexOf(path) > -1) {
  //clone the request because payload can only be consumed once.
  var payload = await req.clone().json();
  console.log({payload});
}