浏览器扩展中标识符/类名称的最佳做法

Question

在扩展程序中（我特别关注Chrome的扩展程序），页面中注入的css标识符和类可能会与页面上的其他元素冲突。

我正在尝试使用扩展名前缀来定义他们的名字，但这并不完全确定。那么，有没有办法定义css ID /类的scurely名称？

Answer 1

如果“完全确定”是您的要求，那是不可能的。有人可以随时下载您的扩展程序，查看您正在使用的类名，然后更改其网站的CSS以与您的类名冲突（或更有可能尝试覆盖）。这是一个功能，而不是一个bug;扩展扩展了网页，因此它们应该能够与DOM混合并改变它们。

如果你想创建一个别人不会故意与你的系统冲突的系统，为什么不使用Java命名空间方案：拿一个你拥有的域，并将它用作前缀，比如com-example-myclassname？稍微不那么可读，不再安全的是扩展的ID或随机生成的SHA-1十六进​​制哈希：

• abcdefghijklmnop-myclassname
• da39a3ee5e6b4b0d3255bfef95601890afd80709-myclassname

我故意不在此处添加动态解决方案，因为CSS通常在Chrome扩展程序或应用中不是动态的。此外，CSP可能会使这种方法变得简单明了（这是一件好事）。