Jump to content
Search In
  • More options...
Find results that contain...
Find results in...

Ответы на часто задаваемые вопросы


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

 

Вопрос: Я сделал всё по инструкции, но баннер не появился!

Ответ: Убедитесь, что после активации модуля вы его разместили в макетах (схемах). Также рекомендую не спешить устанавливать какие-либо настройки ограничений работы модуля, например, установки ссылки или выбора группы покупателей. Также убедитесь, что очистили все кэши.

Для работы с модулями кэшев, нужно добавить эти страницы в исключения, какие части ссылки именно добавлять узнавайте в инструкциях этих модулей:

/index.php?route=extension/module/bus_app/notification

/index.php?route=extension/module/bus_app/push

/index.php?route=extension/module/bus_app/debug

/bus_app_install.js

 

Вопрос: У меня метрики перестали работать!

Ответ: Начиная с версии 1.0.10 появилась возможность указать ссылки на скрипты в исключения. Добавьте ссылки на скрипты метриков в поле "Ссылки на исключение из кэша" или отключите CacheStorage.

Скрытый текст
https://vk.com
https://www.instagram.com/alettools/
https://code-ya.jivosite.com
https://code.jivosite.com
https://node-ya6.jivosite.com
https://files.jivosite.com
https://www.gstatic.com
https://www.googletagmanager.com
https://www.google-analytics.com
https://www.google.com
https://mc.yandex.ru
https://connect.facebook.net
https://schema.org
/manifest.json
/index.php?route=product/search

 

 

Вопрос: Как настроить Push-уведомления?

Ответ: Начиная с версии 1.0.10 появилась возможность настроить Push-уведомления от сервиса FireBase

Включите в настройках push-уведомления, выберите из списка какие уведомления будете отправлять. Выберите из списка доступный сервис, например, FireBase.

На сайте FireBase создайте проект. Зайдите в настройки проекта во вкладку "Cloud messaging" сгенерируйте публичный и приватный ключ (key pair). Скопируйте с этой страницы

"srever key" в поле модуля "API ключ", "key pair" в поле модуля "Публичный ключ". Перейдите во вкладку "General" нажмите на кнопку "</>" и создайте приложение для получения html-кода. Полученный код установите в поле модуля "API HTML-код". Сохраняйте настройки, из другого устройства пробуйте подписаться, а из текущего отправить уведомление.

API HTML-код рекомендую привести к такому виду, если нужно, чтобы ошибки от firebase не мешали работать в Internet Explorer:

Спойлер

Синхронный вариант:

<!--[if !(IE)]><!-->
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js" type="text/javascript"></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js" type="text/javascript"></script>
<script type="text/javascript">
if ('firebase' in window && 'messaging' in window.firebase && firebase.messaging.isSupported()) {
	firebase.initializeApp({
		apiKey: "rththhfghthhfht",
		authDomain: "trhrththrhtrh.firebaseapp.com",
		projectId: "thrthrthrth",
		storageBucket: "trtrtrt.appspot.com",
		messagingSenderId: "drgdrgdrgdrg",
		appId: "dfgdfgdfgrdgrgdg",
		measurementId: "drgdrgdrgdrgdrg"
	});
	document.dispatchEvent(new CustomEvent('busAppService', {bubbles: true}));
} else {
	window.addEventListener('busApp', function() {
		busApp.setting['push_status'] = false;
	});
}
</script>
<!--<![endif]-->

 

Асинхронный вариант:

<!--[if !(IE)]><!-->
<script type="text/javascript">
import('https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js').then(function() {
	import('https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js').then(function() {
		if ('firebase' in window && 'messaging' in window.firebase && firebase.messaging.isSupported()) {
			firebase.initializeApp({
				apiKey: "rththhfghthhfht",
				authDomain: "trhrththrhtrh.firebaseapp.com",
				projectId: "thrthrthrth",
				storageBucket: "trtrtrt.appspot.com",
				messagingSenderId: "drgdrgdrgdrg",
				appId: "dfgdfgdfgrdgrgdg",
				measurementId: "drgdrgdrgdrgdrg"
			});
			document.dispatchEvent(new CustomEvent('busAppService', {bubbles: true}));
		} else {
			window.addEventListener('busApp', function() {
				busApp.setting['push_status'] = false;
			});
		}
	});
});
</script>
<!--<![endif]-->

 

 

<!--[if !(IE)]><!-->
<script type="text/javascript">
function busAppLoadScript(url, callback) {
	var s = document.createElement('script');
	s.type = 'text/javascript';
	s.src = url;
	if (typeof callback !== 'undefined') {
		s.onreadystatechange = callback;
		s.onload = callback;
	}
	document.head.appendChild(s);
}
busAppLoadScript('https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js', function() {
	busAppLoadScript('https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js', function() {
		if ('firebase' in window && 'messaging' in window.firebase && firebase.messaging.isSupported()) {
			firebase.initializeApp({
				apiKey: "rththhfghthhfht",
				authDomain: "trhrththrhtrh.firebaseapp.com",
				projectId: "thrthrthrth",
				storageBucket: "trtrtrt.appspot.com",
				messagingSenderId: "drgdrgdrgdrg",
				appId: "dfgdfgdfgrdgrgdg",
				measurementId: "drgdrgdrgdrgdrg"
			});
			document.dispatchEvent(new CustomEvent('busAppService', {bubbles: true}));
		} else {
			window.addEventListener('busApp', function() {
				busApp.setting['push_status'] = false;
			});
		}
	});
});
</script>
<!--<![endif]-->

 

 

 

