javascript - 如何使用 Gmail API 和 Javascript 发送结构化电子邮件标记？

我正在尝试构建一个 Javascript 应用程序，该应用程序使用 Gmail 的 API 发送电子邮件(给我自己)，其中包括 Gmail 收件箱识别酒店预订所需的结构化数据。目标是能够在 HTML 表单中输入有关预订的详细信息，并让应用程序向我发送一封电子邮件，然后收件箱将其识别为酒店预订并将旅行包添加到我的收件箱。

我遵循了一个工作示例 here ，它使用 Google Apps 脚本从我的帐户向自己发送电子邮件。该脚本以 html 格式从文件中提取正文，包括 JSON 格式的必要结构化数据。这工作正常，收件箱识别酒店预订。

这是 Apps 脚本代码:

function manuallyCreateTrips() {
  var htmlBody = HtmlService.createHtmlOutputFromFile('hotel').getContent();

  MailApp.sendEmail({
    to: Session.getActiveUser().getEmail(),
    subject: 'Somewhere ' + new Date(),
    htmlBody: htmlBody,
  });
}

这是电子邮件 (hotel.html) 的 html 内容:

<html>
  <body>
    <script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LodgingReservation",
  "reservationNumber": "None",
  "reservationStatus": "http://schema.org/Confirmed",
  "underName": {
    "@type": "Person",
    "name": "Richard Guy"
  },
  "reservationFor": {
    "@type": "LodgingBusiness",
    "name": "Somewhere",
    "address": {
      "@type": "PostalAddress",
      "streetAddress": "Street",
      "addressLocality": "Locality",
      "addressRegion": "Region",
      "postalCode": "Postcode",
      "addressCountry": "UK"
    },
    "telephone": "+44 1234 123123"
  },
  "checkinDate": "2016-04-27T13:00:00+01:00",
  "checkoutDate": "2016-04-28T12:00:00+01:00"
}
</script>


    <p>
      This is a hotel reservation at Somewhere.
    </p>
  </body>
</html>

但与其手动输入 JSON，我想要一个更漂亮的界面。因此，我开始使用 Gmail 的 API 在 Javascript 中构建一个简单的电子邮件客户端，遵循工作示例 here 。客户端可以正常发送电子邮件，然后我会在我的 Gmail 帐户中收到这些电子邮件。

以下是组装和发送电子邮件的功能:

function sendEmail()
{
  $('#send-button').addClass('disabled');

  sendMessage(
    {
      'To': $('#compose-to').val(),
      'Subject': $('#compose-subject').val(),
      'Content-Type': 'text/html; charset=utf-8',
    },
    $('#compose-message').val(),
    composeTidy
  );

  return false;
}

