GTM의 데이터 레이어에 자바 스크립트 변수가 정의되지 않았습니다.

Question

GTM 데이터 레이어에서 Liferay rest API 호출에서 값을 가져 오는 변수를 사용하고 있습니다.

var openId; 
AUI().ready('aui-base', function(A){ 
Liferay.Service(
     '/user/get-user-by-id', 
     { 
     userId: Liferay.ThemeDisplay.getUserId() 
     }, 
     function(obj) { 
      openId=obj.openId; 
     } 
       ); 
    }); 

여기에 openId 변수는 사용할 수없고 undefined로 표시 GTM 데이터 영역에 이용되고있다. 데이터 영역은 다음과 같이 정의된다 : 태그 관리 스크립트 정의 블록,

dataLayer = [{ 
       "page" : Liferay.currentURL 
       ,"pageType" : instrDetail 
       ,"user" : { 
          "type" : userType 
          ,"accountId" : openId 
          } 
      }]; 

과 끝에서, 우리는 블록 GTM있다. I는 데이터 영역에 openId 변수에 액세스하려고하면 I가 동일한 하나의 브라우저 콘솔을 액세스 할 때, 올바른 값을 표시하는 반면

(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': 
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], 
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); 
})(window,document,'script','dataLayer','GTM-XXXXXX'); 

지금, 그와 같은 정의이다.

Answer 1

두 번 시도한 후에 해결되었습니다.

처음에는 일부 검색을 한 후이 사실이 Javascript 비동기 문제 였음을 알게되었습니다. Rest call 응답이 수신되기 전에 dataLayer가 변수를 페치하여 dataLayer에서 변수를 사용할 수 없었습니다. 이를 정렬하려면 that.In, 데이터 영역이 후 성공적 후 성공적으로 응답

AUI().ready('aui-base', function(A){ 
Liferay.Service(
     '/user/get-user-by-id', 
     { 
     userId: Liferay.ThemeDisplay.getUserId() 
     }, 
     function(obj) { 
      callback(obj.openId); 
     } 
       ); 
    }); 

를 수신 dataLayer를 포함하는의 response.Hence하는 callback 함수가 호출을 받아 건설해야했다 페이지 게시물에 사용할 수있었습니다 그런데 또 다른 문제가 발생했습니다. 이제 GTM 스크립트 블록이 페이지로드에서 실행되기 전에 쉬었습니다. API 응답이므로 다른 모든 변수는 undefined이되었습니다. 이는 REST 호출의 응답 이전에 GTM 스크립트에서 datalayer를 사용할 수 없었기 때문입니다.

이렇게 정렬하려면 dataLayer와 GTM 스크립트 블록 모두 callBack 함수의 일부 여야하고 응답을받은 후 호출해야합니다. 결국 문제가 해결되었습니다.

function callback(openId) 
    { 
     dataLayer = [{ 
       "page" : Liferay.currentURL 
       ,"pageType" : instrDetail 
       ,"user" : { 
          "type" : userType 
          ,"accountId" : openId 
          } 
        }]; 
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': 
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], 
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); 
})(window,document,'script','dataLayer','GTM-PGLDG7W'); 
}