如何将 Web 应用程序正确包装在 Google Chrome 打包应用程序中？

Question

我希望将我的 Web 应用程序包装在 Chrome 打包应用程序中。

我的最终目标如下：

屏蔽 URL 以隐藏我的通用（二级）域（例如，http://my-app.big-company.com）。
屏蔽浏览器以提供本机桌面应用程序的外观。
利用 Chrome Apps for Mobile 可能提供的任何移动转换，让我可以使用单个代码库和一组 Web 资产（HTML、CSS 和 JS）进行部署我的应用程序到 Android 和 iOS.

这是我目前的情况：

manifest.json

{
    "name": "Hello World!",
    "description": "My first Chrome App",
    "version": "0.1",
    "manifest_version": 2,
    "app": {
        "background": {
            "scripts": ["background.js"]
        }
    },
    "icons": { "16": "icon-16.png", "128": "icon-128.png" }
}

background.js

chrome.app.runtime.onLaunched.addListener(function() {
    chrome.app.window.create('window.html', {
        'outerBounds': {
            'width': 400,
            'height': 500
        }
    });
});

window.html

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <iframe src="http://example.com/"></iframe>
    </body>
</html>

我怀疑，至少 window.html 有问题。具体来说，我怀疑我是否应该使用 <iframe> 来获取我的网络应用程序内容。

Here is the documentation I have been following.

请帮忙。

Answer 1

This documentation suggests the OP's approach will not work and, instead, you need to package and install all the assets locally.

Answer 2

你可以这样做，但你需要另一个标签；具体来说，<webview> tag 而不是 <iframe>。有关该标签的所有可能性，请参阅链接文档。它还需要 "webview" 权限。

请注意，这不适用于 "should behave like a native app" 哲学，但是可能的。

如何将 Web 应用程序正确包装在 Google Chrome 打包应用程序中？

How to properly wrap a web app inside a Google Chrome Packaged App?

google-chrome

google-chrome-app