cloudwatch_用于CloudWatch指标的简单实时仪表板

cloudwatch

Vue CloudWatch仪表板 (Vue CloudWatch Dashboard)

This project facilitates live monitoring CloudWatch metrics. All desired metrics are specified in JSON format.

该项目有助于实时监视CloudWatch指标。 所有所需指标均以JSON格式指定。

PWA functionality allows the app to be cached on a mobile device after it's been served via npm run serve command.

通过PWA功能，可以在通过npm run serve命令提供服务后将应用程序缓存在移动设备上。

A major problem with accessing CloudWatch metrics data is that metrics are often only reported when an event occurs. This results in data with many missing datapoints. The server-side Lambda function included in the project pads data with zero values whenever it is found to be missing.

访问CloudWatch指标数据的主要问题是，通常仅在事件发生时才报告指标。 这导致数据中缺少许多数据点。 每当发现丢失时，项目中包含的服务器端Lambda函数就会使用零值填充数据。

The period, backfill time, and refresh interval are all configurable. They have been set with reasonable values of five minutes, five minutes, and two hours, respectively. Please note that AWS promises that CloudWatch metrics will be populated with a latency of at most ten minutes.

周期，回填时间和刷新间隔都是可配置的。 它们的合理值分别设置为五分钟，五分钟和两小时。 请注意，AWS承诺将为CloudWatch指标填充最多十分钟的延迟。

The charting capabilities of this project are limited in favor of a simple means of interacting with CloudWatch metrics data. More charting functionality may be added at a later date.

为了支持与CloudWatch指标数据进行交互的简单方法，该项目的图表功能受到限制。 以后可能会添加更多图表功能。

指令 (Commands)

First, clone the repo. Run npm install to install dependencies. Ensure the rest of the setup is complete. The steps to setup are as follows.

首先，克隆存储库。 运行npm install安装依赖项。 确保其余设置完成。 设置步骤如下。

• Create a metrics.json file appropriate to the metrics you'd like to pull from CloudWatch.

  创建适合您要从CloudWatch提取的指标的metrics.json文件。

• Create .env.{NODE_ENV} file(s) appropriate to the way(s) in which you intend to build the web application. A .env.development file and .env.production file are recommended.

  创建适合于您打算构建Web应用程序的方式的.env.{NODE_ENV}文件。 建议使用.env.development文件和.env.production文件。

• The lambda function uploaded to AWS. You can simply use the included archive.

  lambda函数已上载到AWS。 您可以简单地使用随附的存档 。

• An API properly set up using API Gateway. See the Lambda Function section for more details.

  使用API​​网关正确设置了API。 有关更多详细信息，请参见Lambda函数部分。

To build for development including hot reload, run the following.

要为包括热重装在内的开发进行构建，请运行以下命令。

# build for development
npm run dev

To fully optimize the web application, run the following. This bundles the application into a dist directory. The production build also includes PWA support, which allows the web application to be cahced on a mobile device. Once the application is being served, access it on a mobile device and save it to your homescreen. The server can now be taken down as the application is cached and fully functional on your device.

要完全优化Web应用程序，请运行以下命令。 这会将应用程序捆绑到dist目录中。 生产版本还包括PWA支持，允许将Web应用程序存储在移动设备上。 投放应用程序后，请在移动设备上对其进行访问并将其保存到主屏幕。 现在可以在设备上缓存应用程序并使其正常运行后关闭服务器。

# build for production
npm run build

# serve the bundled dist folder in production mode
npm run serve

证书 (Credentials)

The app expects there to be a .env.{NODE_ENV} file in the following format:

该应用程序希望以以下格式存在.env.{NODE_ENV}文件：

API_ENDPOINT={YOUR_API_ENDPOINT}
API_KEY={YOUR_API_KEY}

Replace NODE_ENV with development, test, or production. These will be loaded when built for the respective environments and used to interact with your API. See the next section for setting up an endpoint using AWS Gateway and Lambda.

用development ， test或production代替NODE_ENV 。 这些代码将在为相应环境构建时加载，并用于与您的API进行交互。 有关使用AWS Gateway和Lambda设置终端节点的信息，请参阅下一节。

翻译自: https://vuejsexamples.com/a-simple-live-dashboard-for-cloudwatch-metrics/

cloudwatch