Как проверить PWA на HTTPS с самозаверяющим сертификатом OpenSSL?

Question

Я могу тестировать работники сервисов через http с помощью localhost, но я хотел бы протестировать их в мобильном браузере. Поскольку это отдельное устройство, я не могу использовать localhost, поэтому я использую имя P C. Поэтому теперь мне нужно использовать https, который вызывает ошибки, связанные с SSL, у моего работника службы:

Uncaught (в обещании) DOMException: Не удалось зарегистрировать ServiceWorker для области ('https://xxx: 5500 / app / ') со скриптом (' https://xxx: 5500 / app / service_worker. js '): при получении скрипта произошла ошибка сертификата SSL.

I Я правильно настроил LiveServer для использования самозаверяющих сертификатов, и я успешно включил «edge: // flags / # unsafely-Treat-insecure-origin-as-secure», но этого недостаточно.

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

Answer 1

Другое рабочее решение, чем использование ngrok , которое создаст живой https-сервер для проекта, который вы хотите (и тогда вы сможете получить к нему доступ на своем мобильном устройстве)

Answer 2

Вы можете протестировать свой PWA на мобильном устройстве с помощью chrome инструментов разработчика: метод, называемый удаленной отладкой (работает только для android)

1. открыть инструменты разработчика на мобильных устройствах - разрешить usb отладка

2. подключение через USB к ноутбуку или к p c

3. go до chrome dev инструменты открывают удаленные устройства

4. установить переадресацию портов на удаленном устройстве

5. запустить локальный хост в мобильном браузере chrome.

для подробная информация приведена ниже: https://developers.google.com/web/tools/chrome-devtools/remote-debugging

Это обеспечивает локальный хост в мобильных устройствах, поэтому нет необходимости для https или ssl.

Я думаю, что это лучший способ проверить ваши PWA, я лично использовал это.