使用 OpenTelemetry (OTel) 实现 Elastic RUM (真实用户监控)

news/2024/11/13 10:21:57/文章来源:https://www.cnblogs.com/wapmgc/p/18371169

本文继续介绍 OpenTelemetry 与 Elastic Observability 的结合,详细讲解了如何使用 Docker Compose 或 Kubernetes 设置 OpenTelemetry 演示。

Elastic 真实用户监控(RUM)捕捉用户与网页浏览器的交互,并从性能角度提供有关“真实用户体验”的详细视图。

Elastic 的 RUM Agent 是一个 JavaScript 代理,意味着它支持任何基于 JavaScript 的应用程序。RUM 可以为您的应用程序提供宝贵的见解。

RUM (真实用户监控) 的好处

  • RUM 性能数据可以帮助您识别瓶颈,并发现网站性能问题如何影响访问者的体验。
  • RUM 捕捉的用户代理信息使您能够识别客户最常使用的浏览器、设备和平台,从而对应用程序进行有针对性的优化。
  • 结合位置信息,RUM 的个体用户性能数据帮助您了解全球范围内网站的区域性能。
  • RUM 提供了有关应用程序服务级别协议(SLA)的洞察和测量。
  • RUM 收集的客户访问和点击行为信息对于开发团队了解新功能的影响非常有用。

我们将逐步介绍如何在应用程序中启用 RUM(真实用户监控),并在 Elasticsearch Observability 中进行监控。

从 Github 仓库中下载并安装应用程序,无论是 Docker 还是 Kubernetes,并按照 OpenTelemetry 与 Elastic Observability 的描述进行配置。

一旦应用程序启动并运行,前往您的部署 → 集成 → APM → RumJS → 复制如下配置。

复制以下配置设置,将代理安装为依赖项。

npm install @elastic/apm-rum --save

然后,您可以像下面这样初始化和配置代理。有关更多详细信息,请参阅集成文档。

另外,复制以下配置设置,通过 Script Tags 设置代理。

现在我们将使用这些设置来配置前端应用程序以启用 RUM。

导航到您的应用程序服务文件夹(opentelemetry-demo/src/frontend/Dockerfile),并更新 Docker 文件为:

RUN npm install @elastic/apm-rum --save

导航到应用程序(前端)服务文件夹(opentelemetry-demo/src/frontend/pages/_app.tsx),并更新 RUM 的配置。 您可以自定义服务名称和环境参数。

// 配置 RUM 代理
import { init as initApm } from '@elastic/apm-rum';
if (typeof window !== 'undefined'){initApm({serviceName: 'otel-frontend',    serverUrl: '<url>',serviceVersion: '',environment: 'demo'});
}

服务名称:在 APM 界面中代表您的应用程序。

服务版本:这是应用程序的版本号。此版本号也用于 APM 服务器查找正确的源映射。

服务器 URL:这是 APM 服务器的 URL。请注意,APM 服务器 URL 通常可以从公共互联网访问,因为您的 RUM 代理从互联网上的终端用户浏览器向其报告数据。

环境:在共享环境中,这对更好的过滤非常有帮助。

登录 Kibana,然后导航到 Observability 的用户体验部分,分析 RUM 数据并查看可用的指标。


参考文献:

https://www.linkedin.com/pulse/opentelemetry-elastic-observability-rahul-ranjan-3l6bc/

https://opentelemetry.io/docs/demo/

https://www.elastic.co/guide/en/observability/8.14/apm-configuration-rum.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/784725.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

我们是如何测试数百个页面的

自动化测试是确保软件质量和提供良好用户体验的有效方式。在 Woovi,我们拥有数千个页面,用户与我们的第一次接触通常会通过这些展示我们产品的页面。因此,我们需要确保每个页面都能正常运行。每一个访问我们页面的用户都代表着一个新的潜在客户。 测试页面的挑战 Woovi 的页…

