我正在尝试将ssrs报告实现到我的Angular应用程序中。这是一些代码: 模板:
<div panel-charts style="width:100%:height:100%"
</div>
指令:
a.directive('panelCharts', function () {
return {
link: function (scope, elem, attrs) {
$(elem).load('http://localhost/Reportserver?/casechart&Title=abc');
}
}
});
我的应用程序root是localhost:7063。
我得到以下内容: XMLHttpRequest无法加载http://localhost/Reportserver?/casechart&Title=abc。 No&#39; Access-Control-Allow-Origin&#39;标头出现在请求的资源上。起源&#39; http://localhost:7063&#39;因此不允许访问。响应的HTTP状态代码为401。
我明白我的问题在于CORS。我已将此添加到我的web.config:
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
这没有帮助。但是当我点击它时,我有一个按钮触发以下内容:
<button type="button" style="width:auto;" ng-click="runReport()">
Test
</button>
这在控制器中:
$scope.runReport = function () {
var win = window.open('http://localhost/Reportserver?/casechart&Title=abc', '_blank');
}
然后它有效。
知道如何在不点击按钮的情况下使其工作吗?
由于
编辑1。 请求:
Request URL:http://localhost/Reportserver?/casechart&Title=abc
Request Method:GET
Status Code:401 Unauthorized
Remote Address:10.229.232.73:80
请求标题:
Accept:text/html, */*; q=0.01
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:localhost
Origin:http://localhost:7063
Referer:http://localhost:7063/Main.aspx
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.109 Safari/537.36
答案 0 :(得分:3)
由于浏览器安全限制,大多数&#34; Ajax&#34;请求是主题 同源政策;请求无法成功检索 来自不同域,子域,端口或协议的数据。
您需要在模板上添加iframe
,而不是使用.load
jQuery方法,因为script
&amp; css
报告应用程序所需的SSRS
文件不会加载到页面文档中。
element.append('<iframe src="http://localhost/Reportserver?/casechart&Title=abc" width="500px" height="500px"></iframe>')
答案 1 :(得分:1)
如果您只想在新窗口中打开报告,只需在指令中调用window.open
:
a.directive('panelCharts', function () {
return {
link: function (scope, elem, attrs) {
window.open('http://localhost/Reportserver?/casechart&Title=abc');
}
}
});
CORS仅适用于AJAX请求,例如jQuery&#39; .load
,它们在当前页面内异步执行请求。
但是,如果你真的想通过AJAX加载报告并在当前页面中显示它,那么设置Access-Control-Allow-Origin
标题是正确的方法。
在旁注中:出于可测试性原因,访问全局window
对象的首选方法是$window
服务(see docs)。