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

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

0 голосов
/ 22 ноября 2018

Я внедряю на нашем сайте форму для подписки на рассылку с надписью «скользящий при прокрутке», которая построена как нативная AMP.

Я добавил кнопку, которая скрывает 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"
}

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

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

Крис

1 Ответ

0 голосов
/ 23 ноября 2018

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

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

...