內容安全策略和外部Javascript文件

Question

我目前正在為酒店客戶使用Phonegap / Cordova開發一個Android應用程序。 該應用程序是從他們的wordpress網站下載菜單和內容，所以我需要從他們的實時網址加載圖像。 我通過對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' *">

同樣在應用程序中，他們希望他們的預訂設施被集成，由他們的預訂供應商以Javascript的形式提供。 上面的元標記正在停止加載預訂表格（當我刪除標簽時它會起作用）。

您可以在我的JSFiddle頁面或下面查看代碼。

在沒有Metatag的情況下運行它時，您將看到它的工作原理。 我添加了script-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> 

Answer 1

我現在有這個工作，謝謝你。 我只需要在script-src屬性中添加'unsafe-eval'。

Answer 2

 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>