IOS Полноэкранное приложение: почему панель инструментов появляется при изменении страницы? - PullRequest
1 голос
/ 14 июля 2020

Я унаследовал веб-приложение React , которое предназначено для использования в качестве полноэкранного приложения на мобильных устройствах в Safari IOS. Вы можете развернуть приложение в полноэкранном режиме и скрыть адресную строку, выполнив следующие действия:

  1. Откройте приложение в сафари (https://app.1wsq.com)
  2. Нажмите кнопку на нижней панели инструментов
  3. «Добавить на главный экран»

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

Как сохранить веб-приложение iPhone / iPad в полноэкранном режиме? - Этот вопрос похоже, ориентировано на многостраничное приложение, и предлагаемые хаки для ссылок не применимы к React SPA, который использует response-router-dom для навигации по страницам.

Вещи, которые я пробовал:

У меня в веб-приложении есть следующий метатег:

<meta name="apple-mobile-web-app-capable" content="yes">

Ответы [ 2 ]

2 голосов
/ 17 июля 2020

В приложении отсутствовал файл manifest, предписывающий приложению оставаться в полноэкранном режиме.

Между тегами заголовка я ссылаюсь на файл манифеста: <link rel="manifest" href="manifest.json" />, а затем создаю manifest.json

{
  "name": "1WSQ",
  "short_name": "1WSQ",
  "description": "1WSQ APP",
  "display": "fullscreen",
  "start_url": "/?homescreen=1",
  "background_color": "#000000",
  "theme_color": "#0f4a73",
  "icons": [
    {
      "src": "touch-icon-ipad-retina.png",
      "sizes": "167x167",
      "type": "image/png"
    }
  ]
}

PS Для ясности ссылки - это react-router-dom ссылки, поэтому нет ссылки на страницу sh. Проблема с обновлением страницы sh приводит к тому, что в некоторых случаях появляется панель браузера, и есть и другие ответы по поводу этой проблемы.

0 голосов
/ 22 июля 2020

Не могли бы вы проработать "файл манифеста"? У меня есть веб-сайт, добавленный на мой домашний экран iPhone. Каждый раз, когда я нажимаю тег привязки, я получаю панели инструментов. Кажется, я не могу от них избавиться. О каком именно файле манифеста вы говорите?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...