Javascript 如何：将客户端令牌处理程序从Braintree.NETSDK插入到客户端

我对web开发相当陌生，主要使用VB和WinForms。我已经着手为客户建立一个小型电子商务网站，并决定使用Braintree来处理交易。但是，我在将服务器生成的客户端令牌获取到客户端Braintree UI插件表单时遇到了问题。我已经按照他们的建议创建了一个默认处理程序

public class ClientTokenHandler : IHttpHandler
{
    public string pubClientToken;
    public void ProcessRequest(HttpContext context)
    {
        var gateway = new BraintreeGateway
        {
            Environment = Braintree.Environment.SANDBOX,
            MerchantId = "MerchantID",
            PublicKey = "Public_Key",
            PrivateKey = "Private_Key"
        };
       pubClientToken = gateway.ClientToken.generate();
       HttpContext.Current.Response.Write(pubClientToken);
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

我在处理程序的开头设置了一个断点，这样当我从客户端调用处理程序以获取客户端令牌时，我可以确保生成了令牌。然而，断点从未命中，UI中的删除也从未加载（我假设它没有有效的令牌）。下面是我对处理程序的AJAX调用代码

<div class="container">
    <form id="checkout" method="post" action="/checkout">
    <div id="payment-form"></div>
    <input type="submit" value="Pay $10">
    </form>

    <script src="https://js.braintreegateway.com/js/braintree-2.22.2.min.js"></script>

   <script>
       var clientToken;
       function CallHandler() {
           $.ajax({
               url: "ClientTokenHandler.ashx.cs",
               type: "GET",
               contentType: "application/json; charset=utf-8",
               success: OnComplete,
               error: OnFail
           });
           return result;

           function OnComplete(result) {
               clientToken = data;
           }
           function OnFail(result) {
               alert('Request failed');

           }
       }

    // We generated a client token for you so you can test out this code
    // immediately. In a production-ready integration, you will need to
       // generate a client token on your server (see section below).
       //var clientToken = "eyJ2ZXJzaW9uIjoyLCJhdXRob3JpemF0aW9uRmluZ2VycHJpbnQiOiJjOWU2ZDgwNDI3YWEyMjQ5YjMwMmQzNjdjZTJhOTljODNiMWNjYTljOGNlMjcwMzBlZDIxYmM2NjYxZDhjMzBlfGNyZWF0ZWRfYXQ9MjAxNi0wNC0wNlQxNjo0OToxOS45NDEyNTQ3MzcrMDAwMFx1MDAyNm1lcmNoYW50X2lkPTM0OHBrOWNnZjNiZ3l3MmJcdTAwMjZwdWJsaWNfa2V5PTJuMjQ3ZHY4OWJxOXZtcHIiLCJjb25maWdVcmwiOiJodHRwczovL2FwaS5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tOjQ0My9tZXJjaGFudHMvMzQ4cGs5Y2dmM2JneXcyYi9jbGllbnRfYXBpL3YxL2NvbmZpZ3VyYXRpb24iLCJjaGFsbGVuZ2VzIjpbXSwiZW52aXJvbm1lbnQiOiJzYW5kYm94IiwiY2xpZW50QXBpVXJsIjoiaHR0cHM6Ly9hcGkuc2FuZGJveC5icmFpbnRyZWVnYXRld2F5LmNvbTo0NDMvbWVyY2hhbnRzLzM0OHBrOWNnZjNiZ3l3MmIvY2xpZW50X2FwaSIsImFzc2V0c1VybCI6Imh0dHBzOi8vYXNzZXRzLmJyYWludHJlZWdhdGV3YXkuY29tIiwiYXV0aFVybCI6Imh0dHBzOi8vYXV0aC52ZW5tby5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tIiwiYW5hbHl0aWNzIjp7InVybCI6Imh0dHBzOi8vY2xpZW50LWFuYWx5dGljcy5zYW5kYm94LmJyYWludHJlZWdhdGV3YXkuY29tLzM0OHBrOWNnZjNiZ3l3MmIifSwidGhyZWVEU2VjdXJlRW5hYmxlZCI6dHJ1ZSwicGF5cGFsRW5hYmxlZCI6dHJ1ZSwicGF5cGFsIjp7ImRpc3BsYXlOYW1lIjoiQWNtZSBXaWRnZXRzLCBMdGQuIChTYW5kYm94KSIsImNsaWVudElkIjpudWxsLCJwcml2YWN5VXJsIjoiaHR0cDovL2V4YW1wbGUuY29tL3BwIiwidXNlckFncmVlbWVudFVybCI6Imh0dHA6Ly9leGFtcGxlLmNvbS90b3MiLCJiYXNlVXJsIjoiaHR0cHM6Ly9hc3NldHMuYnJhaW50cmVlZ2F0ZXdheS5jb20iLCJhc3NldHNVcmwiOiJodHRwczovL2NoZWNrb3V0LnBheXBhbC5jb20iLCJkaXJlY3RCYXNlVXJsIjpudWxsLCJhbGxvd0h0dHAiOnRydWUsImVudmlyb25tZW50Tm9OZXR3b3JrIjp0cnVlLCJlbnZpcm9ubWVudCI6Im9mZmxpbmUiLCJ1bnZldHRlZE1lcmNoYW50IjpmYWxzZSwiYnJhaW50cmVlQ2xpZW50SWQiOiJtYXN0ZXJjbGllbnQzIiwiYmlsbGluZ0FncmVlbWVudHNFbmFibGVkIjp0cnVlLCJtZXJjaGFudEFjY291bnRJZCI6ImFjbWV3aWRnZXRzbHRkc2FuZGJveCIsImN1cnJlbmN5SXNvQ29kZSI6IlVTRCJ9LCJjb2luYmFzZUVuYWJsZWQiOmZhbHNlLCJtZXJjaGFudElkIjoiMzQ4cGs5Y2dmM2JneXcyYiIsInZlbm1vIjoib2ZmIn0=";


    braintree.setup(clientToken, "dropin", {
    container: "payment-form"
    });
    </script>
</div>

var-clientToken；
函数CallHandler（）{
$.ajax({
url:“ClientTokenHandler.ashx.cs”，
键入：“获取”，
contentType:“应用程序/json；字符集=utf-8”，
成功：未完成，
错误：OnFail
});
返回结果；
函数完成（结果）{
clientToken=数据；
}
函数OnFail（结果）{
警报（“请求失败”）；
}
}
//我们为您生成了一个客户端令牌，以便您可以测试此代码
//马上。在生产就绪的集成中，您需要
//在服务器上生成客户端令牌（请参阅下面的部分）。
//var clientToken="2.2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 WLUDHJLZ2.研究结果表明，该文的第二部分内容是一个2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 WLUDHJLZWDHDGV3YXKUY29TII6月4日，我在一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月一个月内，一个月内，一个月内，一个月内，一个月内，一个月内，一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月一个月的5KYM94kSisimnSawvUdelkijpudwxslcjwcml2ywn5vxjjjoiahr0cdovl2v4ywgUy29tl3bwiiwidxnlckfncvlbwuvudfvybci6imh0dha6ly9legftccgxllmnvbs90b3 milcjiyxnlvxjjjjoiahr0chm6y9hc3nldhmynjhaw50cmvlz2f2z2z2zzzz2jjjjjjjjc3nv3njjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjl2jjjjjjw9v0jjjjjjjjjjjjjjjjjw9v0jjjjjjjjjjw9v9jjjjjjjjjjjjjIM9MZMxPbMuilcJ1bNzlDhrlZe1LCMnOyW50IjPmYWxZSwinJHAW50CMVLQ2xPzW50SWQiOijTxN0ZJbGglLbWnQiwizMlSbGluzFnCfCfLbWwWwWwWwWfBwWfBnFgKjJjGfUdFjJfJwFjJfJwFjY2FyJyWyWy2LzZZIzIzIzIzIzIzIzIzIzIzIzZZZIZIZIzFJJJJJJZZZZZZZZIZZIZZZZZZZZVvVvVvVvZZZZZZZZZZVvVvVcIZZZZZZ；
设置（clientToken，“dropin”{
集装箱：“付款单”
});

---

任何人都有他们会/曾经这样做的例子吗？这是我的第一篇文章，请不要扔太多石头。）TIA！

我自己解决了这个问题。我显然没有引用正确的JQuery脚本。哦，我不得不将“type:”改为post。这是我最后的工作代码，用于获取Braintree生成的客户端令牌并传递给客户

<div class="container">
        <form id="checkout" method="post" action="/Checkout">
        <div id="payment-form"></div>
        <input type="submit" value="Submit Payment">
        </form>

