如何使用JavaScript通过Mandrill发送电子邮件?

6
我已经按照 这篇文章 的指引,使用 Mandrill 发送邮件的 JavaScript 代码,但是在控制台中出现了以下错误:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://mandrillapp.com/api/1.0/messages/send.json. This can be fixed by moving the resource to the same domain or enabling CORS. 以下是我的代码:
$('#submitEmail').click(function() {
  $.ajax({
    type: "POST",
    url: "https://mandrillapp.com/api/1.0/messages/send.json",
    data: {
      'key': 'my_api_key',
      'message': {
        'from_email': 'test@hotmail.com',
        'to': [{
          'email': 'test@gmail.com',
          'name': 'RECIPIENT NAME (OPTIONAL)',
          'type': 'to'
        }],
        'autotext': 'true',
        'subject': 'test',
        'html': 'test'
      }
    }
  }).done(function(response) {
    console.log(response);
  });
});

“我做错了什么?”

1
请记住,您的 API 密钥对所有人都是可见的,因此任何恶意用户都可以使用您的密钥发送电子邮件,可能会消耗您的配额/发送垃圾邮件给很多人,并导致您的账户被封锁。 - baao
3个回答

4

不要使用POST请求,你应该在标签中包含Mandrill API


这是一个巨大的安全问题。您永远不应该公开暴露您的API密钥。 - David Baucum

4
很棒,这里有一个使用Jquery发送表单的解决方案。 :)
我试图使用jquery+mandrill在我的网站上创建联系表格。我没有发现上面的答案有用(不冒犯你啊兄弟),所以我希望我的答案可以澄清这个问题。我得到了我的好朋友和开发者Thomas Lane @d00by的帮助。
请看下面的表格和下面的javascript代码。
- 创建表格 - 使用ajax提交表格 - 返回false - 在提交时调用函数。
为了使用mandrill,您需要一个API密钥。
<form id="contact-form" method="POST" action="" onsubmit="return   submitContactForm();" class="margin-top" role="form">

                <div class="row">
                    <div class="form-group">
                        <i class="fa fa-check-circle fa-2 check" aria-hidden="true"></i>
                        <input id="form_name" type="text" name="name" class="form-control" placeholder="Full Name" required="required" data-error="Firstname is required.">
                    </div>
                </div>

                <div class="row">
                    <div class="form-group">
                        <i class="fa fa-check-circle fa-2 check" aria-hidden="true"></i>
                        <input id="form_email" type="text" name="name" class="form-control" placeholder="Email" required="required" data-error="E-mail is required.">
                    </div>
                </div>

                <div class="row">
                    <div class="form-group">
                        <i class="fa fa-check-circle fa-2 check" aria-hidden="true"></i>
                        <input id="form_phone" type="text" name="name" class="form-control" placeholder="Phone" required="required" data-error="Phone Number is required.">
                    </div>
                </div>

                <div class="row">
                    <div class="form-group">
                        <i class="fa fa-check-circle fa-2 check" aria-hidden="true"></i>
                        <textarea id="form_message" name="message" class="form-control" placeholder="Message" rows="2" required="required" data-error="Please,leave us a message."></textarea>
                    </div>
                </div>
                     <button class="btn btn-primary text-center submit" type="submit">Send</button>
            </form>



     function submitContactForm() {
         /*var name = $('#form_name').val();
  var email = $('#form_email').val();
  var phone = $('#form_phone').val();
  var message =$('#form_message').val();*/

//this is the html template. You can also do it as used above. But is much simpler done as below

 var htmlMessage = 'Contact form<br/>' +
    'Name: '+$('#form_name').val()+'<br/>'+
    'EMail: '+$('#form_email').val()+'<br/>'+
    'Message<br/>'+
    $('#form_message').val();

//submit the form using ajax
  $.ajax({
  type: "POST",
  url: "https://mandrillapp.com/api/1.0/messages/send.json",
  data: {
    "key": 'Your API key here',
    "message": {
      "from_email": 'your email',
      "to": [
        {
          "email": 'form email',
          "name": 'name',
          "type": 'to'
        }
      ],
      "subject": 'Subject',
      "html": htmlMessage
    }
  }
});

  return false;
}

现在是否可用? - Hiroto
这样做是否仍会暴露您的 API 密钥? - lacostenycoder

2

出于安全考虑,设计上不允许从浏览器访问Mandrill API。你能想象如果API密钥暴露在网站上会带来的风险吗?

您需要向服务器发起AJAX请求,然后从后端应用程序代码调用Mandrill API。


2
不幸的是,目前许多人可以自由地使用它而没有任何后果。 - GorillaApe

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接