Вопрос: Как опубликовать приложение PWA в Google Play, App Store и Microsoft Store? 

Ответ: Для Google Play и Microsoft Store есть сервис https://blog.pwabuilder.com/docs/generating-your-android-package/ по созданию TWA приложения, возможно это подойдёт и для App Store. Механизм создания TWA из админ панели скорее будет разработан по средством API.

Google Play: https://blog.pwabuilder.com/docs/android-platform/

Microsoft Store: https://blog.pwabuilder.com/docs/windows-platform/

App Store: https://blog.pwabuilder.com/docs/ios-platform/

 

Вопрос: Всё настроил, но приложение не предлагает установки.

Ответ: К сожалению в manifest.json должна быть хотя бы одна иконка размером 144х144 в формате png, поэтому устанавливайте иконку в целом в этом формате.

 

Вопрос: Не выводится оповещение о статусе подключения.

Ответ: Оповещение выводится на тех страницах, где установлен в макетах (схемах) баннер приложения.

Вы можете создать отдельный HTML модуль для вывода оповещения.

Скрытый текст
<style type="text/css">
/* необходимые стили */
#bus-app-line[hidden="true"],
#bus-app-line [hidden="true"]{display:none !important}
#bus-app-line [data-message="offline"]{color:red}
#bus-app-line [data-message="online"]{color:limegreen}
/* стили которые можно изменять */
#bus-app-line{position:fixed;margin:0;padding:0;top:0;left:0;width:100%;z-index:10000000000}
#bus-app-line .close{position:absolute;z-index:1000;right:6px;top:6px;height:24px;width:24px;cursor:pointer}
#bus-app-line .box{position:absolute;align-content:center;justify-content:center;width:100%;min-height:130px;font-size:18px;text-align:center;color:#fff;cursor:pointer;text-shadow:0 -1px 0 rgba(0,0,0,0.25);background:#232323;padding:15px;z-index:999}
#bus-app-line .box .line{width:100%}
</style>
<script type="text/javascript">
window.addEventListener('busAppBefore', function() {
	var button = document.querySelector('#bus-app');
	if (!button) {
		var s = document.createElement('div');
		s.id = 'bus-app';
		s.style['display'] = 'none';
		s.innerHTML = '<div data-button="install"></div><div data-button="notification"></div>';
		document.body.appendChild(s);
	}
	var button = document.querySelector('#bus-app-line');
	if (!button) {
		var s = document.createElement('div');
		s.id = 'bus-app-line';
		s.setAttribute('hidden', '');
		s.innerHTML = '<div onclick="busApp.close(\'bus-app-line\');" data-close="bus-app-line"><img src="image/catalog/bus_app/close.png" width="32" height="32" alt="<?php echo $button_bus_app_close; ?>" title="<?php echo $button_bus_app_close; ?>" class="close"></div><div class="box" data-box=""><div class="line" data-message="offline"></div>';
		document.body.appendChild(s);
	}
});
</script>

 

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

Чтобы убрать или выводить определённые элементы сайта для разных режимов отображения, то правила стилей заворачивайте в такой код - где:

/* Отображать как в браузере - до установки приложения */
@media all and (display-mode: browser) {

}
/* Отображать с минимальным функциионалом (в ios не работает) - после установки приложения */
@media all and (display-mode: minimal-ui) {

}
/* Отображать в автономном режиме - после установки приложения */
@media all and (display-mode: standalone) {

}
/* Отображать во весь экран - после установки приложения */
@media all and (display-mode: fullscreen) {

}

 

Чтобы убрать или выводить определённые элементы сайта для разных режимов сети, то правила скриптов заворачивайте в такие события - где:

// интернет пропал
window.addEventListener('offline', function() {

});

// интернет появился
window.addEventListener('online', function() {

});

 

С версии 1.0.8+ появилось событие которое происходит, когда код скрипта загружен и может выполнить ваш код. Это на случай, если найдёте полезным использовать функции модуля, например, window.busApp.ajax(), window.busApp.md5() и window.busApp.setting.

document.addEventListener('busApp', function(e) {
	console.log('BusApp - запущен, значит можем использовать функции BusApp: ', window.busApp);
});

window.addEventListener('busApp', function(e) {
	console.log('BusApp - запущен, значит можем использовать функции BusApp: ', window.busApp);
});

document.addEventListener('busAppNotification', function(e) {
	console.log('Функция Notification - запущена, значит можем выполнить ваш код: ', window.busApp);
});

window.addEventListener('busAppNotification', function(e) {
	console.log('Функция Notification - запущена, значит можем выполнить ваш код: ', window.busApp);
});

 

 

