通过 HTML 表单 + JavaScript 向 MailChimp API 提交 JSON 结构答案

【问题标题】：Submitting JSON struct to MailChimp API via HTML form + JavaScript通过 HTML 表单 + JavaScript 向 MailChimp API 提交 JSON 结构
【发布时间】：2014-07-28 00:22:25
【问题描述】：

感谢您对我确信这是一个真正的基本打击的帮助。我正在设置一个简单的 Web 前端，以便我可以检查电子邮件地址是否已经是现有 MailChimp 列表的订阅者。现在我只想使用基本的 HTML 和 JavaScript。

我的 MailChimp API 密钥已检出，我可以运行只需要字符串数据的查询，但相关的 API 调用需要电子邮件地址的结构，并且我在以下代码的任何变体中不断收到错误。我已经安装了 node.js 并且只是从命令行运行它并且查询确实使用相同的数据，所以我确定我只是 this 关闭，但需要帮助您克服困难。

这里是脚本和表单的相关sn-p。正如所写，我收到以下错误消息作为回复：验证错误：{\“电子邮件\”：\“请输入结构\/关联数组\“}”}

<script type="text/javascript">
function collectAndSubmit() {
        var emailAddy = document.getElementById("emailAddy").value;
        var JSONemail = {"email":
                            {
                                "email": emailAddy
                            }
                        };
        document.getElementById("email").value = JSONemail;
        document.getElementById("apikey").value ="M*Y*A*P*I*K*E*Y"
        document.testform.submit();
}
</script>
</head>
<body>
<form action="https://us2.api.mailchimp.com/2.0/helper/lists-for-email" method="post" name="testform">
    Email Address: <input type="text" id="emailAddy" name="emailAddy" />
    <input type="hidden" id="apikey" name="apikey" />
    <input type="hidden" id="email" name="email" />
    <br>
    <input type="button" value="Check Email" onclick="collectAndSubmit()" />
</form>
</body>
</html>

提前感谢您的帮助。

【问题讨论】：

更正/功能代码片段减少了很多，因为电子邮件数据现在可以直接从表单中直接传递，而不是在 javascript 中组装。这是更正的输入表单条目：电子邮件：

标签： javascript json mailchimp

【解决方案1】：

您的表格不正确。你可以看看他们的documentation。您必须设置他们所谓的email struct，这实际上是一个数组。您的电子邮件输入属性应类似于 <input type="text" id="email" name="email[email]">。

注意email[email]，它将使数据看起来像"email": {"email": "input value"}

此外，如果您的 api 密钥应该是秘密，那么将其隐藏在 html 表单中并不是一个好主意。

【讨论】：

非常感谢——这就是问题所在；我一直在阅读他们的文档，只是不知道如何传递结构。我将使用更正的版本更新原始帖子中的代码片段。如果您可以再花点时间进行跟进，您提到将确实应该是私有的 api 密钥作为隐藏字段放置不是一个好主意，我绝对同意。在这个基本设置中最好的选择是什么，或者我真的需要以某种方式在服务器端处理这个？
@Bret 是的，如果 api 密钥是秘密的，它必须存在于服务器端。因此，您的服务器端语言将创建 api 调用，您的表单只需提交到您的服务器。