系统设计

学习

感谢您对 MemorySearch 忆搜阁的关注和支持！

# 🍜 访问地址

暂未部署上线，点击跳转至：个人博客 - MemorySearch 忆搜阁开发文档 (opens new window)

# 🍖 源码获取

# Gitee：

前端：MemorySearch 忆搜阁 frontend (opens new window)
后端：MemorySearch 忆搜阁 backend (opens new window)

# GitHub：

前端：MemorySearch 忆搜阁 frontend (opens new window)
后端：MemorySearch 忆搜阁 backend (opens new window)
同Gitee👆

# 🍝 架构设计

原图链接：项目架构图 (opens new window)

# 🍺 技术选型

# 后端

Spring Boot：作为项目的核心框架，提供快速构建 RESTful API 的能力。
Elasticsearch：作为搜索引擎的核心，提供全文搜索、结构化搜索和推荐等功能。
Elasticsearch JDBC：用于将关系型数据库中的数据同步到 Elasticsearch 中。
Spring Data Elasticsearch：提供与 Elasticsearch 的集成，简化 Elasticsearch 操作。
Logstash：用于日志收集、解析和传输，便于监控和调试。
Kibana：用于可视化展示 Elasticsearch 中的数据，提供强大的数据分析和可视化功能。
Mybatis：作为持久层框架，用于操作关系型数据库。
Redis：作为缓存数据库，提高系统性能。
Swagger：用于 API 文档的管理和展示。

# 前端

Vue.js：作为前端框架，提供响应式设计和组件化开发的能力。
Element UI：作为 Vue.js 的 UI 组件库，提供丰富的界面元素和样式。
Axios：用于发送 HTTP 请求，与后端 API 进行交互。
Vue Router：用于实现前端路由，管理页面跳转。
Vuex：用于管理前端状态，实现组件之间的数据共享和通信。
ECharts：用于数据可视化，展示统计图表。

# 🍰 快速启动

beta Vdoing主题

拉取代码后，如何快速运行该项目？

# 后端

配置 MySQL、Redis、Elasticsearch 为本机地址：

# MySQL配置
datasource:
  driver-class-name: com.mysql.cj.jdbc.Driver
  url: jdbc:mysql://localhost:3306/xxx
  username: xxx
  password: xxx

# Redis 配置
redis:
  database: 0
  host: localhost
  port: 6379
  timeout: 5000
  password: Dw990831

# ES 配置
elasticsearch:
  uris: http://localhost:9200
  username: root
  password: 123456

# 额外安装

在本地安装 Elasticsearch、Kibana、Logstash
在 ES 的 bin 目录下执行以下命令，启动 ES：

Elasticsearch.bat

在 Kibana 的 bin 目录下执行以下命令，启动 Kibana：

Kibana.bat

在 Logstash 的 config 目录下新增 .conf 文件，编写配置文件，做好数据映射（以下配置信息可作为参考）

# Sample Logstash configuration for receiving
# UDP syslog messages over port 514

input {
  jdbc {
    jdbc_driver_library => "D:\softWare\logstash\logstash-7.17.9\config\mysql-connector-java-8.0.29.jar"
    jdbc_driver_class => "com.mysql.jdbc.Driver"
    jdbc_connection_string => "jdbc:mysql://localhost:3306/******"
    jdbc_user => "******"
    jdbc_password => "******"
    statement => "SELECT * from post where updateTime > :sql_last_value and updateTime < now() order by updateTime desc"
    use_column_value => true
    tracking_column_type => "timestamp"
    tracking_column => "updatetime"
    schedule => "*/5 * * * * *"
    jdbc_default_timezone => "Asia/Shanghai"
  }
}

filter {
  mutate {
    rename => {
      "updatetime" => "updateTime"
      "userid" => "userId"
      "createtime" => "createTime"
      "isdelete" => "isDelete"
    }
    remove_field => ["thumbnum", "favournum"]
  }
}

output {
  stdout { codec => rubydebug }

  elasticsearch {
    hosts => "127.0.0.1:9200"
    index => "******"
    document_id => "%{id}"
  }
}

在 Logstash 的根目录下执行以下命令，加载配置文件并启动 Logstash：

.\bin\logstash.bat -f .\config\myTask.conf

# 前端

注意

确保本地 Node.js 环境配置完成，版本为 v18.x.x及以上

根据后端接口文档，一键生成前端 HTTP 请求接口：

🍖 官方文档：ferdikoomen/openapi-typescript-codegen (github.com) (opens new window)

安装：

npm install openapi-typescript-codegen --save-dev

执行命令生成代码：

openapi --input http://localhost:8104/api/v2/api-docs?group=memory-search --output ./generated --client axios

执行成功后，在 OpenAPI.ts 文件下，修改请求的后端地址：

export const OpenAPI: OpenAPIConfig = {
  BASE: "http://localhost:8104",
  VERSION: "1.0",
  WITH_CREDENTIALS: true,
  CREDENTIALS: "include",
  TOKEN: undefined,
  USERNAME: undefined,
  PASSWORD: undefined,
  HEADERS: undefined,
  ENCODE_PATH: undefined,
};

执行以下命令，一键启动前端项目：

npm run serve

# 🍱 问题答疑

这部分内容已经系统整理至问题答疑栏目下，您可以轻松地在导航下中找到它，或者点此跳转 (opens new window)

← 概述维护升级→