nezov009 0 Posted February 28, 2020 Report Share Posted February 28, 2020 Приветствую! Возможно ли создать приложение на андроид под движок DLE? В интернете мало информации, походу даже не один сайт не имеет мобильного приложения под DLE. Я уже начинаю жалеть о том, что я перешёл на DLE в сентябре 2019. До этого я был на WordPress, причиной перехода стало недостаточно функций, а именно регистрация, добавления записи (пользователями). Плагины влияли на скорость сайта, у меня было 28 активных плагинов, которые были нужны для работы функций. С посещаемостью было в среднем 200-300 уникальных в сутки. После перехода на DLE посещаемость выросла, и сейчас оно начинает расти. На тот момент DLE для меня был хорошим движком в плане регистрации и добавления записей от пользователей. Также скорость страниц быстрая. Quote Link to post Share on other sites
woolfon 50 Posted February 28, 2020 Report Share Posted February 28, 2020 Вобщем если речь идет о переносе веб в приложение, то поможет только WebView компонент, это какбэ браузер который работает только с вашим сайтом, есть минусы. Почитайте в интернете. Также можно создать manifest.json и вынести ярлык сайта на рабочий стол, после чего он будет открываться без браузерной строки поиска и прочих панелей, напоминая собой приложение. У меня был подобный опыт, я сделал отдельное представление для своего сайта и вынес его в отдельный url, после чего создал приложение с webview которое открывало этот url. ps. Или речь идет о создании API из под DLE чтобы нативное приложение с ним общалось? Quote Link to post Share on other sites
petroff 646 Posted February 28, 2020 Report Share Posted February 28, 2020 4 часа назад, woolfon сказал: Также можно создать manifest.json и вынести ярлык сайта на рабочий стол, после чего он будет открываться без браузерной строки поиска и прочих панелей, напоминая собой приложение Как это сделать, ссылки на почитать есть? Quote Link to post Share on other sites
nezov009 0 Posted February 28, 2020 Author Report Share Posted February 28, 2020 9 часов назад, woolfon сказал: Или речь идет о создании API из под DLE чтобы нативное приложение с ним общалось Всмысле о создании?? API нет в DLE??? Тогда это что? Quote Link to post Share on other sites
woolfon 50 Posted March 1, 2020 Report Share Posted March 1, 2020 В 28.02.2020 в 7:11 PM, nezov009 сказал: Всмысле о создании?? API нет в DLE??? Тогда это что? Слушайте, я в дле не разбираюсь, вы вопрос сформулируйте более детально Quote Link to post Share on other sites
woolfon 50 Posted March 1, 2020 Report Share Posted March 1, 2020 В 28.02.2020 в 2:03 PM, petroff сказал: Как это сделать, ссылки на почитать есть? Долго пытался найти тот сайт-генератор manifest.json которым пользовался я, но так и не нашел. Но их много, в основном бурж. Ну или я так искал) Гуглится по словам "website to app", "manifest.json generator", "pwa builder". Ну там разберетесь. Для примера, на своем сайте я подключил во такой manifest.json: { "lang": "ru", "name": "Название сайта", "short_name": "site.kz", "start_url": "https://site.kz/", "display": "standalone", "background_color": "#fff", "description": "короткое описание сайта.", "icons": [{ "src": "img/touch/icon-48x48.png", "sizes": "48x48", "type": "image/png" }, { "src": "img/touch/icon-72x72.png", "sizes": "72x72", "type": "image/png" }, { "src": "img/touch/icon-96x96.png", "sizes": "96x96", "type": "image/png" }, { "src": "img/touch/icon-144x144.png", "sizes": "144x144", "type": "image/png" }, { "src": "img/touch/icon-192x192.png", "sizes": "192x192", "type": "image/png" }] } После чего, в андроиде открываем сайт через браузер и в меню браузера нажимаем "добавить на главный экран". После чего на рабочем столе появляется иконка нашего сайта и он открывается без браузерной строки поиска и прочих кнопок. petroff 1 Quote Link to post Share on other sites
petroff 646 Posted March 1, 2020 Report Share Posted March 1, 2020 3 часа назад, woolfon сказал: После чего на рабочем столе появляется иконка нашего сайта и он открывается без браузерной строки поиска и прочих кнопок. Прикольная плюшка. Странно, что я не знал о такой возможности. Осталось только кнопку для сайта сделать. В инете почему-то гуглятся кнопки только на js для popup окна, а popup и seo, считаю, редко совместимы Quote Link to post Share on other sites
woolfon 50 Posted March 1, 2020 Report Share Posted March 1, 2020 5 часов назад, petroff сказал: Прикольная плюшка. Странно, что я не знал о такой возможности. Осталось только кнопку для сайта сделать. В инете почему-то гуглятся кнопки только на js для popup окна, а popup и seo, считаю, редко совместимы не понял о какой кнопке идёт речь. Если про иконку, то это тотже favicon только лучшего качества и большего разрешения Quote Link to post Share on other sites
petroff 646 Posted March 1, 2020 Report Share Posted March 1, 2020 58 минут назад, woolfon сказал: не понял о какой кнопке идёт речь. Сделать кнопку на сайт, чтобы юзеры по клику добавляли иконку сайта на экран, а не ковырялись в браузере Quote Link to post Share on other sites
woolfon 50 Posted March 2, 2020 Report Share Posted March 2, 2020 17 часов назад, petroff сказал: Сделать кнопку на сайт, чтобы юзеры по клику добавляли иконку сайта на экран, а не ковырялись в браузере интересная идея, если будет решение дайте знать) Quote Link to post Share on other sites
petroff 646 Posted March 2, 2020 Report Share Posted March 2, 2020 2 часа назад, woolfon сказал: интересная идея, если будет решение дайте знать) Да я вряд ли что-то буду делать, пока не появится в работе подходящий сайт с большой постоянной аудиторией Quote Link to post Share on other sites
petroff 646 Posted April 5, 2020 Report Share Posted April 5, 2020 В 02.03.2020 в 9:42 AM, woolfon сказал: интересная идея, если будет решение дайте знать) Вроде вот решение. Надо пробовать woolfon 1 Quote Link to post Share on other sites
woolfon 50 Posted April 10, 2020 Report Share Posted April 10, 2020 В 05.04.2020 в 4:20 PM, petroff сказал: Вроде вот решение. Надо пробовать Сделал) хотя и пришлось повозиться. index.js и sw.js мне пришлось хранить в корне, потому, что если сохранить их например в /js/ то Service Worker не запускается. Целый день промучился и решил оставить в корне. Второй момент - это кэширование: self.addEventListener('install', function(e) { e.waitUntil( caches.open('video-store').then(function(cache) { return cache.addAll([ '/pwa-examples/a2hs/', '/pwa-examples/a2hs/index.html', '/pwa-examples/a2hs/index.js', '/pwa-examples/a2hs/style.css', '/pwa-examples/a2hs/images/fox1.jpg', '/pwa-examples/a2hs/images/fox2.jpg', '/pwa-examples/a2hs/images/fox3.jpg', '/pwa-examples/a2hs/images/fox4.jpg' ]); }) ); }); Например у меня сайт на Yii2 с заводским кэшем pagecache и формы работают через _csrf токен, и если кэшировать страницу еще и через sw.js, то формы взаимодействие пользователя с сайтом начинает глючить. Но как я понял кэширование в sw.js обязательно, без него не запустится service worker. Я пока что одну картинку лого добавил в массив cache.addAll и всё работает нормально. Пока еще не решил оставлять на сайте эту плюшку или нет, по этому собрал всё на соплях. Кстати я не использую саму html кнопку из примера. Мне понравилось только всплывающее нативное окно в мобильных браузерах. petroff 1 Quote Link to post Share on other sites
petroff 646 Posted April 10, 2020 Report Share Posted April 10, 2020 2 часа назад, woolfon сказал: Сделал) хотя и пришлось повозиться. index.js и sw.js мне пришлось хранить в корне, потому, что если сохранить их например в /js/ то Service Worker не запускается. Целый день промучился и решил оставить в корне. Второй момент - это кэширование: self.addEventListener('install', function(e) { e.waitUntil( caches.open('video-store').then(function(cache) { return cache.addAll([ '/pwa-examples/a2hs/', '/pwa-examples/a2hs/index.html', '/pwa-examples/a2hs/index.js', '/pwa-examples/a2hs/style.css', '/pwa-examples/a2hs/images/fox1.jpg', '/pwa-examples/a2hs/images/fox2.jpg', '/pwa-examples/a2hs/images/fox3.jpg', '/pwa-examples/a2hs/images/fox4.jpg' ]); }) ); }); Например у меня сайт на Yii2 с заводским кэшем pagecache и формы работают через _csrf токен, и если кэшировать страницу еще и через sw.js, то формы взаимодействие пользователя с сайтом начинает глючить. Но как я понял кэширование в sw.js обязательно, без него не запустится service worker. Я пока что одну картинку лого добавил в массив cache.addAll и всё работает нормально. Пока еще не решил оставлять на сайте эту плюшку или нет, по этому собрал всё на соплях. Кстати я не использую саму html кнопку из примера. Мне понравилось только всплывающее нативное окно в мобильных браузерах. Можете скинуть весь код? Я на вордпрессе пробовал, у меня много ошибок в index.js. Может, кстати, из-за того, что я совсем без кэширования делал Quote Link to post Share on other sites
woolfon 50 Posted April 10, 2020 Report Share Posted April 10, 2020 index.js (у меня он a2hs.js): if('serviceWorker' in navigator) { navigator.serviceWorker .register('/sw.js') .then(function() { console.log('Service Worker Registered'); }); } sw.js: self.addEventListener('install', function(e) { e.waitUntil( caches.open('pwa-store').then(function(cache) { return cache.addAll([ '/img/logo.svg' ]); }) ); }); self.addEventListener('fetch', function(e) { //console.log(e.request.url); e.respondWith( caches.match(e.request).then(function(response) { return response || fetch(e.request); }) ); }); manifest.webmanifest: { "display": "fullscreen", "background_color": "#fff", "description": "Услуги сантехника, электрика, плотника.", "icons": [ { "src": "img/touch/icon-48x48.png", "sizes": "48x48", "type": "image/png" }, { "src": "img/touch/icon-72x72.png", "sizes": "72x72", "type": "image/png" }, { "src": "img/touch/icon-96x96.png", "sizes": "96x96", "type": "image/png" }, { "src": "img/touch/icon-144x144.png", "sizes": "144x144", "type": "image/png" }, { "src": "img/touch/icon-192x192.png", "sizes": "192x192", "type": "image/png" } ], "name": "Муж на час - _site_.kz", "short_name": "_site_.kz", "start_url": "/" } в шаблоне подключаю: <head> ... <script src="a2hs.js" defer=""></script> <link rel="manifest" href="/manifest.webmanifest"> ... </head> При чем что a2hs.js на самом деле я не в head подключаю, а в конце страницы посредством объединения всех .js файлов в один, и работает нормально. Но при тестировании я использовал вариант как написал выше, и тоже работало нормально. petroff 1 Quote Link to post Share on other sites
petroff 646 Posted April 10, 2020 Report Share Posted April 10, 2020 1 час назад, woolfon сказал: index.js (у меня он a2hs.js): Магия. В адресной строке заработало. На кнопке так и не работаетUncaught TypeError: Cannot read property 'style' of null Ошибка в строках addBtn.style.display = 'none'; addBtn.style.display = 'block'; addBtn.addEventListener('click', (e) => { HTML <button class="add-button" style="margin-left:25px; background-color: white; color:red; padding: 0px;"> <i class="fa fa-mobile fa-2x""></i></button> JS let deferredPrompt; const addBtn = document.querySelector('.add-button'); addBtn.style.display = 'none'; window.addEventListener('beforeinstallprompt', (e) => { // Prevent Chrome 67 and earlier from automatically showing the prompt e.preventDefault(); // Stash the event so it can be triggered later. deferredPrompt = e; // Update UI to notify the user they can add to home screen addBtn.style.display = 'block'; addBtn.addEventListener('click', (e) => { // hide our user interface that shows our A2HS button addBtn.style.display = 'none'; // Show the prompt deferredPrompt.prompt(); // Wait for the user to respond to the prompt deferredPrompt.userChoice.then((choiceResult) => { if (choiceResult.outcome === 'accepted') { console.log('User accepted the A2HS prompt'); } else { console.log('User dismissed the A2HS prompt'); } deferredPrompt = null; }); }); }); Quote Link to post Share on other sites
petroff 646 Posted April 10, 2020 Report Share Posted April 10, 2020 (edited) Переподключил js в футер и все заработало. Полный код HTML <button class="add-button" style="margin-left:25px; background-color: white; color:red; padding: 0px;"><i class="fa fa-mobile fa-2x""></i></button> a2hs.js if('serviceWorker' in navigator) { navigator.serviceWorker .register('/sw.js') .then(function() { console.log('Service Worker Registered'); }); } let deferredPrompt; const addBtn = document.querySelector('.add-button'); addBtn.style.display = 'none'; window.addEventListener('beforeinstallprompt', (e) => { // Prevent Chrome 67 and earlier from automatically showing the prompt e.preventDefault(); // Stash the event so it can be triggered later. deferredPrompt = e; // Update UI to notify the user they can add to home screen addBtn.style.display = 'block'; addBtn.addEventListener('click', (e) => { // hide our user interface that shows our A2HS button addBtn.style.display = 'none'; // Show the prompt deferredPrompt.prompt(); // Wait for the user to respond to the prompt deferredPrompt.userChoice.then((choiceResult) => { if (choiceResult.outcome === 'accepted') { console.log('User accepted the A2HS prompt'); } else { console.log('User dismissed the A2HS prompt'); } deferredPrompt = null; }); }); }); sw.js self.addEventListener('install', function(e) { e.waitUntil( caches.open('pwa-store').then(function(cache) { return cache.addAll([ '/icon/cats-48-48.png' ]); }) ); }); self.addEventListener('fetch', function(e) { //console.log(e.request.url); e.respondWith( caches.match(e.request).then(function(response) { return response || fetch(e.request); }) ); }); manifest.webmanifest { "display": "fullscreen", "background_color": "#fff", "description": "", "icons": [ { "src": "/icon/cats-48-48.png", "sizes": "48x48", "type": "image/png" }, { "src": "/icon/cats-72-72.png", "sizes": "72x72", "type": "image/png" }, { "src": "/icon/cats-96-96.png", "sizes": "96x96", "type": "image/png" }, { "src": "/icon/cats-144-144.png", "sizes": "144x144", "type": "image/png" }, { "src": "/icon/cats-192-192.png", "sizes": "192x192", "type": "image/png" } ], "name": "", "short_name": "", "start_url": "" } Часть кода отсюда Edited April 12, 2020 by petroff Quote Link to post Share on other sites
Beauty 172 Posted July 16, 2020 Report Share Posted July 16, 2020 еще бы куки чтобы 2 раза не просило с одного устройства добавить Quote Link to post Share on other sites
t1nx 4 Posted August 31, 2020 Report Share Posted August 31, 2020 В 05.04.2020 в 1:20 PM, petroff сказал: Вроде вот решение. Надо пробовать Помогите разобраться как реализовать эту интересную фишку на DLE Quote Link to post Share on other sites
petroff 646 Posted August 31, 2020 Report Share Posted August 31, 2020 1 час назад, t1nx сказал: Помогите разобраться как реализовать эту интересную фишку на DLE От движка не зависит. Создаете 2 js файла и файл manifest.webmanifest. Содержимое файлов 2 постами выше. Файлы подключаете в head или футере, где будут работать. Код кнопки кнопки тоже копируете и вставляете в любое место страницы Quote Link to post Share on other sites
t1nx 4 Posted August 31, 2020 Report Share Posted August 31, 2020 Только что, petroff сказал: От движка не зависит. Создаете 2 js файла и файл manifest.webmanifest. Содержимое файлов 2 постами выше. Файлы подключаете в head или футере, где будут работать. Код кнопки кнопки тоже копируете и вставляете в любое место страницы Спасибо большое за разъяснения! Quote Link to post Share on other sites
t1nx 4 Posted August 31, 2020 Report Share Posted August 31, 2020 10 минут назад, petroff сказал: От движка не зависит. Создаете 2 js файла и файл manifest.webmanifest. Содержимое файлов 2 постами выше. Файлы подключаете в head или футере, где будут работать. Код кнопки кнопки тоже копируете и вставляете в любое место страницы Хотел уточнить правильно я понял и делаю, создал 3 файлы js (a2hs.js, sw.js, manifest.webmanifest) Их заливаю например в корень шаблона в папку JS и уже в самом шаблоне страницы вывожу следующим образом <script src="{THEME}/js/a2hs.js"></script> <script src="{THEME}/js/sw.js"></script> <script src="{THEME}/js/manifest.webmanifest"></script> И ставлю кнопку в нужном месте: <button class="add-button" style="margin-left:25px; background-color: white; color:red; padding: 0px;"><i class="fa fa-mobile fa-2x""></i></button> Если не так поправьте меня пожалуйста!) Quote Link to post Share on other sites
petroff 646 Posted August 31, 2020 Report Share Posted August 31, 2020 manifest.webmanifest подключаем так <link rel="manifest" href="{THEME}/js/manifest.webmanifest"> Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.