InfluxDB v2 JavaScript 客户端库，用于 Web 浏览器

在浏览器和前端客户端中使用 InfluxDB v2 JavaScript 客户端库，以将数据写入 InfluxDB 3 Core 数据库。

此库支持前端和服务器端环境，并提供以下发行版

• ECMAScript 模块 (ESM) 和 CommonJS 模块 (CJS)
• 捆绑的 ESM
• 捆绑的 UMD

本指南假定您对 JavaScript、浏览器环境和 InfluxDB 有一定的了解。如果您刚开始使用 InfluxDB，请参阅InfluxDB 入门指南。

1. 避免将令牌发送到公共客户端，例如 Web 浏览器和移动应用程序。将发送到客户端设备的任何应用程序密钥都视为公开的，而不是机密的。

2. 尽可能使用短寿命的只读令牌，以防止未经授权的写入和删除。

• 开始之前
• 与模块捆绑器一起使用
• 将捆绑的发行版与浏览器和模块加载器一起使用
• 开始使用示例应用程序

开始之前

1. 安装 Node.js 以服务您的前端应用程序。

2. 确保 InfluxDB 正在运行，并且您可以连接到它。有关使用什么 URL 连接到 InfluxDB 3 Core 集群的信息，请联系您的 InfluxData 客户代表。

与模块捆绑器一起使用

如果您使用像 Webpack 或 Parcel 这样的模块捆绑器，请安装 @influxdata/influxdb-client-browser。

将捆绑的发行版与浏览器和模块加载器一起使用

1. 为您的脚本配置 InfluxDB 属性。

   <script>
     window.INFLUX_ENV = {
       url: 'https://localhost:8181',
       token: 'DATABASE_TOKEN'
     }
   </script>
   

2. 从最新的客户端库浏览器发行版导入模块。@influxdata/influxdb-client-browser 导出捆绑的 ESM 和 UMD 语法。

   ESM UMD

   <script type="module">
     import {InfluxDB, Point} from 'https://unpkg.com/@influxdata/influxdb-client-browser/dist/index.browser.mjs'
   
     const influxDB = new InfluxDB({INFLUX_ENV.url, INFLUX_ENV.token})
   </script>
   

   <script src="https://unpkg.com/@influxdata/influxdb-client-browser"></script>
   <script>
     const Influx = window['@influxdata/influxdb-client']
   
     const InfluxDB = Influx.InfluxDB
     const influxDB = new InfluxDB({INFLUX_ENV.url, INFLUX_ENV.token})
   </script>
   

导入客户端库后，您就可以开始使用示例应用程序写入数据了。

开始使用示例应用程序

客户端库包含一个示例浏览器应用程序，该应用程序将数据写入您的 InfluxDB 实例。

1. 克隆 influxdb-client-js 仓库。

2. 导航到 examples 目录

   cd examples
   

3. 使用您的 InfluxDB 3 Core 集群 URL、您的数据库名称作为 bucket、任意字符串作为 org 和您的数据库令牌更新 ./env_browser.js。

4. 运行以下命令以在 http://localhost:3001/examples/index.html 启动应用程序

   npm run browser
   

   index.html 加载 env_browser.js 配置、客户端库 ESM 模块以及浏览器中的应用程序。

有关更多示例，请参阅如何使用 Node.js 的 JavaScript 客户端库写入数据。