1. 有効な AMP for Email マークアップを準備します。これが、メールでレンダリングされるテンプレートになります。マークアップは、
https://amp.gmail.dev/playground/ で検証できます。次に、サンプルの hello-world マークアップを示します。
<!doctype html>
<html 4email>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<style amp4email-boilerplate>body{visibility:hidden}</style>
</head>
<body>
Hello, AMP4EMAIL world.
</body>
</html>
2. メール本文として text/x-amp-html MIME パートをサポートする
メール ライブラリを準備します。node.js では、
Nodemailer を利用できます。サンプルのスニペットは、
こちらで公開されています。ダイナミック メールに API 呼び出しを含める場合は、
CORS 要件を満たす必要があります。
公式ドキュメント:
Gmail
https://developers.google.com/gmail/ampemail/security-requirements
Mail.ru
https://postmaster.mail.ru/amp
Outlook
https://docs.microsoft.com/en-gb/outlook/amphtml/
res.set({
'Access-Control-Allow-Origin': origin,
'AMP-Access-Control-Allow-Source-Origin': sourceOrigin,
'Access-Control-Allow-Source-Origin':
'AMP-Access-Control-Allow-Source-Origin',
'Access-Control-Expose-Headers':
'Access-Control-Allow-Origin' +
', AMP-Access-Control-Allow-Source-Origin' +
', Access-Control-Allow-Source-Origin'
});
3. Gmail でダイナミック メールをテストします。 Gmail では、Google チームが正式にホワイトリストに登録(手順 4)したメールアドレスを除き、ダイナミック メールのレンダリングは許可されません(代わりに HTML がレンダリングされます)。ただし、特定の Gmail アカウントでメールをテストする場合は、ダイナミック メール デベロッパー設定から
アドレスを指定してホワイトリストに登録できます。
https://developers.google.com/gmail/ampemail/testing-dynamic-email
4. Gmail でメール(送信者アドレス)のホワイトリスト登録を行い、エンドユーザーにダイナミック メールがレンダリングされるようにします。本番環境のメールで利用する準備ができたら、登録フォームに入力して
ampforemail.whitelisting@gmail.com に送信し、ホワイトリストへの登録を申請します。詳しいガイドは
こちらをご覧ください。