如何检查浏览器是否基于Chromium？

Question

我有一个Chrome扩展程序，目前正在编写一个网站进行宣传。 我知道Chrome扩展程序可以在所有基于Chromium的浏览器（Chrome、Opera等）中安装。

是否可能检查浏览器是否能从Web Store下载扩展程序或是否基于Chromium？

我在这里找到了检测是否为Google Chrome的代码。请纠正我如果我错了，但我认为window.chrome并不返回所有基于Chromium的浏览器。

- Fredthedoggy

---

window.chrome 在 Opera 中可以使用。 - Luca Kiebel

相关：https://dev59.com/vGkw5IYBdhLWcg3wg6ug - James Allen

我看到了，但它不会返回所有的Chromium浏览器 @FAKETAXI - Fredthedoggy

是的，这就是重点，但我想知道是否可以将它们发送到Chrome网络商店或说它是不受支持的浏览器。 - Fredthedoggy

@wOxxOm，我非常确定他们正在问“如何检测用户是否在Edge、Firefox或任何其他不是Chromium的浏览器中，以便我可以确保我的页面链接不会为这些人转到Chrome商店”。当然，这可能仍然是“检查window.chrome”，但那就是一个真正的答案，而不仅仅是一条评论。 - Mike 'Pomax' Kamermans

Answer 1

window.chrome

目前为止，在所有基于Chromium的浏览器中，window.chrome都能正常工作。

var isChromium = !!window.chrome;

console.log(isChromium)

资源

• https://browserstrangeness.github.io/css_hacks.html
• http://browserhacks.com/

navigator.userAgentData

User-Agent Client Hints API返回用户的浏览器和操作系统信息。（在Chrome 90中引入）

var isChromium = !!navigator.userAgentData && navigator.userAgentData.brands.some(data => data.brand == 'Chromium');

console.log(isChromium)

Resources

• https://developer.mozilla.org/en-US/docs/Web/API/Navigator/userAgentData
• https://developer.mozilla.org/en-US/docs/Web/API/NavigatorUAData
• https://web.dev/migrate-to-ua-ch/

- User863

---

据我所知，window.chrome在Edge Chromium中不起作用，请参见https://dev59.com/vGkw5IYBdhLWcg3wg6ug，而且它有点脆弱。 - brillout

谢谢你的回答！我想知道：是什么让你认为 window.chrome 最终不会被重命名为 window.edge？这似乎是一个脆弱的解决方案，尽管它似乎可以工作 :) - brillout

Opera 18+自2013年发布以来就拥有它，Vivaldi自2016年发布以来也拥有它。window.chrome具有一些属性，如runtime和app对象。这看起来很有前途。但是不确定edge中的LTS。 - User863

这里的问题是：window.chrome 中是否有一个 API 被许多网站如此重要地依赖，以至于任何基于 Chromium 的版本都很可能永远不会弃用它？ - brillout

在 window.chrome 中没有标准的 API 可用。一种方法是，您必须跟踪更新和更改。 - User863

在 Puppeteer 中，window.chrome 不存在。 - jacob

Answer 2

尝试使用以下表达式

navigator.userAgent.includes("Chrome")

- iAmOren

Answer 3

考虑到您只想了解浏览器是否基于Chromium，

方法1：（服务器端检测）

--从客户端请求中获取浏览器名称，并相应地提供网页。例如，如果后端基于Nodejs，则可以获取浏览器名称，如this 答案所述。

方法2：（客户端检测）

--在客户端上，您可以首先按this 答案中的方式获取浏览器名称，然后从硬编码的基于Chromium的浏览器数组中进行检查。

- amangupta

Answer 4

试试这个。这个检查对Chrome、Safari、Edge、三星浏览器等都是true。

-webkit-appearance属性由基于WebKit（如Safari）和基于Blink（如Chrome、Opera）的浏览器用来实现相同的功能。

function isChromium(){
   return window.CSS && window.CSS.supports && window.CSS.supports('(-webkit-appearance:none)');
}

- Alex Nikulin

---

有趣。虽然我担心-webkit-appearance将来可能会被Chromium放弃？ - brillout

@brillout 在 Chrome 中，'webkit-appearance' 属性从 2008 年一直持续到现在（12 年）。但我不知道它是否会永远存在。 - Alex Nikulin

适合我并满足我的需求，谢谢 :) - Cake Princess

Answer 5

我猜：

var isChrome = navigator.userAgent.match(/Chrome\/\d+/) !== null;

- hussein zakizadeh