Перейти к содержанию

Как добавить приложение для браузера в свой сайт?


Рекомендуемые сообщения

4 минуты назад, Zero108 сказал:

в globalTemplate 

речь же про сторонние сайты.
но, да, добавить нужен линк в тег head.
 

Ссылка на комментарий
Поделиться на другие сайты

by_ix Сложно понять Битрикс. Добавл ссылку и файл с картинками. Можете посмотреть, почему не работает?

https://russianpaintings.pro/

https://russianpaintings.pro/manifest/manifest.webmanifest

Ссылка на комментарий
Поделиться на другие сайты

@Zero108  "display": "minimal-ui".

и манифест в корне же должен быть. или там какая-то автонастройка для него есть? 

Ссылка на комментарий
Поделиться на другие сайты

by_ix Поменял ссылку и настройки https://russianpaintings.pro/manifest.webmanifest

Пока не работает.

Ссылка на комментарий
Поделиться на другие сайты

@Zero108 с телефона работает, с пк проверить не могу пока. 

Ссылка на комментарий
Поделиться на другие сайты

by_ix Можете посмотреть, работает у вас или нет? https://russianpaintings.pro/manifest.webmanifest

Ссылка на комментарий
Поделиться на другие сайты

Zero108 в head'е это тоже должно быть, browserconfig.xml особенно, скорее всего.

Спойлер

image.png.b4bd34177ca53d78a6d5a5db1a0a26a1.png

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

Ссылка на комментарий
Поделиться на другие сайты

by_ix Добавил ссылки и файлы. Что еще не хватает? view-source:https://russianpaintings.pro

 

view-sourcehttpsrussianpaintings.pro - Google Chrome.jpg

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

Ссылка на комментарий
Поделиться на другие сайты

Я не очень понимаю, чего вы хотите добиться, если ваш сервер не отдает манифест по указанному адресу? Кроме этой строки ничего не нужно для включения приложения (ну и иконок, загруженных в icons, если их нет, значок не появится). 

И зачем вам этот паровоз картинок после манифеста? msapplication-* вообще к этому отношения не имеет, это высеры интерфейса metro для IE и Edge.

Ссылка на комментарий
Поделиться на другие сайты

Desti я пытаюсь по аналогии с сайтом на Invision Community (IC) сделать. Там также в коде. Картинки я создал и ссылки на них добавил, как вы заметили, также как в коде сайта от IC. Манифест находится по адресу https://russianpaintings.pro/manifest.webmanifest в виде обычного файла.

192.168.1.52 russiannew - sftprussiannew192.168.1.52 - FileZilla.jpg

848419680_192_168.1.52russiannew-sftprussiannew192_168.1.52-FileZilla.thumb.jpg.87be401fdf13ced5ee121c24b8064419.jpg

Desti Заменил в коде на <link rel="manifest" href="/manifest.webmanifest">

Все файлы, указанные в ссылках, существуют. Код вставляется такой:

 

