Javascript 如何有效地调试对MailChimp 3.0服务器的JQuery GET请求？

我正在尝试将用户的电子邮件添加到我的Mailchimp 3.0受众列表中。我使用JQuery发出GET请求，但我保留以下错误：

{"type":"http://developer.mailchimp.com/documentation/mailchimp/guides/error-glossary/","title":"API Key Invalid","status":401,"detail":"Your request did not include an API key.","instance":"1e63d45d-2f46-481f-a674-3c307033cd29"}

此错误发生在我单击按钮触发请求后

以下是JQuery脚本的HTML代码部分：

<form **action="https://us4.api.mailchimp.com/3.0/lists/8a99d9c7eb/members/>"**
                                method="get" **id="mc-embedded-subscribe-form"** name="mc-embedded-subscribe-form" class="validate">
                                    <p class="signUp mt-5">
                                        We are currently Beta testing our service and will reveal more
                                        soon. Enter your email address below to receive updates.
                                    </p>
                                    <div class="form-label-group">
                                        <input type="email" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="form-control"
                                            placeholder="Email address" required autofocus>
                                    </div>

                                <input type="submit" value="Notify me" name="subscribe" id="mc-embedded-subscribe" class="btn btn-sm btn-success mt-1 shadow-lg">
                                <div id="subscribe-result"></div>
                                    <!-- <button class="btn btn-sm btn-success mt-1 shadow-lg" id="submitInfo"
                                        type="submit">Notify
                                        Me</button> -->
                                </form>

我们目前正在测试我们的服务，并将公布更多信息
很快。在下面输入您的电子邮件地址以接收更新。

以下是我的JQuery代码：

$(document).ready(function () {
 var $form = $('#mc-embedded-subscribe-form')
 if ($form.length > 0) {
   $('form input[type="submit"]').bind('click', function (event) {
     if (event) event.preventDefault()
     register($form)
   })
 }
})

function register($form) {
 $('#mc-embedded-subscribe').val('Sending...');
 $.ajax({
   type: $form.attr('method'),
   url: $form.attr('action'),
   data: $form.serialize(),
   status: "unsubscribed",
   headers: {
     'Authorization': 'Basic ' + new Buffer(`anything': 'apikey xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-usx`)
   },
   cache: false,
   dataType: 'json',
   contentType: 'application/json; charset=utf-8',
   error: function (err) {
     alert('Could not connect to the registration server. Please try again later.')
   },
   success: function (data) {
     $('#mc-embedded-subscribe').val('subscribe')
     if (data.result === 'success') {
       // Yeahhhh Success
       console.log(data.msg)
       $('#mce-EMAIL').css('borderColor', '#ffffff')
       $('#subscribe-result').css('color', 'rgb(53, 114, 210)')
       $('#subscribe-result').html('<p>Thank you for subscribing. We have sent you a confirmation email.</p>')
       $('#mce-EMAIL').val('')
     } else {
       // Something went wrong, do something to notify the user.
       console.log(data.msg)
       $('#mce-EMAIL').css('borderColor', '#ff8282')
       $('#subscribe-result').css('color', '#ff8282')
       $('#subscribe-result').html('<p>' + data.msg.substring(4) + '</p>')
     }
   }
 })
};

$（文档）.ready（函数（）{
var$form=$（“#mc嵌入式订阅表单”）
如果（$form.length>0）{
$（'forminput[type=“submit”]”）。绑定（'click'，函数（事件）{
if（event）event.preventDefault（）
登记册（表格）
})
}
})
功能寄存器（$form）{
$（'mc embedded subscribe'）.val（'Sending…'）；
$.ajax({
类型：$form.attr（'method'），
url:$form.attr（'action'），
数据：$form.serialize（），
状态：“未订阅”，
标题：{
“授权”：“基本”+新缓冲区（'anything'：'apikey xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-usx`）
},
cache:false，
数据类型：“json”，
contentType:'application/json；charset=utf-8'，
错误：函数（err）{
警报（'无法连接到注册服务器。请稍后重试'）
},
成功：功能（数据）{
$（'mc embedded subscribe'）.val（'subscribe'））
如果（data.result==='success'）{
//是啊，成功了
console.log（data.msg）
$（'mce EMAIL'）.css（'borderColor'，'ffffff'））
$（“#订阅结果”）.css（'color'，'rgb（53114210'））
$（“#订阅结果”）.html（“感谢您的订阅。我们已向您发送确认电子邮件。
”）
$（“#mce电子邮件”）.val（“”）
}否则{
//出现问题，请采取措施通知用户。
console.log（data.msg）
$（“#mce EMAIL”）.css（'borderColor'，'ff8282'）
$（“#订阅结果”）.css（'color'，'#ff8282'）
$（“#订阅结果”）.html（“”+data.msg.substring（4）+“
”）
}
}
})
};

我曾尝试使用Fetch和AJAX发出此请求，但没有使用。这种方法帮助我取得了进步，但遇到了这个小问题。我复习了以下问题和答案，以获得更多支持：

最后，这里是MailChimp API文档

---

谢谢你的帮助

在前端公开API密钥不是一个好主意。您可以按照此方法将用户添加到特定列表/受众

<!-- Please copy your form from Mailchimp Signup form ( condensed in your case ) or copy the form and input values from the form  -->
    <form action="Your url from signup form" method="get" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
        <label for="mce-EMAIL">Subscribe</label>
        <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
        <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="from signup form" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
        </div>
    </form>

---

在前端公开API密钥不是一个好主意。您可以按照此方法将用户添加到特定列表/受众

<!-- Please copy your form from Mailchimp Signup form ( condensed in your case ) or copy the form and input values from the form  -->
    <form action="Your url from signup form" method="get" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
        <label for="mce-EMAIL">Subscribe</label>
        <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
        <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="from signup form" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
        </div>
    </form>

---

在代码事件中。preventDefault（）不起作用，正在重定向到代码事件中的表单操作URL。preventDefault（）不起作用，正在重定向到表单操作URL。此方法将打开第二个表单，由Mailchimp设计。我希望保留我的自定义表单，直接提交到我的受众列表。不，它将提交表单而不重定向或其他任何内容。我测试了这段代码，它在没有任何重定向或任何东西的情况下工作得非常好。您可以用自己的方式设计此表单。如果您仍然希望保持现有表单不变。只需从Mailchip注册表单复制表单操作url，并使用我看到的给定jquery代码。谢谢你，阿克巴！这种方法将打开第二种形式，由Mailchimp设计。我希望保留我的自定义表单，直接提交到我的受众列表。不，它将提交表单而不重定向或其他任何内容。我测试了这段代码，它在没有任何重定向或任何东西的情况下工作得非常好。您可以用自己的方式设计此表单。如果您仍然希望保持现有表单不变。只需从Mailchip注册表单复制表单操作url，并使用我看到的给定jquery代码。谢谢你，阿克巴！