程序员经验分享-hwhale

Chrome DevTools 中缺少“添加到主屏幕”链接

2024-04-15

使用 Google 服务可能会令人沮丧。他们有令人难以置信的文档，但文档总是假设一切正常。

如果有什么东西不像广告上说的那样有效，那你就完全靠自己了。没有错误消息，没有解决问题的帮助，甚至没有承认某些事情可能不起作用。

以防万一：添加到主屏幕

我已经设置好了一切：https、服务人员等，但它不起作用。

像这样的教程https://developers.google.com/web/ilt/pwa/tools-for-pwa-developers https://developers.google.com/web/ilt/pwa/tools-for-pwa-developers显示在 Chrome DevTools -> Application -> Manifest 中，有一个“添加到主屏幕”链接来尝试工作流程，但该链接根本不存在。

我找不到任何教程来描述如果缺少该链接该怎么办。

唯一的提示是使用 Lighthouse 来审核页面。 Lighthouse 将应用程序显示为“可安装”。它“使用 HTTPS”，“注册一个控制页面和 start_url 的服务工作线程”，并且“Web 应用程序清单满足可安装性要求”。都是绿色的。

尽管 Lighthouse 将该页面描述为“可安装”，但什么可能导致“添加到主屏幕”链接丢失？


Google 文档屏幕截图已过时，Chrome 开发工具的清单选项卡中不再有“添加到主屏幕”链接。

目前的安装方式manuallyPWA 使用地址栏中的“+”图标（如果网站满足添加到主屏幕条件，则可用）或使用 Chrome 菜单（右侧三个点）并选择“安装应用程序名称”，其中应用程序名称是网站站点名称。

下面是包含这两个选项的屏幕截图（对于DEV 社区门户 https://dev.to/paco_ita/a-gentle-introduction-to-progressive-web-apps-step-1-24da):

如果您有兴趣了解有关 PWA 的更多信息，我写了一系列关于他们的文章 https://dev.to/paco_ita/a-gentle-introduction-to-progressive-web-apps-step-1-24da，从理论到具体用例（服务工作者的缓存策略等）。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

Googlechrome

progressivewebapps

devTools

