Это сводит с ума.Есть простой блог Wordpress.Провел аудит с помощью инструмента Lighthouse в инструментах веб-разработчика Chrome.В области Progressive Web App мой счет - ужасный 53 со следующими тремя ошибками.Я не могу понять, как исправить эти ошибки.
Не отвечает 200 в автономном режиме.
Пользователь будетне будет предложено установить веб-приложение
Сбои: значение манифеста display не является одним из: minimal-ui |полноэкранный |автономный, сайт не регистрирует сервисного работника.
Не регистрирует работника службы.
Работник службы - это технология, позволяющая вашему приложению использовать многие функции Progressive Web App, такие как автономный режим, добавление на домашний экран и push-уведомления.
Вот мой файл manifest.json.Я изменяю URL на example.com.И я точно знаю, что он доступен на сервере, перейдя по адресу example.com/manifest.json, и именно так он называется в заголовке.Я что-то упустил в своем манифесте, чтобы вызвать эти ошибки?
{
"name": "My Site",
"short_name": "My Site",
"theme_color": "#ffffff",
"background_color": "#082953",
"display": "browser",
"Scope": "/",
"start_url": "https://www.example.com",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"splash_pages": null
}
Вот мой сгенерированный заголовок с домашней страницы.Не уверен, что мне нужны все эти значки.Немного смущен, так как Lighthouse говорит, что для манифеста требуется 512x512, но realfavicongenerator и другие генераторы манифеста, похоже, не выдают 512x512, поэтому я просто сделал его в Photoshop и загрузил в root с остальными значками, а затем добавил дополнительный кодв файл manifest.json.
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="application-name" content="My Site">
<meta name="apple-mobile-web-app-title" content="My Site">
<meta name="theme-color" content="#ffffff">
<meta name="msapplication-navbutton-color" content="#082953">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="My Site">
<meta name="msapplication-starturl" content="https://www.example.com">
<meta name="msapplication-TileColor" content="#082953">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="manifest" href="/manifest.json">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="384x384" href="/android-chrome-384x384.png">
<link rel="icon" type="image/png" sizes="512x512" href="/android-chrome-512x512.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#082953">