web-dev-qa-db-ja.com

WordPress WebサイトからプログレッシブWebアプリへの変換

私はプログレッシブWebアプリを構築していますが、これまでのところオンラインでのドキュメントとサポートはほとんどありません。このメールにすべての質問をリストアップしています。

  1. デスクトップのService Worker API(オフラインモード)の現在のサポートは何ですか?モバイル(Android-Chrome)ではオフラインモードで動作し、デスクトップ(Chrome 42)では動作しない小さなアプリを作成しました。このために開発環境を構成する必要があるため、アプリのテストに必要なものを知る必要があります。 IOS-Safari/Chromeでも動作しません。

  2. サービス作業はキャッシュを広範囲に使用し、Dekstop Chromeでサービスワーカー内部をデバッグまたは登録解除する非常に良い方法があります。しかし、モバイルでアプリケーションを実行する場合、Service Workerキャッシュを削除するにはどうすればよいですか?

  3. レスポンシブアプリケーション(A WordPressサイト)があり、それをPWAに変換する必要がある場合、モバイル版のRestAPIでアプリケーションをすべて書き換える必要がありますか?(PWAのApp Shellを読む) 。PWAでは、アプリケーションシェルはデータから分離されていますが、CMSではWordPress=データはUIから分離されていません。

私はこれらの答えを非常に長い間探していましたが、適切なサポートを見つけることができませんでした。

22
Usama Noman

デスクトップのService Worker API(オフラインモード)の現在のサポートは何ですか?モバイル(Android-Chrome)ではオフラインモードで動作し、デスクトップ(Chrome 42)では動作しない小さなアプリを作成しました。このために開発環境を構成する必要があるため、アプリのテストに必要なものを知る必要があります。 IOS-Safari/Chromeでも動作しません。

Safariは現在サービスワーカーをサポートしていませんが、 Chrome 42 で動作するはずですが、ブラウザの更新を検討する必要があります。とにかく、さまざまな場所で最新技術をチェックできます。

SWの詳細:

サービス作業はキャッシュを広範囲に使用し、Dekstop Chromeでサービスワーカー内部をデバッグまたは登録解除する非常に良い方法があります。しかし、モバイルでアプリケーションを実行する場合、Service Workerキャッシュを削除するにはどうすればよいですか?

debug Chrome for Android from Desktop Chrome が必要です。

とにかく、URL chrome:// serviceworkers-internalsは、ChromeのAndroidで利用できますが、オフラインキャッシュをクリアする簡単な方法はありません。

レスポンシブアプリケーション(WordPressサイト)があり、それをPWAに変換する必要がある場合。モバイル版のRestAPIでアプリケーションをすべて書き直す必要がありますか? (PWAのApp Shellを読んでください)。 PWAでは、アプリケーションシェルはデータから分離されますが、CMSではWordPressデータはUIから分離されません。

いいえ。実際、WPには、コンテンツをテーマから切り離すための非常に優れたアーキテクチャがあります。 問題はサーバー上で実行されますが、クライアントで実行されているサイトがPWAになる必要はありません。 Mozillaは、WPのインストールをprogressivizingするために WordPressプラグインのスイート をサポートしています。

  • オフラインシェル [ github ]はシェルアセット(テーマファイル)を識別し、オフラインキャッシュにキャッシュします。
  • オフラインコンテンツ [ github ]は、動的コンテンツを識別し、ユーザーがアクセスしたときにキャッシュします。
  • Web Push [ github ]を使用すると、新しいコンテンツを公開するとすぐにリアルタイム通知をリーダーにプッシュできます。
  • ホーム画面に追加 [ github ]は、ホーム画面にWordPressを配置することで読者を引き付けます。

これらはすべて非常に新しいプラグインですが、GitHubで追跡し、必要に応じて貢献できます!

35
Salva

@Salvaによって既に非常に便利で役立つ回答が追加されていますが、役立つと思われるものをいくつか追加してみましょう。

第3部では、自動プログレッシブWebアプリコンバータープラットフォーム https://www.escalatingweb.com に取り組みました。このプラットフォームを使用して、WordPress=のWebアプリをプログレッシブWebアプリに変換できます。数分でWebアプリをpwaに変換できます。非常に素晴らしいチュートリアルも作成しました。自動pwaコンバータープラットフォームを使用するには http://www.techromance.com/2017/07/22/automatic-pwa-converter-platform/ .

2番目の部分では、上記の回答に追加するだけで、テストの目的で、特定のWebサイトのすべてのキャッシュをサイト設定から削除できます。これにより、サービスワーカーのキャッシュもクリアされます。

最初の部分については、追加するものは何もありません。

追伸彼らが私のプラットフォームを宣伝する安価な方法としてそれを見つけたとしても誰も怒らないでください。意図は、プラットフォームを構築するか、必要な聴衆にそれを知らせることによって、コミュニティを助けることだけです。 @McNabの提案をありがとう。 :)

2
Satys

また、Wordpressサイトを使用して、問題を解決できるプラグインがあります。多くのMozillaプラグインをインストールする代わりに、Super Progressive Web Appsプラグインをインストールできます(プラグインインストールで検索)、 Android phoneとIOS https://wordpress.org/plugins/super-progressive-web-appsの両方で試しました/

1