Chrome DevTools 中缺少“添加到主屏幕”链接 的相关文章

  • DevTools 无法解析 SourceMap：chrome-extension

    我想一周前 我开始在我的谷歌浏览器控制台中收到警告消息 Clearing cache doesn t change anything the messages disappear only in incognito mode 有什么想法如何

  • 打开 Chrome 扩展程序时出现 Service Worker TypeError

    当我打开 WAVE Web 可访问性评估工具 扩展时 我的服务工作人员在 Chrome 中抛出此错误 未捕获 承诺中 类型错误 请求方案 chrome extension 是 不支持的 在 sw js 52 匿名 sw js 52 Prom

  • 在哪里可以找到并提交有关 Google Chrome 浏览器的错误报告？

    对于想要为 chrome 浏览器进行开发的开发人员来说 能够审查现有的错误 以避免太多的麻烦 并添加新的错误 以改进 是很重要的 但我似乎找不到该项目的错误跟踪 它is开源 对吗 谷歌正在称呼它Chromium http code goog

  • Angularjs：排序在 Chrome 和 Firefox 浏览器中显示不同的结果

    您好 我在 chrome 和 firefox 浏览器中得到不同的数据排序结果 Firefox 显示正确的一个 HTML table class datatable thead tr th width 5 class Rank Rank nb

  • Chrome 和 JSESSIONID

    chrome 出现以下问题 我已经在服务器上运行 Grails 1 3 7 应用程序 我注意到 当我从 Chrome 请求静态内容 例如非动态 html 文件 时 Chrome 会创建两个 JSESSIONID Cookie 第一个是登录窗

  • Webpack 编译的 Chrome 扩展抛出 `unsafe-eval` 错误

    使用 Webpack 编译后重新加载 Chrome 扩展时出现此错误 Uncaught EvalError Refused to evaluate a string as JavaScript because unsafe eval is

  • Chrome 扩展 |有什么方法可以让 chrome.storage.local.get() 返回一些东西吗？

    在我的 chrome 扩展中 我需要使用 chrome 存储 在我的后台脚本中 我首先创建一个对象并将其添加到 chrome 存储中 然后我想从那里获取我的对象并返回 像这样的东西 var obj chrome storage local

  • 谷歌浏览器自动填充所有密码输入

    我的问题 我必须打开谷歌来自动填充我网站上的登录信息 但是现在每当我想编辑我的帐户信息或编辑其他用户帐户信息 作为管理员 时 它都会尝试自动填充该登录数据 它在奇怪的地方填充了我的数据 问题似乎是 Chrome 会自动用某种密码填充任何输入

  • 让控制台脚本在 Google Chrome 中保持不变

    我有一个想要在 Google Chrome 控制台中使用的脚本 但这个脚本将重新加载页面 有点像这样 setInterval function location reload 3000 问题是 一旦重新加载 脚本就会停止并清除控制台 我尝试

  • Angular PWA 离线存储

    我正在构建一个新的 Web 应用程序 即使没有互联网连接 它也需要无缝工作 我选择了 Angular 并正在构建一个 PWA 因为它具有使应用程序离线工作的内置功能 到目前为止 我已经让服务工作人员完美工作并由清单文件驱动 这很好地缓存了静

  • 如何限制 Chrome 中的最大文本区域宽度和高度或如何禁用文本区域调整大小

    Chrome 允许通过在右下角添加文本区域来调整文本区域的大小 但有时这种移动可能会破坏页面的设计 所以我想知道如何限制该操作的最大和最小宽度 即如何完全禁用该功能和thml javascript css在页面上 您可以使用 resize

  • 使用“邮递员”chrome 应用程序的肥皂请求正文

    假日网络服务 的肥皂请求正文会是什么样子 http www holidaywebservice com HolidayService v2 HolidayService2 asmx wsdl http www holidaywebservi

  • 如何创建共享网络目录或文件的超链接？

    我检查了以下两个相关讨论 1 如何创建指向本地可执行文件的超链接 https stackoverflow com questions 2815982 how do i make a hyperlink to a local executab

  • 移动浏览器上的 Javascript / jQuery 页面更改事件

    我正在设计一个移动网站 同时考虑所有领先的浏览器 Safari Chrome Dolphin Opera 我想显示一个 正在加载 元素页面导航 更改 请求新页面 我无法在锚标签上使用点击事件 因为有很多锚标签存在preventDefault

  • Service Worker 对 CSS 的响应时间较慢

    我们在 sw toolbox 之上编写了 Service Worker 一旦静态资源被缓存 Service Worker 就会花费更长的时间 特别是下载 css 资源 30 100 毫秒 而对于 js 资源 时间几乎为 0 CSS 加载时间

  • Chrome：网络元素自动移动

    我正在开发一个网络项目 在过去的两周里 我正在进行学期考试 所以我要休息一下 现在 既然他们已经结束了 我又继续我的工作了 但我发现我的一些Web 元素 如按钮 span 在 Chrome 上移动了一些像素 在 IE 和 Mozilla 上

  • 为什么函数声明在不同浏览器中的处理方式不同？

    虽然我在谷歌中找不到对此的引用 但我熟悉这样一个事实 在 javascript 中 全局函数声明在执行任何代码之前都会被解释 换句话说 这工作得很好 f function f 但是 我注意到 chrome 和 firefox 对全局函数声明

  • 在 Chrome 中隐藏 HTML 时间输入字段上的图标

    在 Chrome 中 当您type time 属性到输入框 您会在输入旁边看到一个小图标时钟图标 有没有办法去掉这个小时钟图标 基于这个问题的答案 将日期输入三角形更改为日历图标 https stackoverflow com questi

  • Chrome toDataURI 错误

    直到大约一天前 Canvas2Image JS 库和 toDataURI JS 方法还可以在 Chrome 中使用 http www nihilogic dk labs canvas2image http www nihilogic dk

  • Chrome 调试器注入 javascript

    我有这样的好奇心 是否可以以某种方式在我的页面中注入 javascript 并执行它并调试它 正如您在控制台中所做的那样 但在控制台中您无法暂停并观察变量 是否可以调试我通过控制台输入的代码 为什么无法调试通过 XHR 接收的代码 Than

