AMP-HTML почта - как связаться с сервером и получить json?
Можно ли использовать почтовый формат AMP-HTML для связи с сервером? Я не думаю, что это хорошо документировано. Есть некоторая информация о нормальном AMP-HTML, но не так много об электронной почте.
Эту почту я хочу отправить. Я хотел бы, чтобы секретное слово получалось с моего сервера, а не было жестко закодировано.
<!doctype html>
<html ⚡4email>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
<style amp4email-boilerplate>body{visibility:hidden}</style>
</head>
<body>
<!-- Store complex nested JSON data in <amp-state> elements. -->
<amp-state id="words">
<script type="application/json">
{
"SecretWord": "fetched"
}
</script>
</amp-state>
<p [text]="'Your word is: ' + currentWord + '.'">Click to show magic word</p>
<button on="tap:AMP.setState({currentWord: words['SecretWord']})">Show word</button>
</body>
</html>
1 ответ
Да, документации AMP4Email не так много. В последнее время, с большим количеством неудачных попыток, мне удалось завершить один из моих вариантов использования с помощью AMP4Email.
Вы можете обратиться к приведенному ниже примеру для достижения своей цели:
<!doctype html>
<html ⚡4email>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
<style amp4email-boilerplate>body{visibility:hidden}</style>
</head>
<body>
<amp-state id="fruits"
src="https://amp.dev/static/samples/json/related_products.json"></amp-state>
<p [text]="'My favorite fruit is : ' + favoriteFruit + '.'">Click to find my favorite fruit.</p>
<button on="tap:AMP.setState({favoriteFruit: fruits.items[0]['name']})">Show</button>
</body>
</html>
Я использовал API из примера ampproject.org
, который возвращает JSON items
фруктов. Но вы можете написать свой собственный API, который отправляет только ваши любимые слова.
Чтобы написать свой собственный сервис, вы должны быть очень осторожны с заголовками ответов. Если вы посмотрите заголовки ответа этого API, вы увидите некоторые заголовки, такие как access-...
а также amp-...
, Эти заголовки являются обязательными, если вы хотите использовать свой API/ сервис в AMP4Email.
Обязательные заголовки ответа:
AMP-Access-Control-Allow-Source-Origin: <value received in __amp_source_origin query param for your service>
Access-Control-Expose-Headers: AMP-Access-Control-Allow-Source-Origin
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token
Access-Control-Allow-Origin: <origin, e.g. 'https://mail.google.com', if your service is hit from GMail inbox)
PS: __amp_source_origin
заголовок добавлен GMail. Вы получите этот заголовок для всех запросов, поступающих от AMP4Email HTML.