function sendMessage(headers_obj, message, callback)
{
  var email = '';

  for(var header in headers_obj)
    email += header += ": "+headers_obj[header]+"\r\n";

  email += "\r\n" + message;

  var sendRequest = gapi.client.gmail.users.messages.send({
    'userId': 'me',
    'resource': {
      'raw': window.btoa(email).replace(/\+/g, '-').replace(/\//g, '_')
    }
  });

  return sendRequest.execute(callback);
}

函数 sendEmail() 调用 sendMessage()，传递一个包含标题行的对象、一个包含电子邮件(html 格式)内容的字符串，以及一个用于事后整理的回调函数。 sendMessage() 将 header 与内容结合起来，并将批处理编码为 base64。我发送与以前相同的电子邮件的 html 内容，电子邮件到达我的收件箱。正文中的任何 html 格式都正确显示在我的电子邮件查看器中。但 Gmail 的收件箱似乎没有接收结构化数据，因此预订不会添加到新行程中。

当我比较两封电子邮件的来源时，我可以看到标题的显着差异。

这是成功的电子邮件:

Received-SPF: pass (google.com: domain of 3vEwaVwsJC30sjdibseuhvzhnbjm.dpnsjdibseuhvzhnbjm.dpn@maestro.bounces.google.com designates 2607:f8b0:4003:c01::248 as permitted sender) client-ip=2607:f8b0:4003:c01::248;
MIME-Version: 1.0
Message-ID: <001a11c1fabe608d4f0531150d8c@google.com>
Date: Fri, 22 Apr 2016 16:09:32 +0000
Subject: Somewhere Fri Apr 22 2016 17:09:31 GMT+0100 (BST)
From: my@gmail.com
To: my@gmail.com
Content-Type: multipart/alternative; boundary=001a11c1fabe608d370531150d89

--001a11c1fabe608d370531150d89
Content-Type: text/plain; charset=ISO-8859-1; format=flowed; delsp=yes

Somewhere

--001a11c1fabe608d370531150d89
Content-Type: text/html; charset=ISO-8859-1

<html>
  <body>
    <script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LodgingReservation",
  "reservationNumber": "None",
  "reservationStatus": "http://schema.org/Confirmed",
  "underName": {
    "@type": "Person",
    "name": "Richard Guy"
  },
  "reservationFor": {
    "@type": "LodgingBusiness",
    "name": "Somewhere,
    "address": {
      "@type": "PostalAddress",
      "streetAddress": "Address",
      "addressLocality": "Locality",
      "addressRegion": "Region",
      "postalCode": "Postcode",
      "addressCountry": "Country"
    },
    "telephone": "+12 1234 606630"
  },
  "checkinDate": "2016-04-23T13:00:00+01:00",
  "checkoutDate": "2016-04-24T12:00:00+01:00"
}
</script>


    <p>
      Somewhere
    </p>
  </body>
</html>
--001a11c1fabe608d370531150d89--

这是 Javascript 应用使用 Gmail API 发送的电子邮件:

Received: from 760084270114
    named unknown
    by gmailapi.google.com
    with HTTPREST;
    Sat, 23 Apr 2016 09:43:29 -0400
To: my@gmail.com
Subject: Test reservation
Content-Type: text/html; charset=utf-8
Date: Sat, 23 Apr 2016 09:43:29 -0400
Message-Id: <CAD=04YmCHxH6mPY6FgoKLKFXd=C5sTLjQeo-9Q70jWKe4wVsRQ@mail.gmail.com>
From: my@gmail.com

<html>
  <body>
    <script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LodgingReservation",
  "reservationNumber": "None",
  "reservationStatus": "http://schema.org/Confirmed",
  "underName": {
    "@type": "Person",
    "name": "Richard Guy"
  },
  "reservationFor": {
    "@type": "LodgingBusiness",
    "name": "Somewhere,
    "address": {
      "@type": "PostalAddress",
      "streetAddress": "Address,
      "addressLocality": "Locality",
      "addressRegion": "Region",
      "postalCode": "Postcode",
      "addressCountry": "UK"
    },
    "telephone": "+12 3456 606630"
  },
  "checkinDate": "2016-04-23T13:00:00+01:00",
  "checkoutDate": "2016-04-24T12:00:00+01:00"
}
</script>


    <p>
      Somewhere
    </p>
  </body>
</html>

有任何想法吗？？

最佳答案

最后，我发现在 Google Apps Script (GAS) 网络应用程序中使用客户端 JavaScript 和 Bootstrap 样式来实现一个相当完善的前端表单非常简单。服务器端函数处理发送嵌入结构化数据的电子邮件。作为 GAS 的 MailApp.sendEmail()功能对电子邮件进行数字签名，这是成功的。我已将生成的代码放在 GitHub 上并发布了网络应用 here .感谢您的建议!

关于javascript - 如何使用 Gmail API 和 Javascript 发送结构化电子邮件标记？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36811483/

javascript - 如何使用 Gmail API 和 Javascript 发送结构化电子邮件标记？

上一篇：javascript - Angular js 无法正常工作解决方法

下一篇：javascript - 我无法使用 javascript 或 jquery 从 div 获取纯文本