关于vue开发谷歌插件时的csp问题

Question

想使用vuejs和一些组件库开发一个谷歌插件，但是由于内容安全策略(csp)，导致不能使用eval() new Function()等javascript特性，所以vue不能正常使用，官方文档对这一部分只是模糊的说了一下。

Answer 1

按照文档的说法，应该使用运行时构建的版本就可以了： https://github.com/vuejs/vue/...

Answer 2

可以用vue运行时版本解决CSP兼容问题。
至于csp的规范说明可以参考下面这篇文档介绍
https://content-security-poli...

Answer 3

这个是chrome的CSP安全策略导致的，只要设置好 Content-Security-Policy 就行了。
在页面中添加以下 <mate> ：

<meta http-equiv="Content-Security-Policy" content="default-src 'unsafe-inline' 'unsafe-eval'">

• 'unsafe-inline' 允许使用内联 JavaScript 和 CSS
• 'unsafe-eval' 允许使用类似 eval 的 text-to-JavaScript 机制

这些都是使用 vue 时需要用到的机制。

相关资料：Google Web Fundamentals - 内容安全政策