“未找到 Content-Security-Policy 元标记。”我的 phonegap 应用程序中的错误
Posted
技术标签:
【中文标题】“未找到 Content-Security-Policy 元标记。”我的 phonegap 应用程序中的错误【英文标题】:"No Content-Security-Policy meta tag found." error in my phonegap application 【发布时间】:2015-07-24 14:12:48 【问题描述】:在我的系统中更新 Cordova 5.0 后,我创建了新的应用程序。当我在设备上测试我的应用程序时,控制台日志中出现错误:
No Content-Security-Policy meta tag found.
Please add one when using the Cordova-plugin-whitelist plugin.: 23.
我在头部添加元数据
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src: 'self' 'unsafe-inline' 'unsafe-eval'>
但同样的错误,在我使用应用内浏览器插件和其他 7 个网站链接的应用程序中。
【问题讨论】:
您是否正确安装了cordova-plugin-whitelist
- github.com/apache/cordova-plugin-whitelist 插件?之后,您必须将 <allow-navigation href="http://*/*" />
添加到您的 config.xml
感谢 Keval,添加后 现在我的应用程序工作正常。再次感谢。
相关How to configure Cordova-android 4.0 with white-list
当代码中缺少一个字符时会产生错误,为什么不允许少于六个字符的编辑?这个很容易修复,只是想在未来几秒钟内救别人。元标记的内容属性末尾缺少双引号。
【参考方案1】:
添加cordova-plugin-whitelist 后,您必须告诉您的应用程序允许访问所有网页链接或特定链接(如果您想保持特定链接)。
您可以简单地将其添加到您的 config.xml,它可以在您的应用程序的根目录中找到:
推荐在文档中:
<allow-navigation href="http://example.com/*" />
或:
<allow-navigation href="http://*/*" />
来自插件的文档:
导航白名单
控制 WebView 本身可以导航到哪些 URL。适用于 仅限***导航。
怪癖:在 Android 上,它也适用于非 http(s) 方案的 iframe。
默认情况下,只允许导航到 file:// URL。允许 其他 URL,您必须将标签添加到您的 config.xml:
<!-- Allow links to example.com --> <allow-navigation href="http://example.com/*" /> <!-- Wildcards are allowed for the protocol, as a prefix to the host, or as a suffix to the path --> <allow-navigation href="*://*.example.com/*" /> <!-- A wildcard can be used to whitelist the entire network, over HTTP and HTTPS. *NOT RECOMMENDED* --> <allow-navigation href="*" /> <!-- The above is equivalent to these three declarations --> <allow-navigation href="http://*/*" /> <allow-navigation href="https://*/*" /> <allow-navigation href="data:*" />
【讨论】:
@AmeePrajapati 试试***.com/questions/37044969/…【参考方案2】:您必须在应用的 index.html
的 head 部分添加 CSP 元标记
根据https://github.com/apache/cordova-plugin-whitelist#content-security-policy
内容安全政策
控制允许发出哪些网络请求(图像、XHR 等)(直接通过 webview)。
在 Android 和 ios 上,网络请求白名单(见上文)不 能够过滤所有类型的请求(例如
<video>
& WebSockets 没有被屏蔽)。因此,除了白名单之外,您还应该使用 Content Security Policy<meta>
标记在您的所有页面上。在 Android 上,系统 webview 中对 CSP 的支持以 KitKat(但适用于使用 Crosswalk WebView 的所有版本)。
以下是您的
.html
页面的一些示例 CSP 声明:<!-- Good default declaration: * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this: * Enable inline JS: add 'unsafe-inline' to default-src * Enable eval(): add 'unsafe-eval' to default-src --> <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *"> <!-- Allow requests to foo.com --> <meta http-equiv="Content-Security-Policy" content="default-src 'self' foo.com"> <!-- Enable all requests, inline styles, and eval() --> <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"> <!-- Allow XHRs via https only --> <meta http-equiv="Content-Security-Policy" content="default-src 'self' https:"> <!-- Allow iframe to https://cordova.apache.org/ --> <meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://cordova.apache.org">
【讨论】:
当我添加 CSP 声明时,谷歌地图的以下代码会像这样失败。任何想法 ? var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); //line 173 11-09 21:17:30.724: D/SystemWebChromeClient(25692): file:///android_asset/www/index.html: Line 173: Uncaught ReferenceError: google is not defined 我需要用 /> 关闭元标记才能被识别【参考方案3】:您的元标记中有错误。
你的:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src: 'self' 'unsafe-inline' 'unsafe-eval'>
更正:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/>
注意“script-src”后面的冒号,以及元标记的结束双引号。
【讨论】:
当我包含<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/>
live reload with ionic framework 停止工作,所以要小心其他人
@codePlusPlus 再次激活 Ionic livereload,将 http://localhost:35729
添加到 script-scr 指令并将 ws://localhost:35729
添加到 connect-src 指令。
@kolli,你能展示一下新指令的样子吗?目前尚不清楚如何将它们添加到指令中。
我看到信息在原始帖子中。但是要澄清一下:请注意,通过“添加”,这意味着您可以将script-src 'self' 'unsafe-inline' 'unsafe-eval'
替换为script-src 'self' http://localhost:35279 'unsafe-inline' 'unsafe-eval'
,并且您可以在内容属性的末尾添加一个带有分隔分号的新指令:; script-src ws://localhost:35279
更正上面...对于第二部分,它应该是 ; connect-src 'self' ws://localhost:35279
。请注意,在我添加“self”之前,我收到了一个错误(由于 CSP 违规,无法访问 file://对我来说,重新安装 whitelist 插件就足够了:
cordova plugin remove cordova-plugin-whitelist
然后
cordova plugin add cordova-plugin-whitelist
似乎从以前版本的 Cordova 更新不成功。
【讨论】:
【参考方案5】:对我来说,问题在于我使用的是过时版本的 cordova android 和 ios 平台。所以升级到 android@5.1.1 和 ios@4.0.1 解决了它。
您可以升级到这些特定版本:
cordova platforms rm android
cordova platforms add android@5.1.1
cordova platforms rm ios
cordova platforms add ios@4.0.1
【讨论】:
你是说android 5.1.1 吗? 我遵循了@Maxim 和 Pierre-Alexis de Solminihac 的建议,终于让我的应用程序运行良好。谢谢!【参考方案6】:还有一个关于连接的问题。有些安卓版本可以连接,有些不能。所以还有另一种解决方案
在 AndroidManifest.xml 中:
<application ... android:usesCleartextTraffic="true">
...
</application>
只需添加 'android:usesCleartextTraffic="true"'
问题终于解决了。
【讨论】:
以上是关于“未找到 Content-Security-Policy 元标记。”我的 phonegap 应用程序中的错误的主要内容,如果未能解决你的问题,请参考以下文章