图片跨域问题而无法导出Excel或PDF之解决方法
ActiveReportsJS 提供了图片控件,可以在报表中设计显示图文混排的报表模板,而经常我们也需要将电子签名等信息展示在报表中,也尝尝作为图片格式的引用而加载。图片来源可以为 外部的URL, 报表内嵌的图像,数据字段的二进制图片信息。而很多时候我们会引用图片来自于外部的URL,有可能与当前报表服务器是不同域名的服务。大家就会很困惑图片可以在报表中正常展示,但是在导出时就无法显示。打开浏览器控制台,就会发现,提示以下错误信息:
Access to XMLHttpRequest at 'http://localhost:8000/001.png' from origin 'http://192.168.3.39:8060' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
很明显是请求图片时,图片的跨域引起的错误,导致报表无法将HTML 导出为PDF 或Excel文件,因此无法成功导出。
解决方法,自然就是在图片的服务端配置允许跨域,允许外部请求请求图片。
图片的服务端,可以配置以下信息:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<mimeMap fileExtension=".rdlx-json" mimeType="application/json" />
</staticContent>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Headers" value="Content-Type, api_key, Authorization" />
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
以IIS 部署网站为例,图片网站,切换到【功能视图】选择HTTP请求头
配置完成后重启图片服务端。
在进入报表客户端,强制刷新浏览器,重新进入报表加载页面:
如果有人反馈配置了允许跨域,但仍有问题,那就请检查跨域是否在图片端配置,而不是报表服务端,以及配置的属性是否正常。
如果还是有问题,建议将图片改为报表内嵌图像资源,或者二进制。
页:
[1]