报表控件stimulsoft操作：使用 CDN 服务部署 Stimulsoft 组件

发布时间 : 2025-02-21 10:46:05.703|阅读 33 次

概述：在本文中，我们将讨论在使用纯 JavaScript 的应用程序中快速部署 Stimulsoft 的过程。主要重点是通过 CDN 服务连接脚本文件。这样可以轻松地将必要的脚本集成到 HTML 页面中，而无需在本地下载它们。

使用 CDN 服务的主要好处

加载速度快。文件从最靠近用户的服务器加载，加快页面加载速度；
减少服务器负载。脚本由第三方服务器存储和分发，减少用户服务器的负载；
自动更新。始终可以连接最新版本的库，无需手动更新；
缓存。浏览器和网络可以缓存 CDN 文件，减少重复请求的加载时间；
安全性。主要的 CDN 提供针对 DDoS 等攻击的保护并使用加密连接 (HTTPS)。

因此，使用 CDN 服务通常既合理又高效。

用于分发 Stimulsoft 的 CDN 服务

您可以通过以下服务访问脚本文件：

网址： cdn.jsdelivr.net；
请登录 unpkg.com。

示例项目

首先，让我们创建一个 HTML 文件作为应用程序的入口点。默认情况下，此文件名为index.html。

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
   
</body>
</html>

使用 CDN 服务，您可以通过stimulsoft-reports-js和stimulsoft-dashboards-js的npm包中的 URL 访问脚本文件。例如，使用 cdn.jsdelivr.net 服务：index.html

...
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js/Scripts/stimulsoft.reports.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js/Scripts/stimulsoft.designer.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js/Scripts/stimulsoft.viewer.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js/Scripts/stimulsoft.blockly.editor.js"></script>
...

在这种情况下，将加载最新版本的脚本文件。但是，您始终可以加载特定 Stimulsoft 软件包版本的脚本文件。为此，请在 CDN URL 中使用 @ 符号，后跟软件包版本号。例如：
index.html

...
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js@2025.1.4/Scripts/stimulsoft.reports.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js@2025.1.4/Scripts/stimulsoft.designer.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js@2025.1.4/Scripts/stimulsoft.viewer.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/stimulsoft-reports-js@2025.1.4/Scripts/stimulsoft.blockly.editor.js"></script>
...

之后，只需定义一个函数来初始化报告查看器：
index.html

...
<script type="text/javascript">
	function onLoad() {
		var report = new Stimulsoft.Report.StiReport();
		report.loadFile('reports/Report.mrt');

		var viewer = new Stimulsoft.Viewer.StiViewer();
		viewer.renderHtml('content');
		viewer.report = report;
	}
</script>

...

<body onload="onLoad()">
	<div id="content"></div>
</body>
...

接下来，我们可以运行该项目。但是，请务必记住，由于浏览器的安全策略，浏览器无法访问文件系统。为了确保本地项目正确运行，应使用各种 Web 服务器。例如，您可以全局安装http-server或serve，然后从项目根文件夹中的命令行启动 Web 服务器。在这种情况下，index.html 将使用 Stimulsoft 查看器在浏览器中打开。

通过 CDN 连接脚本文件是一种将 Stimulsoft 集成到 Web 应用程序中的简单快捷的方法。使用cdn.jsdelivr.net和unpkg.com等服务，您可以加载最新或特定版本的脚本文件，而无需将它们存储在本地。这简化了开发和部署，同时减少了服务器负载，而不会影响安全性。

现在，按照这些说明，您可以使用 CDN 服务轻松地将报告和数据分析系统集成到您的应用程序中。

————————————————————————————————————————

慧都是Stimulsoft在中国的官方授权代理商，提供Stimulsoft系列产品免费试用，咨询，正版销售等于一体的专业化服务。

下载|体验更多Stimulsoft产品，请联系在线客服咨询，或拨打产品热线：023-68661681

加入图表报表技术交流QQ群（740060302），与更多小伙伴一起探讨提升开发技能。

上一篇：【实用技能】如何在Stimulsoft产品中使用用户函数，快速创建报表及仪表盘下一篇：报表控件stimulsoft教程：使用 JoinType 关系参数创建仪表盘