问题描述
限时送ChatGPT账号..我知道如果我们在 HTML 中使用 iFrame，我们必须对它进行沙箱化 &将 'allow-scripts' 权限添加为 true.
但我的问题是我的纯 Angular JS 应用程序中根本没有 iFrame.当我在本地机器上运行它时，它工作正常.
当我将其部署到我的服务器时，Chrome 会显示此错误消息以及以下错误:
<块引用>拒绝加载样式 'bootstrap.min.css' 因为它违反了遵循内容安全策略指令:style-src 'self'".
阻止脚本执行'仪表板.html'因为文档的框架是沙盒的，并且允许脚本"权限未设置.
我不是从第 3 方站点或其他可能注入我的源代码的站点或其他地方调用该页面让它出现在 iframe 中.我检查了代码 &我可以确认根本没有 iframe.
顺便说一句，我使用的是非常旧版本的 Chrome (26) 和 Firefox (10) [组织限制].这也发生在 IE11 上(虽然没有显示错误消息)页面没有加载.
可能是什么原因造成的?我在这里错过了什么吗?任何指针将不胜感激.
下面是我正在尝试做的事情的快照......修剪掉了琐碎的部分......
<头><title>仪表板</title><link href="css/bootstrap.min.css";rel=样式表"><script src=js/jquery.min.js"></script><script src=js/angular.min.js"></script><script src=js/ui-bootstrap-tpls-0.6.0.js"></script><script src=js/bootstrap.min.js"></script><script src="js/notifications.js"></script><风格>身体 { 背景颜色:#F3F3F4;颜色:#676a6c；字体大小:13px;}</风格><脚本>var dashboardApp = angular.module('dashboard', ['ui.bootstrap', 'notificationHelper']);类型 = {应用程序:0，CTL:1}function DashboardCtrl($scope, $location, $timeout, $http, $log, $q) {$scope.environments = [ { ... }];$scope.columns = [ { ... } ];$scope.Type = window.Type;$scope.applications = [{ ... }];$scope.selectedEnv = null;var resetModel = 函数(应用程序){应用程序.forEach(功能(应用程序){var hosts=$scope.findHosts(app, $scope.selectedEnv);如果(主机){主机.forEach(功能(主机){$scope.initStatus(app.status,host);});}});};var timeoutPromise = null;$scope.initStatus = 函数(状态，主机){状态[主机]=[{...}];};}<body ng-controller="DashboardCtrl"><div class="request-notifications";ng-通知></div><div><标签集><tab ng-repeat="环境中的env";Heading="{{env.name}}";选择=设置(环境)"；active=env.tab_active"><div class="col-md-6";ng-repeat=列中的列"；ng-class="{'vertical-seperator':$first}"><div class="panel";ng-class="{'first-child':$first}"><div class="panel-heading"><h3>{{column.column}}</h3><div class="panel-body"><div class="frontends";ng-repeat=layer in column.layers"><h4>{{layer.name}}</h4><div class="category";ng-repeat=图层中的类别.categories"；ng-class =category.css"><div class="category-heading"><h4>{{category.name}}</h4>
<div class="category-body group";ng-repeat="group in category.groups"><div ng-if="!env[group.host]"><h4>{{group.name}}</h4><span class="label label-danger">未部署</span>
<div ng-repeat="host in env[group.host]"><div class="group-info"><div class="group-name">{{group.name}}</div><div class="group-node"><strong>节点:</strong>{{host}}</div>
<table class="table table-striped"><头><tr>...</tr></thead>
<tr class="testStatusPage";ng-repeat="应用程序中的应用程序 |filter: { column: column.column, layer: layer.name, category: category.name, group: group.name } : true"><!-- 应用程序主页链接--><td class="user-link";ng-if="app.type === Type.A ||app.type === Type.A1 ||app.type === Type.B ||app.type === Type.B1 ||app.type === Type.C"><a href={{app.link}}">{{app.text}}</a></td><td ng-if="app.status[host].statusCode == 0";class=result statusResult"><span class=label label-success">Success</span></td><td ng-if="app.status[svr].status != null &&app.status[host].status != 0"class="result statusResult">{{app.status[host].error}}</tr></tbody></tab></tabset>
</html>
解决方案 我们在 Jenkins userContent 目录中使用了此内容 HTML.我们最近升级到最新的 Jenkins 1.625 LTS 版本 &似乎他们引入了新的内容安全策略，将以下标头添加到响应标头 &浏览器只是拒绝执行样式表/Javascript 之类的东西.
X-Content-Security-Policy:沙箱；默认-src '无';img-src '自我';style-src '自我';
为了克服它，我们必须通过在 Jenkins 中重置以下属性来简单地删除此标头.
System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")
升级到 Jenkins 1.625 & 的人使用 userContent 文件夹可能会受到此更改的影响.
有关更多信息，请参阅 https://wiki.jenkins-ci/display/JENKINS/Configuring+Content+Security+Policy
I'm aware that if we use a iFrame in HTML we've to sandbox it & add the 'allow-scripts' permission to be true.
But my problem is I don't have a iFrame at all in my pure Angular JS application. When I run it on my local machine it works fine.
The moment I deploy it to my server, Chrome displays this error message along with the below error:
Refused to load the style 'bootstrap.min.css' because it violates the
following Content Security Policy directive: "style-src 'self'".
Blocked script execution in
'dashboard.html'
because the document's frame is sandboxed and the 'allow-scripts'
permission is not set.
I'm not invoking the page from a 3rd party site or elsewhere which could possibly inject my source & make it appear in a iframe. I inspected the code & I can confirm there are no iframes at all.
BTW, I use a very old version of Chrome (26) and Firefox (10) [Organisational restrictions]. This happens on IE11 as well (Though no error message displayed) the page doesn't load up.
What could be causing this ? Am I missing anything here ? Any pointers would be greatly appreciated.
Below is a snapshot of what I'm trying to do... Trivial parts trimmed out..
<html lang="en" ng-app="dashboard">
<head>
<title>Dashboard</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<script src="js/angular.min.js"></script>
<script src="js/ui-bootstrap-tpls-0.6.0.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/notifications.js"></script>
<style>
body { background-color: #F3F3F4; color: #676a6c; font-size: 13px;}
</style>
<script>
var dashboardApp = angular.module('dashboard', ['ui.bootstrap', 'notificationHelper']);
Type = {
APP : 0, CTL : 1
}
function DashboardCtrl($scope, $location, $timeout, $http, $log, $q) {
$scope.environments = [ { ... }];
$scope.columns = [ { ... } ];
$scope.Type = window.Type;
$scope.applications = [{ ... }];
$scope.selectedEnv = null;
var resetModel = function(applications) {
applications.forEach(function(app) {
var hosts=$scope.findHosts(app, $scope.selectedEnv);
if(hosts){
hosts.forEach(function(host){
$scope.initStatus(app.status,host);
});
}
});
};
var timeoutPromise = null;
$scope.initStatus = function (status,host) {
status[host]=[{
...
}];
};
}
</script>
</head>
<body ng-controller="DashboardCtrl">
<div class="request-notifications" ng-notifications></div>
<div>
<tabset>
<tab ng-repeat="env in environments" heading="{{env.name}}" select="set(env)" active="env.tab_active">
<div class="col-md-6" ng-repeat="column in columns" ng-class="{'vertical-seperator':$first}">
<div class="panel" ng-class="{'first-child':$first}">
<div class="panel-heading">
<h3>{{column.column}}</h3>
</div>
<div class="panel-body">
<div class="frontends" ng-repeat="layer in column.layers">
<h4>{{layer.name}}</h4>
<div class="category" ng-repeat="category in layer.categories" ng-class="category.css">
<div class="category-heading">
<h4>{{category.name}}</h4>
</div>
<div class="category-body group" ng-repeat="group in category.groups">
<div ng-if="!env[group.host]">
<h4>{{group.name}}</h4>
<span class="label label-danger">Not deployed</span>
</div>
<div ng-repeat="host in env[group.host]">
<div class="group-info">
<div class="group-name">{{group.name}}</div>
<div class="group-node"><strong>Node : </strong>{{host}}</div>
</div>
<table class="table table-striped">
<thead>
<tr>
...
</tr>
</thead>
<tbody>
<tr class="testStatusPage" ng-repeat="app in apps | filter: { column: column.column, layer: layer.name, category: category.name, group: group.name } : true">
<!-- Application Home Links -->
<td class="user-link" ng-if="app.type === Type.A || app.type === Type.A1 || app.type === Type.B || app.type === Type.B1 || app.type === Type.C"><a href="{{app.link}}">{{app.text}}</a></td> <td ng-if="app.status[host].statusCode == 0" class="result statusResult"><span class="label label-success">Success</span></td>
<td ng-if="app.status[svr].status != null && app.status[host].status != 0" class="result statusResult"><span class="label label-danger">{{app.status[host].error}}</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</tab>
</tabset>
</div>
</body>
</html>
解决方案 We were using this content HTML in a Jenkins userContent directory. We recently upgraded to the latest Jenkins 1.625 LTS version & it seems they've introduced new Content security policy which adds the below header to the response headers & the browsers simply decline to execute anything like stylesheets / Javascripts.
X-Content-Security-Policy: sandbox; default-src 'none'; img-src 'self'; style-src 'self';
To get over it, we had to simply remove this header by resetting the below property in Jenkins.
System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")
Those who upgrade to Jenkins 1.625 & use the userContent folder might be affected by this change.
For more information refer https://wiki.jenkins-ci/display/JENKINS/Configuring+Content+Security+Policy
这篇关于Jenkins 错误 - 在 <URL> 中阻止脚本执行.因为文档的框架是沙盒的，并且没有设置“允许脚本"权限的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
更多推荐
[db:关键词]
本文发布于:2023-04-22 06:49:01，感谢您对本站的认可！
版权声明:本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
本文标签：错误 Jenkins
- 上一篇： 香港伦敦金交易平台排行榜（2022最新版）
- 下一篇： 在将jqPlot图形保存到图像文件时隐藏轴标签(Axis label hidden while saving a jqPlot graph to an image file)
>www.elefans.com
编程频道|电子爱好者 - 技术资讯及电子产品介绍！
热门文章
从源“http://localhost:5173”访问“...”处的 XMLHttpRequest 已被 CORS 策略阻止 
币安API错误代码1102，未发送强制参数“时间戳” 
如果我在bot telegram nodejs中使用editMessageMedia，我如何制作标题 
在 Node.js 中从网络流创建 blob 
使用 Node.js / ES6 如何设置 dotenv 文件的自定义路径？ 
使用 NODE.JS 和 html5 实现低延迟（50 毫秒）视频流 
如何从nodejs连接laravel>laravel 
使用nodejs观看目录 
如果文件包含特定字符串，如何跳过 GitHub 工作流程步骤？ 
FirebaseError：无法从.env加载环境变量
发布评论