随机推荐

  • 如何使用具有 BASIC 身份验证的 Service Worker（NTLM、协商）

    我一直在尝试在 IIS 托管网站中使用服务工作线程来缓存该网站的一些静态内容 该站点是使用 Windows 身份验证的内部应用程序 我已经能够注册并运行服务工作线程 没有太多麻烦 但是一旦我打开缓存并开始向缓存添加文件 承诺就会因授权失败而

  • rspec - 为什么仅在 ubuntu 上，当它们相同时，使用 assert_equal 进行此属性比较会失败？

    两个测试都失败了 但仅在 Ubuntu 12 上失败 但在我的 新 Mac 上却失败了 失败的两个是 Active Record 对象属性比较 但我尽了最大努力来比较它们 例如在命令行创建哈希并粘贴属性 比较表明它们是相同的 这是一个真正的

  • Airflow initdb slot_pool 不存在

    我面临一个问题airflowpostgres 后端初始化 乌班图 18 04 1 气流 v1 10 6 Postgres 10 10 Python 3 6 当我跑步时 airflow initdb I get 2019 11 22 10 1

  • 在本例中如何避免 VBA 中的 select/active 语句？

    需要导出一个PDF文件中的所有工作表 所以我找到了这段代码 它有效 导出一个PDF 每张工作表一个页面 但我不想使用 select active 语句 我更喜欢使用存储对象的变量 问题 如何避免此代码中的 select ActiveShee

  • WPF MVVM 可观察集合不更新 GUI

    我正在设计一个 MVVM WPF 应用程序 并且有一个 ViewModel 它有一个名为 SelectedCustomer 的属性 类型为 Customer 该对象有一个名为 SummaryDetails 的 ObservableColle

  • 如何在 GWT 的 Jetty 中启用 HTTPS？

    如何在 GWT 附带的 Jetty 中启用 HTTPS gwt dev jar 中 隐藏 了一个 README SSL txt 你可以找到最新版本在 Github 上 https github com gwtproject gwt blob

  • (Fortify) 类别：Android 不良做法：缺少 Google Play 服务更新的安全提供程序（1 期）

    我们正在使用 Fortify 扫描我的 Android 源代码 但我无法摆脱这个问题 类别 Android 不良做法 缺少 Google Play 服务更新的安全提供程序 1 期 Fortify指向这行代码 工具 替换 android al

  • Numpy 沿特定维度选择不替换

    在不进行替换的情况下 我根据指定的分布从样本中 n 次不同地选择 k 个元素 迭代解决方案很简单 for in range n np random choice a size k replace False p p 我无法设置size k

  • Java：如何通过忽略“\n”来逐行读取文件

    我正在尝试读取每行制表符分隔的文本文件行 行通过使用回车符 r n 进行分隔 并且在制表符分隔的文本字段中允许使用换行符 n 由于我想每行读取文件行 因此我希望我的程序忽略独立的 n 很遗憾 BufferedReader使用这两种可能性来分

  • std::this_thread::yield 与 Linux 上的 sched_yield 有什么不同吗？

    我只是想知道如何std this thread yield是在linux上实现的 它与sched yield 我见过一些自旋锁的实现 这意味着std this thread yield是更轻量级的东西sched yield就线程放弃进程多长

  • OSGi 应用程序修补策略

    修补 OSGi 容器的适当机制是什么 1 Should the bundles binaries jars have the same name as the old ones then a Replace the bundle with

  • 使用多线程的 JPA 中的事务

    我的目标是使用单元测试在我的应用程序中引发乐观锁定异常 我已经在理论上了解了如何做到这一点 但我在实践中的问题是如何维护两个线程之间的事务 所以 这就是我到目前为止所做的 我正在使用 JUnit 测试 RunWith SpringJUnit

  • 用于进行修改的 git 工作流程，您永远不会将其推回原点

    我正在构建一个 iPhone 应用程序PhoneGap http phonegap com 其中有一个 Git 存储库 我想在我自己的 Git 存储库中跟踪对 PhoneGap 代码的更改 主要是向 www 目录添加文件 同时能够从 Pho

  • GitHub、Gerrit、Hudson(Jenkins) 工作流程

    我刚刚开始一起使用 GitHub Gerrit 和 Hudson Jenkins 我需要一些关于工作流程的想法 我们想使用 GitHub 作为我们的主要远程存储库 我们希望主要使用 Gerrit 进行代码审查 但也用于 Hudson 中的构

  • 如何运行 Webpack 开发服务器 --https --hot --inline

    使用 CLI 配置时 有没有办法在 https 上运行 webpack dev server 问题是连接到socket io结束了http并不是https 存在解决方法 但非常烦人 手动包含https webpack dev server在

  • Scala - 以函数方式修改字符串

    我刚刚开始使用 Scala 因此开始以更实用的方式做事 只是想知道是否有一种更实用的方法来实现如下所示的功能 def expand exp String String var result exp for k v lt libMap res

  • Python/Django 中的音频波形可视化

    我已经在 Stack Overflow 上寻找这个问题的答案 但似乎没有地方给出正确的答案或方向 我的项目将允许用户上传 WAV 最终将在服务器上使用 FFmpeg 将其转换为低质量 MP3 并将全部存储在 Amazon S3 上并提供服务

  • asp.net mvc - ActionLink 的渲染不一致

    我有一个控制器 它接受以下两种格式的 URL 网络 添加或编辑 gt 在页面上呈现空白表单以添加新的网络对象 网络 AddOrEdit id gt 使用预填充表单呈现页面以编辑网络对象 带有 ID id 显然 每个实例中都使用相同的视图 我

  • 在 JavaScript 中逐行动态添加字幕到视频元素

    我想知道目前是否可行 下面是我的 HTML

  • Chrome DevTools 中缺少“添加到主屏幕”链接

    使用 Google 服务可能会令人沮丧 他们有令人难以置信的文档 但文档总是假设一切正常 如果有什么东西不像广告上说的那样有效 那你就完全靠自己了 没有错误消息 没有解决问题的帮助 甚至没有承认某些事情可能不起作用 以防万一 添加到主屏幕

热门标签