biblio-docs/biblio-player-ui.md

2.5 KiB
Raw Blame History

Ядро плеера аудиокниг (biblio-player-core)

Модуль предназначен для разработки плеера с кастомным интерфейсов.

Вариант №1. Подключение через iFrame

<iframe	style="width:100%;max-width:560px;height:320px;border:none;"
	src="https://pub-cdn.bibliovk.ru/biblio-player-ui/latest/iframe/?book_id=BOOK_ID&referal_key=REFERAL_KEY&user_key=USER_KEY">
</iframe>

Необходимо заменить значения переменных:

  • BOOK_ID - идентификатор книги. Сервис для поиска ID книги
  • REFERAL_KEY - авторизационный ключ реферала, выдающийся в личном кабинете
  • USER_KEY - авторизационный ключ пользователя реферала, формирующийся в back-end части реферала по алгоритму. При неавторизованном пользователе указываем null. Как сгенерировать user_key?

Вариант №2. Подключение скриптов

Подключаем VUE 2

<script src='https://cdn.jsdelivr.net/npm/vue@2.6.14'></script>

Подключаем виджет

<script src='https://pub-cdn.bibliovk.ru/biblio-player-ui/latest/biblio-player-ui.js'></script>
<link rel='stylesheet' href='https://pub-cdn.bibliovk.ru/biblio-player-ui/latest/biblio-player-ui.css'/>

Иницализируем виджет

<div id="bblpl">
	<biblio-player referal-key="REFERAL_KEY" user-key="USER_KEY" book-id="BOOK_ID"/>
	<script>new Vue({ components: { biblioPlayer } }).$mount("#bblpl")</script>
</div>

Необходимо заменить значения переменных:

  • BOOK_ID - идентификатор книги. Сервис для поиска ID книги
  • REFERAL_KEY - авторизационный ключ реферала, выдающийся в личном кабинете
  • USER_KEY - авторизационный ключ пользователя реферала, формирующийся в back-end части реферала по алгоритму. При неавторизованном пользователе указываем null. Как сгенерировать user_key?