Подключение комментариев
- Авторизация и выход пользователя.
- Отображение списка комментариев, который возвращается вашим API.
- Добавление комментария.
Добавить новый комментарий может только авторизованный пользователь. Чтобы такая возможность поддерживалась, подключите авторизацию.
Обучающее видео. Подключение авторизации и комментариев на Турбо‑страницах. Посмотреть видео 00:00 Введение 00:33 Особенности комментариев на Турбо‑страницах 01:16 Пример работы комментариев и авторизации 03:17 Как работает авторизация 04:34 Особенности, которые нужно учесть при создании ресурсов 05:24 Создание формы входа 08:38 Создание ресурса проверки авторизации 10:34 Создание ресурса для выхода 11:31 Подключение ресурсов авторизации в Вебмастере 13:15 Как работает ресурс списка комментариев 14:45 Создание ресурса списка комментариев 16:00 Как работает ресурс добавления комментария 17:08 Создание ресурса добавления комментария 18:58 Подключение ресурсов комментариев в Вебмастере 20:13 Заключение |
Обучающее видео. Подключение авторизации и комментариев на Турбо‑страницах. Посмотреть видео 00:00 Введение 00:33 Особенности комментариев на Турбо‑страницах 01:16 Пример работы комментариев и авторизации 03:17 Как работает авторизация 04:34 Особенности, которые нужно учесть при создании ресурсов 05:24 Создание формы входа 08:38 Создание ресурса проверки авторизации 10:34 Создание ресурса для выхода 11:31 Подключение ресурсов авторизации в Вебмастере 13:15 Как работает ресурс списка комментариев 14:45 Создание ресурса списка комментариев 16:00 Как работает ресурс добавления комментария 17:08 Создание ресурса добавления комментария 18:58 Подключение ресурсов комментариев в Вебмастере 20:13 Заключение |
Ниже описаны этапы подключения комментариев:
Шаг 1. Создайте ресурс, который возвращает список комментариев
*.yandex.*
, *.turbopages.org
.- Как работает
- Турбо‑страница отправляет GET-запрос к вашему ресурсу, чтобы получить список комментариев. URL страницы передается в query-параметре
ORIGINAL_URL
. Ресурс должен обработать полученный URL и вернуть список комментариев для страницы.Пример запроса, который отправляет Турбо‑страница:
GET https://example.ru/api/comments?ORIGINAL_URL={page}&limit={limit}&offset={offset}
ORIGINAL_URL — оригинальный URL страницы, для которой существует Турбо‑страница.
limit — максимальное число элементов в списке. Используется для реализации кнопки Показать еще.
offset — смещение в списке. Используется для реализации кнопки Показать еще.
- Что надо сделать
- Создайте ресурс, который обрабатывает полученный URL и возвращает список комментариев для страницы в формате JSON. Для ресурса необходимо разрешить Cross-Origin запросы с
*.yandex.*
,*.turbopages.org
.Внимание. Ресурс должен быть доступен по HTTPS-протоколу. - Ожидаемый ответ ресурса
- Код HTTP-ответа: 200.Пример JSON:
{ "offset": 0, "limit": 50, "total": 140, "comments": [ { "name": "Homer", "avatar": "https://some-domain.ru/some-avatar-image.png", "date": 1536210000, "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", "id": "1111", "replies": [ { "name": "Moe", "avatar": "https://some-domain.ru/another-avatar-image.png", "date": 1536210000, "content": "Phasellus interdum feugiat dui id facilisis.", "id": "2222", "answer_to": "1111" }, { "name": "Barney", "avatar": "https://some-domain.ru/yet-another-avatar-image.png", "date": 1536210000, "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", "id": "3333", "answer_to": "2222" } ] }, { "name": "Homer", "avatar": "https://some-domain.ru/some-avatar-image.png", "date": 1536210000, "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", "id": "55556" } ] }
Скопированоoffset
*Смещение в списке. Используется для реализации кнопки Показать еще.limit
*Максимальное число элементов в списке. Используется для реализации кнопки Показать еще.total
*Всего комментариев на странице.id
*Идентификатор комментария.name
*Имя пользователя.avatar
URL аватара пользователя.date
*Дата комментария (timestamp секунды в UNIX-формате).content
*Текст комментария в виде строки. Inline-тэги не поддерживаются.replies
Массив ответов.answer_to
Идентификатор корневого комментария.* Обязательный параметр
Пример ресурса доступен на GitHub.
Шаг 2. Создайте ресурс, который добавляет комментарий
*.yandex.*
, *.turbopages.org
.- Как работает
- Авторизованный пользователь заполняет форму комментария и отправляет его. Турбо‑страница отправляет POST-запрос к вашему ресурсу. Ресурс должен обработать запрос и сохранить комментарий в базе данных.
Пример запроса, который отправляет Турбо‑страница:
POST https://example.ru/api/comments?ORIGINAL_URL={page}&TURBO_ID={id}
ORIGINAL_URL — оригинальный URL страницы, для которой существует Турбо‑страница.
TURBO_ID — идентификатор пользователя, который отправил комментарий.
Пример комментария, который передается в теле POST-запроса:
{ "answer_to": "2222", "text": "lorem ipsum" }
Скопированоanswer_to
Идентификатор комментария.text
Текст комментария в виде строки. Inline-тэги не поддерживаются.Логин пользователя можно определить по TURBO_ID или Cookie.
- Что надо сделать
- Создайте ресурс, который:
- Доступен для Cross-Origin запросов с
*.yandex.*
,*.turbopages.org
. - Обрабатывает полученный URL.
- Сохраняет отправленный комментарий в базу данных.
- Возвращает ответ, если комментарий обработался успешно.
Внимание. Ресурс должен быть доступен по HTTPS-протоколу. - Ожидаемый ответ ресурса
В случае успеха ресурс должен возвращать:
Код HTTP-ответа: 200.Пример JSON:{ "id": "101231", "date": 1536210020 }
Скопированоid
Идентификатор комментария.date
Дата комментария (timestamp секунды в UNIX-формате).
Пример ресурса доступен на GitHub.
Шаг 3. Подключите комментарии
Чтобы подключить комментарии:
- В Вебмастере перейдите на страницу Собственное API комментирования.и выберите опцию
- Укажите ссылки на ресурсы:
- URL списка комментариев, например, https://example.ru/api/list-comments;
- URL для добавления комментария, например, https://example.ru/api/add-comments.Примечание. Если удобно, можно реализовать все на одном ресурсе, например, https://example.ru/api/comments.
- Сохраните изменения.
- Проверьте отображение комментариев в примере Турбо‑страницы.