前言
在 Web 开发过程中，集成第三方工具和 API 是常见的做法。在前端开发中，通常可以通过 NPM 包管理工具来获取和安装需要的包。本文将介绍 npm 包 mozaik-ext-dynatrace-api，它是一个可以帮助前端开发者在 Dynatrace 上获取和展示性能数据的工具包。
安装
在使用 mozaik-ext-dynatrace-api 前，需要先安装它。可以通过以下命令在项目中获取它：
npm install mozaik-ext-dynatrace-api --save
其中，--save 参数表明将该包加入到项目的依赖中，并将依赖信息保存在 package.json 文件中。
配置
安装完成后，需要对 mozaik-ext-dynatrace-api 进行配置，以便它可以正常获取和展示 Dynatrace 上的性能数据。
首先，在项目根目录下新建一个 .env 文件，用于存放配置信息。在其中添加以下信息：
MOZAIK_EXT_DYNATRACE_API_TOKEN=<your-dynatrace-api-token> MOZAIK_EXT_DYNATRACE_API_BASE_URL=https://<your-dynatrace-url>/e/<your-dynatrace-environment-id>/api/v1
其中，<your-dynatrace-api-token> 和 <your-dynatrace-url> 分别代表你的 Dynatrace API 认证令牌和 Dynatrace API URL。<your-dynatrace-environment-id> 则是你的 Dynatrace 环境 ID。这些信息可以通过 Dynatrace 门户网站获取。
此外，还需要在项目的 mozaik 配置文件中加入以下内容：
-- -------------------- ---- -------
-------------- - -
-- ---
---- -
---------- -
--------- -------------------------------------------
-------- ---------------------------------------------
-
--
-- ---
--这样配置完成后，就可以开始使用 mozaik-ext-dynatrace-api 了。
下面，我们将分别介绍该包中提供的两个模块的使用方法。
应用模块
在通过 npm 安装了 mozaik-ext-dynatrace-api 后，可以在项目中引入它。首先需要在需要使用性能数据的页面中，使用以下代码引入 DynatraceApplication 模块：
import { DynatraceApplication } from 'mozaik-ext-dynatrace-api';然后可以根据需要，使用以下方法获取应用程序的性能数据：
DynatraceApplication.fetch(applicationId, timeframe)
.then(data => {
console.log(data);
});其中，applicationId 和 timeframe 分别代表应用的 ID 和时间范围。例如：
DynatraceApplication.fetch('webshop-production', 'last_7_days')
.then(data => {
console.log(data);
});以上代码将输出 webshop-production 应用在过去 7 天内的性能数据。
服务模块
在使用服务模块前，需要先导入 DynatraceService 模块：
import { DynatraceService } from 'mozaik-ext-dynatrace-api';然后使用以下方法获取服务性能数据：
DynatraceService.fetch(serviceId, timeframe, [type])
.then(data => {
console.log(data);
});其中，serviceId 和 timeframe 分别代表服务的 ID 和时间范围。type 参数可选，用于指定性能数据类型，包括响应时间、吞吐量和错误率。例如：
DynatraceService.fetch('webshop-backend', 'last_7_days', 'response_time')
.then(data => {
console.log(data);
});以上代码将输出 webshop-backend 服务在过去 7 天内的响应时间性能数据。
结语
本文简要介绍了 npm 包 mozaik-ext-dynatrace-api 的使用方法。通过使用该包，我们可以轻松获取和展示 Dynatrace 上的性能数据，从而优化我们的网站和应用程序。
示例代码：
-- -------------------- ---- -------
------ - --------------------- ---------------- - ---- ---------------------------
------------------------------------------------ --------------
---------- -- -
------------------
---
----------------------------------------- -------------- ----------------
---------- -- -
------------------
---来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562ad81e8991b448dfea9