如何在 DNN 代码隐藏中加载 Facebook Pixel NoScript 代码？

Question

我们有一个带有自定义代码的结帐模块，当用户是经销商时，它将为最终用户显示一个向导和另一个多视图。我试图仅在用户是最终用户时触发 Facebook 像素代码。我遇到的问题是我无法在 JavaScript 函数中调用的 NoScript 代码。我也不想将其放在 ASCX 文件中的脚本标记之后，因为仅在生成发票时才会调用其余的像素代码，并且 Facebook Pixel Helper Browser Extension 因此会出错。我试图拆分 Script 和 NoScript 代码。在下面的代码隐藏中，我从我设置的模块设置中设置 Facebook 像素 ID。我还为 NoScript 代码创建了一个设置，即 FacebookPixelForEndUserNoScriptImageCode 设置。

if (Settings["FacebookPixelIDForEndUser"] != null && !string.IsNullOrWhiteSpace(Settings["FacebookPixelIDForEndUser"].ToString())){
      EndUserFirstName = SessionManager.CurrentUserInfo.FirstName;
      EndUserLastName = SessionManager.CurrentUserInfo.LastName;
      EndUserEmail = SessionManager.CurrentUserInfo.PersonalEmailAddress;

      facebookInitializationCodeID = Settings["FacebookPixelIDForEndUser"].ToString();
      ScriptManager.RegisterStartupScript(Page, this.GetType(), "attacheEvents", "javascript:initializeFacebookPixelCodeForEndUser();", true);

      string FacebookPixelNoScriptCode = Settings["FacebookPixelForEndUserNoScriptImageCode"].ToString();
      Page.ClientScript.RegisterStartupScript(this.GetType(), "FacebookPixelForEndUserNoScriptImageCode", FacebookPixelNoScriptCode, false);
}

下面的代码是从代码隐藏中调用的前端代码。

    function initializeFacebookPixelCodeForEndUser(){
    var custemail = '<%=EndUserEmail%>';
    var custfirstname = '<%=EndUserFirstName%>';
    var custlastname = '<%=EndUserLastName%>';

    !function(f,b,e,v,n,t,s)
    {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
    n.callMethod.apply(n,arguments):n.queue.push(arguments)};
        if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
        n.queue=[];t=b.createElement(e);t.async=!0;
        t.src=v;s=b.getElementsByTagName(e)[0];
        s.parentNode.insertBefore(t,s)}(window, document,'script',
    'https://connect.facebook.net/en_US/fbevents.js');
    fbq('init', '<%=facebookInitializationCodeID%>', {
        em: custemail,
        fn: custfirstname,
        ln: custlastname,
    });
    fbq('track', 'PageView');
}

这是我在设置中设置的 NoScript 代码，并在调用 RegisterStartupScript 代码后立即调用。

<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr? 
id=RemovedTheIDForPrivacy&ev=PageView&noscript=1"
/></noscript>

我当前的代码似乎失败了，因为它说 fbq 未定义。我在调用上述代码后立即调用购买事件，但我认为它失败了，因为代码不在一起。

<script>
 fbq('track', 'Purchase', {
   value: 1,
   currency: 'ZAR',
 });
</script>

有没有关于如何在 Javascript/JQuery 中调用 Script 和 NoScript 代码的解决方案？

Answer 1

通常，当您遇到有关 fbq 未初始化的错误时，这是​​由于您在调用实际 Facebook 脚本之前渲染触发的代码，因此尚未定义。

我会确保对 Facebook JS 的引用位于您的代码之前（例如，在皮肤或页眉的顶部，而不是页脚。）

至于no script，如果你想从后面的代码中加载它，如果你使用WebForms模式，你可以使用<asp:literal>控件将其呈现到页面上。

Answer 2

我通过在服务器端使用 StringWriter 编写 Facebook Pixel Tracking 代码设法解决了这个问题。

if (!SessionManager.CurrentUserInfo.IsCustomerDealer)
                {     

                    if (Settings["FacebookPixelIDForEndUser"] != null && !string.IsNullOrWhiteSpace(Settings["FacebookPixelIDForEndUser"].ToString()))
                    {
                        EndUserFirstName = SessionManager.CurrentUserInfo.FirstName;
                        EndUserLastName = SessionManager.CurrentUserInfo.LastName;
                        EndUserEmail = SessionManager.CurrentUserInfo.UserName;

                        facebookInitializationCodeID = Settings["FacebookPixelIDForEndUser"].ToString();

                        string FacebookPixelResult = string.Empty;

                        using (var FBPxl = new StringWriter())
                        using (var FBCodescript = new HtmlTextWriter(FBPxl))
                        {
                            FBCodescript.AddAttribute(Attr.Type, "text/javascript");
                            FBCodescript.RenderBeginTag(Tag.Script);
                            //load ecommerce plugin
                            FBCodescript.WriteLine("!function(f,b,e,v,n,t,s){if (f.fbq) return; n = f.fbq = function(){n.callMethod?n.callMethod.apply(n, arguments):n.queue.push(arguments)};");
                            FBCodescript.WriteLine("if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0';");
                            FBCodescript.WriteLine("n.queue =[]; t = b.createElement(e); t.async = !0;");
                            FBCodescript.WriteLine("t.src = v; s = b.getElementsByTagName(e)[0];");
                            FBCodescript.WriteLine("s.parentNode.insertBefore(t, s)}");
                            FBCodescript.WriteLine("(window, document,'script','https://connect.facebook.net/en_US/fbevents.js');");
                            FBCodescript.WriteLine($"fbq('init', '{facebookInitializationCodeID}', {{ em: '{EndUserEmail}', fn: '{EndUserFirstName}', ln: '{EndUserLastName}',}});");
                            FBCodescript.WriteLine("fbq('track', 'PageView');");
                            FBCodescript.RenderEndTag();
                            FBCodescript.WriteLine($"<noscript><img height='1' width='1' style='display:none'  src='https://www.facebook.com/tr?id={facebookInitializationCodeID}&ev=PageView&noscript=1'/></noscript>");
                            FacebookPixelResult = FBCodescript.InnerWriter.ToString();
                        }

                        Page.ClientScript.RegisterStartupScript(this.GetType(), "myFacebookPixelInitialization", FacebookPixelResult ,false);

                    }
                }