【WordPress】テーマ「Luxeritas」でのマルチサイト、luxe-manifest.json404エラーと対策

2019-04-11WordPressWordPressテーマ

WordPressの無料テーマ「Luxeritas」はPWAに対応しており、SSL化さえしてあれば簡単にWordPressサイト・ブログをPWAに対応させる事が可能です

マルチサイトではluxe-manifest.jsonが見つからずエラー

※Luxeritasのテーマバージョンは3.5.9

マルチサイトでLuxeritasのPWAを使うとluxe-manifest.jsonが見つからずエラーとなってしまいます

GET https://1-notes.com/word-press/luxe-manifest.json 404
luxe-manifest.json:1 Manifest: Line: 1, column: 1, Unexpected token.

生成されるPWA用のmanifest.jsonはトップディレクトリなのに対し、読み込もうとするmanifest.jsonがマルチサイト毎になっているのが原因です

Luxeritasは修正版の提供も早いので修正されるかもですが、マルチサイトの事なのでエラーを確認できる人数も少なくしばらくそのままかもしれません

対策案

対策としては「uxe-manifest.jsonを生成しているファイルを探して書き換える」や「luxe-manifest.jsonを読み込むコードを探してURLを書き換える」などを検討してました

が、トップディレクトリに生成されているmanifest.jsonはマルチサイト用の内容(PWAがマルチサイト毎)になっており、違うマルチサイトにアクセスがある度に上書きされている状態でした

結局のところPWAのファーストページはトップディレクトリで良いので、静的ファイルとして別にmanifest.jsonを設置して.htaccessでluxe-manifest.jsonからリダイレクトする用にしました

.htaccessファイルのRewriteBase /のスグ下に以下を記述する事で「luxe-manifest.json」から「manifest.json」にリダイレクトさせました

RewriteEngine On
RewriteBase /
RewriteRule luxe-manifest.json manifest.json [R=301,L]

別途設置したリダイレクト先の「manifest.json」はトップディレクトリで生成された「luxe-manifest.json」をコピーしました

途中、ファイル名を誤って記述したものをService Workerが拾ってしまい、その事に気付くまで手こずりましたが、luxe-manifest.jsonによる404エラーは解消

PWAでインストールしてみて、オフラインでも動作確認

と言いたいところですがチョットダメで、アクセスした事のあるマルチサイトしかローカルキャッシュしておらず、キャッシュの無いページへはオフライン状態では移動できませんでした

とりあえずそこは全然無問題かな

あとは「Luxeritas」さんのアップデート待ちですかね

2019-04-11WordPressWordPressテーマ

Posted by Yousuke.U