我正在尝试在渐进式Web应用程序上创建“添加到主屏幕”按钮，如Chrome文档中所述。
我通常遵循规定的模式，其中有一些隐藏按钮，当Chrome beforeinstallprompt事件触发时会显示该按钮。触发事件后，我将捕获该事件，然后单击我自己的安装按钮后，使用该事件开始本机安装对话框。示例代码如下：
let deferredPrompt;
window.addEventListener('beforeinstallprompt', (e) => {
// Prevent Chrome 67 and earlier from automatically showing the prompt
e.preventDefault();
// Stash the event so it can be triggered later.
deferredPrompt = e;
// Update UI notify the user they can add to home screen
btnAdd.style.display = 'block';
});
btnAdd.addEventListener('click', (e) => {
// hide our user interface that shows our A2HS button
btnAdd.style.display = 'none';
// Show the prompt
deferredPrompt.prompt();
// Wait for the user …javascript browser google-chrome homescreen progressive-web-apps
我正在尝试标记存储在服务工作缓存中的资源.
我认为可以向资源添加一个可以指示这一点的自定义标头,但是,一旦资源存储在服务工作缓存中,就会删除标头修改.是这样的吗？我没有在缓存规范中看到有关修改响应头的任何内容.
这是我尝试过的一个例子:
// I successfully cache a resource (confirmed in Dev Tools)
caches.open('testCache').then(cache => {
cache.add('kitten.jpg');
})
.then(() => {
console.log('successfully cached image'); // logs as expected
});
// placeholder
var modifiedResponse;
// get the cached resource
caches.open('testCache')
.then(cache => {
return cache.match('kitten.jpg');
})
// modify the resource's headers
.then(response => {
modifiedResponse = response;
modifiedResponse.headers.append('x-new-header', 'test-value');
// confirm that the header was modified
console.log(modifiedResponse.headers.get('x-new-header')); // logs 'test-value'
return caches.open('testCache');
})
// put the modified resource back …我正在尝试在最新的 Chrome 和 Android (7) 上实现添加到主屏幕。我在清单文件中指定了“独立”，但该应用程序仅在浏览器中打开。我之前在同一台设备上获得了所需的行为，但似乎无法重现它。
我看到有人在这个问题中有类似的问题。我遵循了建议的解决方案 - 使用 Lighthouse 验证 PWA 属性 - 但即使 Lighthouse 得分为 100，我仍然无法让应用程序在独立模式下打开。
有任何想法吗？
我的参考代码（也在GitHub 上并托管在 GitHub Pages 上）：
索引.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A2HS Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0077c2"/>
<link rel="manifest" href="manifest.json">
</head>
<body>
<p>Add To Home Screen</p>
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js')
.then(reg => console.log('Registration success. Scope is ', reg.scope))
.catch(err => console.log('Registration failed. ', err));
}
</script> …我正在尝试使用 GCP 的 Cloud Build 构建一个容器。我正在使用quickstart doc 中的简单模板。我以前成功地做到了这一点。
但是，这次我使用的是“组织”下的项目。所以项目 ID 是mycompany.com:projectX，而不是简单的projectX.
我无法完成构建。
当我运行时：
gcloud builds submit --tag gcr.io/mycompany.com:project-id/helloworld
我收到以下错误：
(gcloud.builds.submit) INVALID_ARGUMENT: invalid build: invalid image name "gcr.io/mycompany.com:projectX/helloworld"
我怀疑由于--tag标志docker build -t $TAG .在引擎盖下调用并且docker 图像名称用于:指定版本，因此这种格式可能无效。
在处理组织项目时我应该做什么有什么想法吗？我在 Cloud Build 或 GCP IAM 文档中找不到相关信息。
我尝试过的一些事情：
cloudbuild.yaml配置文件以确保我具有正确的格式$PROJECT_ID Using the project number in the image path is not supported. Project ID must …cloud docker google-cloud-platform google-iam google-cloud-build
从MDN：
在Chrome 47及更高版本中，将显示从主屏幕启动的Web应用程序的启动屏幕。此溅射屏幕是自动生成的在web应用清单使用属性，具体有：
name，background_color，并在图标icons array最接近128dpi的设备。
我想知道是否有可能使用全屏背景图像而不是生成的背景？