<link rel="manifest" href="/manifest.webmanifest">
<meta name="msapplication-config" content="/browserconfig.xml">
<meta name="msapplication-starturl" content="/">
<meta name="application-name" content="Russian Paintings Gallery">
<meta name="apple-mobile-web-app-title" content="Paintings by professional artists for sale and wholesale">
<link rel="icon" sizes="36x36" href="/upload/img/russianpaintings.pro_manifest/android-chrome-36x36.png">
<link rel="icon" sizes="48x48" href="/upload/img/russianpaintings.pro_manifest/android-chrome-48x48.png">
<link rel="icon" sizes="72x72" href="/upload/img/russianpaintings.pro_manifest/android-chrome-72x72.png">
<link rel="icon" sizes="96x96" href="/upload/img/russianpaintings.pro_manifest/android-chrome-96x96.png">
<link rel="icon" sizes="144x144" href="/upload/img/russianpaintings.pro_manifest/android-chrome-144x144.png">
<link rel="icon" sizes="192x192" href="/upload/img/russianpaintings.pro_manifest/android-chrome-192x192.png">
<link rel="icon" sizes="256x256" href="/upload/img/russianpaintings.pro_manifest/android-chrome-256x256.png">
<link rel="icon" sizes="384x384" href="/upload/img/russianpaintings.pro_manifest/android-chrome-384x384.png">
<link rel="icon" sizes="512x512" href="/upload/img/russianpaintings.pro_manifest/android-chrome-512x512.png">
<meta name="msapplication-square70x70logo" content="/upload/img/russianpaintings.pro_manifest/msapplication-square70x70logo.png"/>
<meta name="msapplication-TileImage" content="/upload/img/russianpaintings.pro_manifest/msapplication-TileImage.png"/>
<meta name="msapplication-square150x150logo" content="/upload/img/russianpaintings.pro_manifest/msapplication-square150x150logo.png"/>
<meta name="msapplication-wide310x150logo" content="/upload/img/russianpaintings.pro_manifest/msapplication-wide310x150logo.png"/>
<meta name="msapplication-square310x310logo" content="/upload/img/russianpaintings.pro_manifest/msapplication-square310x310logo.png"/>
<link rel="apple-touch-icon" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/upload/img/russianpaintings.pro_manifest/apple-touch-icon-180x180.png">

 

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

11 минут назад, Zero108 сказал:

https://russianpaintings.pro/manifest.webmanifest в виде обычного файла.

а вот и не правильно. Манифест должен отдаваться как как json, точнее иметь Content-Type: application/manifest+json; charset=UTF-8

Ссылка на комментарий
Поделиться на другие сайты

Desti Манифест был скопирован с сайта на IC в блокнот и потом залит в виде файла на сайт. Содержимое взято отсюда https://trips.a108.net/manifest.webmanifest/

Есть ли какие-то простые шаги, как настроить? Что нужно сделать?

Ссылка на комментарий
Поделиться на другие сайты

Я не знаком с битрикс, поэтому не знаю, что там можно сделать. 

У себя на сайте я отдаю манифест скриптом 

<?php
header("Content-Type: application/manifest+json; charset=UTF-8");
echo '{';
echo "\n"; echo '    "scope": "\/",';
echo "\n"; echo '    "name": "\u041c\u0435\....",';
echo "\n"; echo '    "theme_color": "#333332"';
echo "\n"; echo '}';

Ну и соотв. nginx настроен так, чтобы отдавать этот скрипт по /manifest.webmanifest 

location ~* manifest.webmanifest {
                access_log /dev/null;
                log_not_found off;
                error_log /dev/null;
                add_header Content-Type 'application/manifest+json; charset=UTF-8';
                try_files /wm/wm.php /wm/wm.php;
        }

 

Ссылка на комментарий
Поделиться на другие сайты

Desti а нельзя просто видоизменить обычный файл? Его обязательно скриптом отдавать? Автоматические программы https://www.simicart.com/manifest-generator.html/ для создания манифеста дают аналогичное содержание. Может где-то вот это дописать или еще что-то? header("Content-Type: application/manifest+json; charset=UTF-8");

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

25 минут назад, Zero108 сказал:

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

Файл это просто набор символов.

Когда вы отдаете контент файлом, сервер попробует по расширению подставить нужный тип контента, но если его нет в mime.types, отдаст дефолтный тип.

Варианты
1. указывать тип контента в локации nginx (как я выше показал). Там, правда, ошибка (скопировал что-то из старых экспериментов), php так отдать не получится, правильно будет так (без лишних строк): 

location ~* manifest.webmanifest {
                add_header Content-Type 'application/manifest+json; charset=UTF-8';
                try_files /wm/wm.txt /wm/wm.txt;
}

2. Добавить в mime.types строку 

application/manifest+json             webmanifest;

Тогда локация будет такая:

location ~* manifest.webmanifest {
                try_files /wm/wm.webmainfest /wm/wm.webmanifest;
}

После этого все файлы с этим расширением будут уходить с нужным content. 

Изменено пользователем Desti
Ссылка на комментарий
Поделиться на другие сайты

Немного смущает вот эта строка: try_files /wm/wm.txt /wm/wm.txt;