MBR30100CT-ASEMI低压降肖特基MBR30100CT

MBR30100CT-ASEMI低压降肖特基MBR30100CT编辑:ll MBR30100CT-ASEMI低压降肖特基MBR30100CT 型号:MBR30100CT 品牌:ASEMI 封装:TO-220 批号:最新 恢复时间:35ns 最大平均正向电流(IF):30A 最大循环峰值反向电压(VRRM):100V 最大正向电压(VF):0.70V~0.90V 工作温度…

浅谈HTML

html是一种标签语言,用来写前端页面的,通常结合CSS和js来写。 主要用于web开发,B/S架构的系统,所谓B/S其实也是一种特殊的C/S,只不过此时浏览器变成了客户端。 B/S架构:B是browser,S是server C/S架构:C是client,S是server **什么是 HTML?** HTML 是用来描述网页的一种语…

小学智慧教育平台(网址:https://basic.smartedu.cn

信息科技教学指南及配套课件,可在国家中小学智慧教育平台免费使用导读:日前,教育部发布关于印发《2024年义务教育国家课程教学用书目录(根据2022年版课程标准修订)》的通知,根据2022年版义务教育课程标准修订的教材将于2024年秋季学期陆续投入使用。注:以下附文件全文及…

建立自己的Github博客网站

建立自己的博客网站来装逼是不错的方式,在没有代码基础的情况下,Github可以提供免费的网站服务,你只需要有一个GitHub账号就可以了(注意GitHub需要用邮箱注册),在注册完成剩下的就按接下的步骤就行了 1 相关工具安装 1.Node环境 Hexo是基于 Node.js 驱动的一款博客框架,所以…

jian-li-blog

建立自己的博客网站来装逼是不错的方式,在没有代码基础的情况下,Github可以提供免费的网站服务,你只需要有一个GitHub账号就可以了(注意GitHub需要用邮箱注册),在注册完成剩下的就按接下的步骤就行了 1 相关工具安装 1.Node环境 Hexo是基于 Node.js 驱动的一款博客框架,所以…

VSCode系列 - 如何用VSCode搭建C++高效开发环境(2)

1. 插件的用法1.1. C/C++1.1.1. 插件介绍 1.1.2. 插件配置1.2. Clang-Format 1.3. cpp-check-lint1.3.1. cpplint 1.3.2. cppcheck 1.3.3. 插件的使用1.4. C/C++ Advanced Lint1.4.1. 插件介绍 1.4.2. 插件配置1.5. Bracket Pair Colorizer1.5.1. 插件介绍 1.5.2. 功能配置1.6.…

求教!!!

有哪位大佬知道这是什么图(箭头),如何以前端的方式实现呢

顶尖企业级项目管理软件评测:哪个适合你?

国内外主流的 10 款企业级项目管理软件对比:PingCode、Worktile、禅道、TAPD、云效、Teamwork、Quickbase、Notion、Jira、Procore。在选择企业级项目管理软件时,许多团队面临着如何找到既能满足他们复杂项目需求又具有成本效益的解决方案的挑战。市场上众多的选项可能让人感…

OB逻辑导数

OB逻辑导数方式outfile方式导出数据到文件、CSV dbcat工具导出、导入数据 dataX工具导出数据(不介绍) OB4.x新特性旁路导入数据<load data、insert (append) into select> OMS工具数据导出、导入、增量数据准实时同步(单独篇章介绍)存储过程造数据(oracle租户) 创建…

泊松自助法(Poisson Bootstrap Sampling):大型数据集上的自助抽样

自助抽样可以根据收集的样本推断总体的统计特征(如均值、十分位数、置信区间)。泊松自助抽样(Poisson Bootstrap Sampling)是一种用于统计分析中的重采样技术,特别是在机器学习和数据科学中用于模型评估和误差估计。这种方法的一个特点是保留了样本中数据点出现的自然波动,…