Elasticvue安装与使用指南

Elasticvue是一个免费开源的Elasticsearch图形化管理界面，支持浏览器扩展、桌面应用、Docker容器和Web版本等多种使用方式。本文将详细介绍Elasticvue的安装配置和使用方法。

项目概述

Elasticvue是一个基于Vue 3开发的Elasticsearch管理工具，提供以下核心功能：

• 集群概览和健康状态监控
• 索引和别名管理
• 分片管理
• 文档搜索和编辑
• REST查询接口
• 快照和存储库管理
• 多语言支持（中文、英文、法文、俄文、日文、意大利文）

安装方式

桌面应用（推荐）

桌面应用提供最佳的使用体验，支持Windows、macOS和Linux系统：

• Windows: 下载 .msi安装包
• macOS: 下载 x86 .dmg 或 aarch64 .dmg
• Linux: 下载 .AppImage

浏览器扩展

Elasticvue提供主流浏览器的扩展版本：

• Chrome扩展
• Firefox扩展
• Edge扩展

Docker容器

使用Docker运行Elasticvue：

docker run -p 8080:8080 --name elasticvue -d cars10/elasticvue

Web版本

直接访问 https://app.elasticvue.com 即可使用在线版本。

集群配置

使用Docker或Web版本时，需要为Elasticsearch集群启用CORS配置。编辑Elasticsearch配置文件（如/etc/elasticsearch/elasticsearch.yml）：

# 启用CORS
http.cors.enabled: true

# 根据运行方式设置允许的源
# Docker/本地运行
http.cors.allow-origin: "http://localhost:8080"
# 在线版本
http.cors.allow-origin: /https?:\/\/app.elasticvue.com/

# 如果集群使用认证，还需添加
http.cors.allow-headers: X-Requested-With,Content-Type,Content-Length,Authorization

使用Docker运行Elasticsearch时，可以通过环境变量配置：

docker run -p 9200:9200 \
           -e "http.cors.enabled=true" \
           -e "http.cors.allow-origin=/.*/" \
           elasticsearch

默认集群配置

环境变量方式

通过环境变量ELASTICVUE_CLUSTERS配置默认集群：

docker run -p 8080:8080 -e ELASTICVUE_CLUSTERS='[{"name": "prod cluster", "uri": "http://localhost:9200", "username": "elastic", "password": "elastic"}]' cars10/elasticvue

配置文件方式

创建集群配置文件clusters.json：

[
  {
    "name": "开发集群",
    "uri": "http://localhost:9200"
  },
  {
    "name": "生产集群", 
    "uri": "http://localhost:9501",
    "username": "elastic",
    "password": "password"
  }
]

通过卷挂载配置文件：

docker run -p 8080:8080 -v /path/to/clusters.json:/usr/share/nginx/html/api/default_clusters.json cars10/elasticvue

从源码构建

环境要求

• Node.js
• npm 或 yarn
• TypeScript

构建步骤

1. 克隆项目代码：

git clone https://gitcode.com/gh_mirrors/el/elasticvue
cd elasticvue

2. 安装依赖：

npm install

3. 开发模式运行：

npm run dev

4. 构建生产版本：

npm run build

5. 运行测试：

# 单元测试
npm run test:unit

# E2E测试
npm run test:e2e

项目结构

Elasticvue采用现代化的Vue 3架构：

src/
├── components/          # Vue组件
│   ├── clusterselection/ # 集群选择组件
│   ├── home/           # 主页组件
│   ├── indices/        # 索引管理组件
│   ├── nodes/          # 节点管理组件
│   └── search/         # 搜索组件
├── composables/        # Composition API
├── store/             # Pinia状态管理
├── locales/           # 多语言文件
└── helpers/           # 工具函数

功能特性

集群管理

Elasticvue提供完整的集群监控功能，包括：

• 集群健康状态显示
• 节点信息查看
• 索引统计信息
• 分片分配状态

索引操作

支持多种索引管理操作：

• 创建和删除索引
• 索引别名管理
• 索引设置修改
• 索引模板管理

文档搜索

提供强大的文档搜索功能：

• 全文搜索支持
• 查询构建器
• 搜索结果高亮
• 文档编辑和删除

REST接口

内置REST查询工具：

• 支持GET、POST、PUT、DELETE等方法
• 请求历史记录
• 保存常用查询
• 语法高亮和格式化

故障排除

如果遇到连接问题，可以尝试重置Elasticvue设置：

1. 打开设置页面
2. 下载当前数据备份
3. 点击"断开连接并重置"

这将重置所有保存的过滤器和连接信息。

多语言支持

Elasticvue支持以下语言：

• 英语 (en)
• 中文 (cn)
• 法语 (fr)
• 俄语 (ru)
• 日语 (jp)
• 意大利语 (it)

语言文件位于src/locales/目录下。

技术栈

• 前端框架: Vue 3
• 构建工具: Vite
• 状态管理: Pinia
• UI框架: Quasar
• 代码编辑器: CodeMirror
• 测试框架: Vitest + Playwright
• 桌面应用: Tauri

Elasticvue是一个功能强大的Elasticsearch管理工具，无论是开发环境还是生产环境，都能提供出色的管理体验。通过多种部署方式，用户可以根据自己的需求选择最适合的使用方案。