Что она означает? У меня манифест называется manifest.webmanifest и лежит в корне сайта.

В настоящее время в основной шаблон инклюдом вставляются все ссылки из файла head_custom.php. В него нельзя что-то прописать?

CUsersinfoAppDataLocalTempFileZillaPortableTempfz3temp-2head_custom.php - Notepad   [Administrator].jpg

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

2 минуты назад, Zero108 сказал:

try_files /wm/wm.txt /wm/wm.txt;

эта строка означает, что при обнаружении концевой ссылки в слешах, т.е. директории (/manifest.webmanifest/) надо показать первый аргумент, а при ссылке без слеша в конце, т.е. файла, показать второй аргумент. В обеих случаях это один файл. А как вы его назовете и где он лежит - совершенно не важно, у меня в корневой папке /wm/, вы можете оставить в корне и прописать try_files /manifest.webmanifest /manifest.webmanifest (с учетом предыдущего сообщения)

8 минут назад, Zero108 сказал:

В него нельзя что-то прописать?

Ну откуда я знаю, что это за файл.. Может и можно.

Ссылка на комментарий
Поделиться на другие сайты

Desti Добавил в /etc/nginx/vhosts/sites/russianpaintings.pro.conf в location в двух местах:

	location / {
		location ~ [^/]\.ph(p\d*|tml)$ {
			try_files /does_not_exists @fallback;
		}
		location ~* ^.+\.(jpg|jpeg|gif|png|svg|js|css|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar|swf)$ {
			try_files $uri $uri/ @fallback;
		}
		location / {
			try_files /does_not_exists @fallback;
		}
		location ~* manifest.webmanifest {
                add_header Content-Type 'application/manifest+json; charset=UTF-8';
                try_files /manifest.webmanifest /manifest.webmanifest;
		}
	}

Перезапустил nginx. Что-то ничего не поменялось.

view-source:https://russianpaintings.pro

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

6 часов назад, Desti сказал:

ваш сервер не отдает манифест по указанному адресу

разве не отдаёт? браузер телефона же видит его, иначе бы не получилось создать ярлык.

Ссылка на комментарий
Поделиться на другие сайты

1 минуту назад, by_ix сказал:

разве не отдаёт? браузер телефона же видит его, иначе бы не получилось создать ярлык.

Цель - в адресной строке браузера на десктопе кнопка. 

Ссылка на комментарий
Поделиться на другие сайты

Desti Попробовал второй вариант:

Добавил в /etc/mime.types

742073304_CUsersinfoAppDataLocalTempFileZillaPortableTempfz3temp-2mime.types-NotepadAdministrator.thumb.jpg.d8b265828d97561f5b965fde57c9d789.jpg

Затем перезапустил апач.

Добавил в /etc/nginx/vhosts/sites/russianpaintings.pro.conf в location в двух местах:

	location / {
		location ~ [^/]\.ph(p\d*|tml)$ {
			try_files /does_not_exists @fallback;
		}
		location ~* ^.+\.(jpg|jpeg|gif|png|svg|js|css|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar|swf)$ {
			try_files $uri $uri/ @fallback;
		}
		location / {
			try_files /does_not_exists @fallback;
		}
		location ~* manifest.webmanifest {
                add_header Content-Type 'application/manifest+json; charset=UTF-8';
                try_files /manifest.webmanifest /manifest.webmanifest;
		}
		location ~* manifest.webmanifest {
               try_files /manifest.webmanifest /manifest.webmanifest;
		}
	}

Перезапустил nginx. Пока ничего не поменялось.

Изменено пользователем Zero108
Ссылка на комментарий
Поделиться на другие сайты

Можно попробовать добавить третий раз, только зачем? Последний локейшн переопределит все предыдущие. Достаточно первого блока, если не добавляли тип в mime.types

И что это у вас за location внутри location, зачем? 

Изменено пользователем Desti
Ссылка на комментарий
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

  • Последние посетители   0 пользователей онлайн

    • Ни одного зарегистрированного пользователя не просматривает данную страницу
×
×
  • Создать...