如何在 PWA Android 应用中隐藏 URL 栏?

Posted

技术标签:

【中文标题】如何在 PWA Android 应用中隐藏 URL 栏?【英文标题】:How to hide the URL bar in PWA Android app? 【发布时间】:2019-06-05 02:45:35 【问题描述】:

我正在按照所有步骤将我的 PWA 转换为 android 应用,但它无法显示 URL 栏

我已经构建了我的 PWA 我已经检查过 Lighthouse 并获得了 +90 我已经把它本地化了 我已获得 SHA256 应用签名证书 我用数字资产链接工具检查了我的assetlinks.json。 我已在 Google Play 上发布

但我的应用顶部仍然有 URL 栏

assetlinks.json

[
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target" :  "namespace": "android_app", "package_name":     "org.mysite.mysite",
               "sha256_cert_fingerprints": ["..."] 
]

AndroidManifest.xml

apply plugin: 'com.android.application'

def twaManifest = [
    applicationId: 'org.mysite.mysite',
    hostName: 'www.mysite.org', // The domain being opened in the TWA.
    launchUrl: '/', // The start path for the TWA. Must be relative to the domain.
    name: 'MySite', // The name shown on the Android Launcher.
    themeColor: '#000000', // The color used for the status bar.
    backgroundColor: '#e6086e' // The color used for the splash screen background.
]

android 
compileSdkVersion 28
defaultConfig 
    applicationId twaManifest.applicationId
    minSdkVersion 16
    targetSdkVersion 28
    versionCode 19
    versionName "1.19"
    testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"

    // The name for the application on the Android Launcher
    resValue "string", "appName", twaManifest.name

    // The URL that will be used when launching the TWA from the Android Launcher
    resValue "string", "launchUrl", "https://" + twaManifest.hostName + twaManifest.launchUrl

    // The hostname is used when building the intent-filter, so the TWA is able to
    // handle Intents to open https://svgomg.firebaseapp.com.
    resValue "string", "hostName", twaManifest.hostName

    // This variable below expresses the relationship between the app and the site,
    // as documented in the TWA documentation at
    // https://developers.google.com/web/updates/2017/10/using-twa#set_up_digital_asset_links_in_an_android_app
    // and is injected into the AndroidManifest.xml
    resValue "string", "assetStatements",
            '[ \\"relation\\": [\\"delegate_permission/common.handle_all_urls\\"],' +
                    '\\"target\\": \\"namespace\\": \\"web\\", \\"site\\": \\"https://' +
                    twaManifest.hostName + '\\"]'

    // This attribute sets the status bar color for the TWA. It can be either set here or in
    // `res/values/colors.xml`. Setting in both places is an error and the app will not
    // compile. If not set, the status bar color defaults to #FFFFFF - white.
    resValue "color", "colorPrimary", twaManifest.themeColor

    // Sets the color for the background used for the splash screen when launching the
    // Trusted Web Activity.
    resValue "color", "backgroundColor", twaManifest.backgroundColor

    // Defines a provider authority fot the Splash Screen
    resValue "string", "providerAuthority", twaManifest.applicationId + '.fileprovider'

buildTypes 
    release 
        minifyEnabled false
    

compileOptions 
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8



dependencies 
implementation fileTree(include: ['*.jar'], dir: 'libs')
implementation 'com.github.GoogleChrome.custom-tabs-    client:customtabs:d08e93fce3'

【问题讨论】:

你找到解决方法了吗? 【参考方案1】:

要隐藏地址栏并获得 PWA 的全屏视图,您需要在 PWA 的 manifest.json 文件中具有 "display": "standalone" 属性。

【讨论】:

是的,就是这样设置的。但这是一个原生 APK(基于 PWA 和 TWA),而不是用户添加到主屏幕的页面【参考方案2】:

嘿,我假设如果你在 Play 商店中有它,它必须被包装在一个骨架 android 应用程序中?这些被称为 TWA 或受信任的网络应用程序。你可以试试隐藏状态栏

<style>
<item name="android:windowActionBar">false</item>
</style>

如果这不起作用,请尝试

【讨论】:

在“尝试”之后,您的部分答案似乎丢失了。

以上是关于如何在 PWA Android 应用中隐藏 URL 栏?的主要内容,如果未能解决你的问题,请参考以下文章

URL 栏未隐藏

从外部 url 打开已安装的 PWA

如何从 PWA 应用主屏幕链接中删除 Chrome 徽标(Android O 预览版)

如何隐藏/加密/混淆我的 Android 应用程序中使用的直接 URL? [复制]

访问pwa地址的url参数

如何在Android APP中隐藏API URL和参数?