        <script src="https://js.braintreegateway.com/js/braintree-2.22.2.min.js"></script>

       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script>
            //AJAX call to get clientToken from ClientTokenHandler
           var clientToken;
            $(document).ready(function CallHandler() {
                $.ajax({
                    url: "ClientTokenHandler.ashx",
                    type: "POST",
                    cache: false,
                    datatype: "text",
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {
                        clientToken = data;
                        braintree.setup(clientToken, "dropin", {
                            container: "payment-form"
                        });
                    }
                });
            });
            //End call
         </script>
    </div>

//从ClientTokenHandler获取clientToken的AJAX调用
var-clientToken；
$（文档）.ready（函数CallHandler（））{
$.ajax({
url:“ClientTokenHandler.ashx”，
类型：“POST”，
cache:false，
数据类型：“文本”，
contentType:'application/json；charset=utf-8'，
成功：功能（数据）{
clientToken=数据；
设置（clientToken，“dropin”{
集装箱：“付款单”
});
}
});
});
//结束通话

希望这对其他人有所帮助！

我包括了一个，现在它在我的断点处停止。但是，现在当我将客户端令牌插入dropin UI时，我的浏览器中出现一个错误，上面写着“未捕获错误：Braintree API客户端配置错误：需要clientToken”。“如果我暂停调试器并手动注入由其服务器生成的令牌，甚至会发生这种情况！”！？！