Внедрение файлов cookie на отключаемой вставной панели с помощью AMP

Question

На нашем сайте я создаю форму подписки на новостную рассылку, которая построена как AMP-native.

Я добавил кнопку, которая скрывает div при нажатии amp-bind, но я пытаюсь понять, как сохранить закрытое состояние с помощью cookie /localStorage в AMP.

Я просмотрел пример кода для любимой кнопки - https://ampbyexample.com/advanced/favorite_button/ (как рекомендовано здесь на SE), но я не понимаю, как это связано с этим конкретным вариантом использования, особенно с использование amp-list.

На основании прочитанного и нескольких примеров я обнаружил, что необходим атрибут credentials="include", а также допустимая конечная точка CORS json и автоматически сгенерированный идентификатор клиента, добавленный к URL-адресу конечной точки с помощью подстановки переменных AMP, но я не уверен, как собрать все это вместе.

Я попытался сделать что-то вместе, используя пример кнопки "Избранное", но в руководстве мало говорится о том, как настроить конечную точку CORS, и этот конкретный пример предназначен для хранения нескольких лайков в одной конечной точке, в отличие от сохранения просмотра определенных пользователей. предпочтения.

Вот мой грубый (ковыряющийся в темноте) удар по коду:

<form method="post"
id="side-newsletter-wrap"
action-xhr="/prefs&clientId=CLIENT_ID(prefs)"
target="_top"
on="submit:AMP.setState({
        showSideNewsletter: !showSideNewsletter
    });
    submit-error:AMP.setState({
        showSideNewsletter: !showSideNewsletter
    });">
    <button on="tap:side-newsletter-wrap.hide" class="close-button"><i     
    class="fa fa-times"></i></button>
    <amp-list width="320"
        height="360"
        credentials="include"
        items="."
        single-item
        src="/prefs&clientId=CLIENT_ID(prefs)">
        <template type="amp-mustache">
        {{#.}}
            <?php winefolly_load_fragment('newsletter-embed'); ?>
        {{/.}}
        {{^.}}{{/.}}
        </template>
    </amp-list>
</form>

Для конечной точки prefs, я думаю, мне нужно зарегистрировать новую конечную точку в WordPress, которая выводит простой массив с настройками?

Что-то вроде:

{
    showSideNewsletter: "true",
    winesIndexView: "grid",
    winesIndexSort: "title"
}

Я также попробовал компонент amp-user-Notification (который имеет встроенное закрытое состояние), но это показалось мне немного странным, и код встраивания новостной рассылки (через iframe) не загружался из-за известной ошибки - https://github.com/ampproject/amphtml/issues/18995).

Любые предложения будут высоко ценится.

Крис

Answer 1

Вы правы - правильный подход - уведомление пользователя. Есть ли способ реализовать форму рассылки в AMP, пока ошибка amp-iframe не будет исправлена?

Другой способ - использовать amp-access, который позволяет изменять макет страницы при загрузке страницы. Вы должны сохранить пользовательские настройки на стороне сервера, используя READER_ID для идентификации пользователя. Хранение на этой стороне сервера необходимо, так как вы не сможете писать куки, если страница обслуживается из кэша AMP из-за ITP 2.0.