javascript - Content-Security-Policy 和外部 Javascript 文件

Question

我目前正在使用 Phonegap/Cordova 为酒店客户开发一个 Android 应用程序。该应用程序是从他们的 wordpress 网站下载菜单和内容，所以我需要从他们的实时 url 加载图像。我通过对 config.xml 文件进行一些调整并将以下元标记添加到每个页面来实现此目的；

<meta http-equiv="Content-Security-Policy" content="default-src 'self' *; script-src 'unsafe-inline' 'self' *;style-src 'unsafe-inline' 'self' *;img-src 'unsafe-inline' 'self' *">

他们还希望在应用程序中集成他们的预订工具，这是由他们的预订 vendor 以 Javascript 的形式提供的。上面的元标签阻止了预订表格的加载(当我删除标签时它起作用了)。

代码可以在我的JSFiddle Page上查看或以下。

当您在没有 Metatag 的情况下运行它时，您会发现它可以正常工作。我已经添加了 script-src 并尝试了来自 https://content-security-policy.com/ 的一些设置。包括添加对象源和框架源。

请帮忙

eviivo.availabilitychecker.create('#availabilitychecker', {
  industryTypes: [1],
  allowCrossDomainTracking: true,
  template: 'horizontal'
});

<style type='text/css'> </style> 

<meta http-equiv="Content-Security-Policy" content="default-src 'self' *; script-src 'unsafe-inline' 'self' *;style-src 'unsafe-inline' 'self' *;img-src 'unsafe-inline' 'self' *"> 


<style type='text/css'>

.eviivo_availabilitychecker {
  width: auto !important;
  height: auto !important;
  color: #333333 !important;
  background: #ffffff !important;
  border: 1px solid #DDDDDD !important;
  font-size: 12px !important;
  font-family: Arial !important;
}
.eviivo_title span {
  color: #000000 !important;
  font-size: 12px !important;
  font-family: Arial !important;
}
.eviivo_submit a {
  color: #FFFFFF !important;
  background: #F28226 !important;
  border: 1px solid #CCCCCC !important;
  font-size: 12px !important;
  font-family: Arial !important;
}
</style>

<script src="https://securebooking.eviivo.com/DutchmanFY16AH.availabilitychecker.1.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="availabilitychecker"></div>

Answer 1

我现在已经开始工作了，谢谢。我只需要将“unsafe-eval”添加到 script-src 属性即可。