内容安全政策和外部JavaScript文件

问题描述：

我目前正在开发一个使用Phonegap/Cordova的酒店客户端的Android应用程序。该应用程序是从他们的WordPress的网站下载菜单和内容，所以我需要从他们的实时url加载图像。我有这个工作，通过对config.xml文件进行一些调整并向每个页面添加以下元标记;内容安全政策和外部JavaScript文件

<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' *">

在应用程序中，他们希望他们的预订功能是由他们的预订供应商以Javascript形式提供的。上面的元标签会阻止预订表单加载（当我移除标签时它会起作用）。

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

当您在没有Metatag的情况下运行它时，您会看到它的工作原理。我添加了脚本src并尝试了一些从https://content-security-policy.com/设置的设置，包括添加object-src & frame-src。

请帮助

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>

你的意思是你得到'混合内容的错误：在“https://jsfiddle.net/bp3435w4/”加载页面通过HTTPS，但要求一个不安全的资源的“http ：//securebooking.eviivo.com/mywebsite/DutchmanFY16AH.home视图名=在线订购...预订＆STARTDATE = 06/12/2016年＆晚= 1＆adults1 = 1＆industrytype = 1＆children1 = 0' ？。此请求已被阻止;内容必须通过HTTPS提供.' – mplungjan

嗨..对不起...它可以在http和https上工作...我在JSFiddle资源中添加了https，以便使用JSFiddle – DannyBoy

答

现在我有这个工作谢谢。我只需要将'unsafe-eval'添加到script-src属性中。

答

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-eval' '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>

内容安全政策和外部JavaScript文件

相关推荐