I am creating a progressive web app, and I need to add current URL in manifest.json file using meta tag.
I created this manifest.json:
{
"name": "app",
"icons": [{
"src": "images/avatar.jpg",
"sizes": "64x64"
}, {
"src": "images/avatar.jpg",
"sizes": "64x64"
}, {
"src": "images/avatar.jpg",
"sizes": "128x128",
"density": 2
}],
"app": {
"urls": [
"https://www.example.com"
],
"launch": {
"web_url": "https://www.example.com"
}
}
"theme_color":"#06ADD5",
"display": "standalone",
"orientation": "portrait"
}
the above JSON is working fine in static URL & web URL, but I want to get it working for as a dynamic URL (EX:www.example.com/< PRODUCT_ID > )
That JSON does not adhere to the Web App Manifest specification, which is what's currently used by Chrome and Firefox for metdata when adding a web app to a device's homescreen. Specifically, you'd want to use the start_url
property to specify the initial URL to open.
In any case, the question of customizing the contents of /path/to/manifest.json
based on some criteria just boils down to how you'd normally do server-side customization of any resource before returning it to the client. You could pass in a URL parameter, like /path/to/manifest.json?start_url=*something*
, and then have your web server return a different start_url
value in the JSON response based on what something is.
If you can't implement server-side logic, perhaps because you're only deploying static files and using client-side rendering for everything, then your best bet is to generate multiple manifest-*something*.json
files ahead of time, each with a different start_url
value, and then set the <link rel="manifest">
tag on each page to point to the appropriate manifest-*something*.json
URL, based on whatever criteria makes sense for you.