在角度 PWA 中定义开始屏幕的正确方法是什么？

Question

我的应用程序可用作PWA。然而，如果用户下载了它，那么他们的默认屏幕与网站首页的网络默认屏幕完全相同。

然而，由于它现在已经有效地"安装"在用户的手机上，我希望网站的首页成为登录屏幕，并完全跳过网站的首页。

正确的方法是什么？我想我应该在应用程序本身中使用逻辑，但有什么方法可以定义"；startup_url"；在定义应用程序打开位置的PWA配置中？我在一般PWA文档中看到了startup_url，但找不到任何特定于angular的内容。

Answer 1

您可以使用start_url

start_url:用户启动应用程序时加载的url。它可能与主页不同，例如，如果您希望PWA用户直接进入登录页面或注册页面，而不是主页。出于分析目的，start_url可以精心制作，以指示应用程序是从浏览器外部启动的，这可以转换为PWA。即："start_url"："/？启动器＝主屏幕">

您还可以添加queryString参数来使用服务器分析跟踪主屏幕活动。即："start_url"："/？utm_source＝主屏幕">

将其放入网站.webmanifest文件：

{
"name": "My app",
"short_name": "My app",
"theme_color": "white",
"background_color": "white",
"display": "standalone",
"scope": "./",
"start_url": "/app",
"icons": [
{
"src": "/assets/icons/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/assets/icons/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}

最后，您可以通过index.html页面上的元标签指示浏览器在哪里找到webmanifest

<!-- index.html -->
<link rel="manifest" href="manifest.webmanifest">