Localising a PWA web manifest

Question

Is there a way in which a web manifest can be localised? i.e. having multiple translations of name, description etc...

I have thought of a couple of potential solutions but they each have pretty big drawbacks...

Potential Solution 1 (preferred but not sure if it will work)

Dependant on the locale in the url (example.com/en/foo), load the relative manifest.

For example:

• For example.com/en/foo, load example.com/en/manifest.json
• For example.com/jp/foo, load example.com/jp/manifest.json

Drawbacks

• I don't believe this will actually work as there can only be one manifest per website (as far as I am aware), and I am fairly certain it needs to be in the root
• Even if this is possible, given my application is a statically hosted SPA, I am not entirely sure how I would go about implementing it i.e. I can't dynamically update the link to the manifest before the manifest is loaded by the browser. Maybe I can load the manifest relative to the URI but not 100% sure this will work

Potential Solution 2

Host multiple versions of the PWA (either subdomain or TLD)... For example:

• en.example.com/example.com
• jp.example.com/example.jp
• etc...

Given the manifest is generated by the build process, this would actually be very easy to implement by adding multiple deploy steps to the pipelines. I would then use the environment variables for each deployment to determine the text to be inserted into the manifest.

Drawbacks

• Switching language of the app is not possible (this is a pretty key feature for the client)
• Regardless of how 'easy' it is to implement, it simply doesn't seem right

Answer 1

On the W3C document about the web manifest, I found the following:

It is expected that authors will localize the content of a manifest by using one of the following options:

• Dynamically setting the language: This can include, for instance, asking the end-user what their preferred language is and dynamically adding or replacing the manifest link relationship to the document based on that language preference (e.g., using a URL like "manifest.php?lang=fr").
• Using content-negotiation, or geotargeting, etc. on the server: The server that hosts the web application could attempt to predetermine the end-user's language by using geotargeting or by using content negotiation (e.g., using [RFC7540]'s "Accept-Language" header, or even a custom HTTP header).

This though says what should be done, but not exactly how.

There is currently an open requests about it on Github. Specifically this link argues with the suggestion on W3C site.

I will update the answer with more details as soon as I gather more information.

Google provide a more practical guide to localize the manifest file and maybe can be used as guide for the web manifest.

---

UPDATE

Could you create a small script for your index.html?

You do not need php, but simply Vanilla JS (if you have control over the index.html file) and load a specific manifest file according to the user locale.

<!-- If English is detected, the script will load this into the page -->
<link rel="manifest" href="/path.../en.manifest.json">

<!-- If French is detected, the script will load this instead -->
<link rel="manifest" href="/path.../fr.manifest.json">