С версии 1.0.8+ скрипт для инициализации нажатия кнопки подписаться:

window.addEventListener('busAppBefore', function() {
	var button = document.querySelector('#bus-app');
	if (!button) {
		var s = document.createElement('div');
		s.id = 'bus-app';
		s.setAttribute('style', 'display:none');
		s.innerHTML = '<button data-button="install"></button><button data-button="notification"></button>';
		document.body.appendChild(s);
	}
});

window.addEventListener('busAppNotification', function() {
	if (Notification.permission !== 'granted') {
		var button = document.querySelector('#bus-app [data-button="notification"]');
		if (button) {
			button.click();
		}
	}
});

 

C версии 1.0.10+ появилась возможность чистить кэш модуля из своего приложения:

Рекомендую использовать этот модуль и указать там ссылку:

https://mysite.by/admin/index.php?route=extension/module/bus_app/clear&user_token=[user_token]&redirect=[route]

HTML:
<button 
type="button" 
onclick="window.location.href = 'https://mysite.by/admin/index.php?route=extension/module/bus_app/clear&token=fgddfgdfgdfhdfhdfh&redirect=extension/module/bus_cache';" 
data-toggle="tooltip" 
title="" 
class="btn btn-primary" 
style="background-color:#570fc2;" 
data-original-title="Очистить кэш PWA"><i class="fa fa-eraser"></i></button>

- где:
extension/module/bus_app/clear - роут модуля для 2.3.X-3.X
module/bus_app/clear - роут модуля для 2.0.X-2.2.X
extension/module/bus_cache - роут вашего модуля на который произойдёт редирект после чистки кэша.

PHP:
$message = $this->load->controller((version_compare(VERSION, '2.3.0', '>=') ? 'extension/' : false) . 'module/bus_app/clear');

 

С версии 1.0.10+ отправка пуш сообщения пользователю из админ панели:

			//account_id - получить из таблицы oc_bus_app_account по customer_id или session_id
			//array(1 => 'сообщение') - 1 это id языка

			/* bus_app */
			$file = DIR_CATALOG . 'controller/' . (version_compare(VERSION, '2.3.0', '>=') ? 'extension/' : false) . 'module/bus_app.php';
			if (is_file($file)) {
				include_once($file);
				$class = 'Controller' . (version_compare(VERSION, '2.3.0', '>=') ? 'Extension' : false) . 'ModuleBusApp';
				$message = (new $class($this->registry))->push(array(
					'type'       => 9,
					'account_id' => 1,
					'images'     => array(1 => 'catalog/images.png'),
					'titles'     => array(1 => 'заголовок'),
					'messages'   => array(1 => 'сообщение'),
					'urls'       => array(1 => 'ссылка')
				));
				// или
				$message = (new $class($this->registry))->push(array(
					'type'        => 9,
					'account_id'  => 1,
					'language_id' => 1,
					'image'       => 'catalog/images.png',
					'title'       => 'заголовок',
					'message'     => 'сообщение',
					'url'         => 'ссылка'
				));
			}
			/* bus_app */

 

С версии 1.0.10+ отправка пуш сообщения пользователю из каталога:

			//account_id - получить из таблицы oc_bus_app_account по customer_id или session_id
			//array(1 => 'сообщение') - 1 это id языка

			/* bus_app */
			$message = $this->load->controller((version_compare(VERSION, '2.3.0', '>=') ? 'extension/' : false) . 'module/bus_app/push', array(
				'type'       => 9,
				'account_id' => 1,
				'images'     => array(1 => 'catalog/images.png'),
				'titles'     => array(1 => 'заголовок'),
				'messages'   => array(1 => 'сообщение'),
				'urls'       => array(1 => 'ссылка')
			));
			// или
			$message = $this->load->controller((version_compare(VERSION, '2.3.0', '>=') ? 'extension/' : false) . 'module/bus_app/push', array(
				'type'        => 9,
				'account_id'  => 1,
				'language_id' => 1,
				'image'       => 'catalog/images.png',
				'title'       => 'заголовок',
				'message'     => 'сообщение',
				'url'         => 'ссылка'
			));
			/* bus_app */

 

 


Comments

С версии 1.0.12+ добавлена настройка window.busApp.setting['display'] - означает, что вы можете узнать в каком режиме экран пользователя: browser, minimal-ui, standalone, fullscreen - это даст понять через приложение-ли зашёл пользователь и исходя от этого скрыть или показать элемент сайта.

Пример использования:

window.addEventListener('busApp', function() {
	var button = document.querySelector('#bus-app');
	if (button) {
		var s = document.createElement('div');
		s.id = 'bus-app-success';
		document.body.appendChild(s);
		var success = document.querySelector('#bus-app-success');
		if (success && window.busApp.setting['display'] != 'browser') {
			success.innerHTML += '<div style="color:red">Приложение установлено</div>';
		}
		if (success && 'Notification' in window && Notification.permission === 'granted') {
			success.innerHTML += '<div style="color:red">Вы подписаны на уведомления</div>';
		}
	}
});

 

Share this comment


Link to comment
×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.