SpringCloud acimage

dimensional impression

Dimensional Impression, an animation communication forum built by SpringCloud

Preface

It is said that half of the Chinese programmers on Github are two-dimensional, so In order to attract more stars I developed this animation exchange forum while learning SpringCloud technology.

Project introduction

Acimage is an animation exchange forum built on Spring Cloud that separates the front and back ends . The backend uses SpringCloud + Mybatis-Plus + Reids + Rabbitmq + Elasticsearch . The front end uses Vue + ElementUi + Vite . The project has been launched. Dear Github 2D people, why not give me a star(๑•̀ㅂ•́)و✧.

URL

* Dimensional Impressiono( ≧▽≦)ツ~Animation Exchange Forum www.acimage.top (Only applicable to the web page. If the screen is too small, you can enlarge the browser appropriately for better visual effects).

front page

Forum page

System architecture

Project function

User front desk

• Use pictures to identify pictures , that is, upload pictures to identify similar pictures in the forum and the topics they belong to.
• Diversified search , you can search based on keywords, categories, tags, and sorting fields at the same time, and highlight matching text based on keywords.
• Related topic recommendations , random recommendations .
• Topic rankings (ranked by star, number of views, number of comments, etc., active time).
• User rankings (ranked by number of topics, stars, etc.).
• Categories, tags, and click to filter out topics that match relevant categories or tags.
• Display the latest active topics in real time .
• Sensitive word filtering , image compression .
• Message notification
• View personal updates and modify personal information.
• Log in, register, log out, verification code to prevent swiping , and email verification .
• Post topics, comments, stars, etc.

Backend management

• Relatively complete RBAC permission control can dynamically adjust user roles, role permissions, interface permissions, etc.
• Basic website data display, number of visitors, number of interface calls, etc.
• Home page carousel image management.
• Topics, comments, user management.

Project features

• JWT implements single sign-on, unified identity authentication and authentication at the gateway, and complete RBAC permission control.
• Use Redis+Lua script+scheduled tasks to regularly persist frequently changing data (views, etc.).
• Using Redis + Lua script + custom annotations , only one annotation can be used to limit the flow of IPs, users, and overall request volume.
• The Dhash algorithm is used to realize the function of image recognition with pictures, and the effect is not bad.
• All uploaded images are compressed using webp, which greatly reduces bandwidth pressure.

Project directory

Backend services

• acimage_gateway : Gateway, unified identity authentication and authentication, and current limiting for users and overall request volume respectively.
• acimage_user : User center, user registration, login, email service, etc.
• acimage_community : community service, responsible for core functions related to forum topics
• acimage_image : image service, responsible for uploading topic images, uploading avatars, and identifying images with images, etc.
• acimage_admin : Management service

backend module

• acimage_common : public module, which stores entity classes, public interceptors, public configurations, and public tool classes, etc.
• acimage_feign : Place the feign client of each module

front end

• vue_manage_system : background management page
• vue_acimage_web : Portal page

other

• doc : some documents, pictures and database files

Run and deploy

The project is still being improved, and the operation and deployment process will be updated later .

• Import the three databases under doc/sql into mysql respectively. The four databases are the databases corresponding to the four front-end services.

• Configure the corresponding address or account password of mysql, redis, rabbitmq , and nacos in the application-dev.yml file of each service

• Fill in the Qiniu Cloud account information in application-qiniu-template.yml in acimage_common , including access-key , secret-key , domian , bucket , or assign any value to these four attributes (cannot be empty, otherwise NPE ), but This way you can't upload images. And rename application-qiniu-template.yml to application-qiniu.yml

• Configure the nacos address and sentinel address in application.yml under the acimage_common module (if sentinel is not configured, it will not affect the operation)

• Start nacos, redis, rabbitmq, mysql

• Start acimage_user , acimage_community , acimage_image , acimage_gateway in sequence. Otherwise, an error may be reported due to rabbitmq queue creation and binding sequence problems. If encountered, all services will be restarted again.

• After running the front end (see the README of vue_acimage_web for details), click the link that pops up by default to access the home page.

• Front desk login**: user: wk, password: wk123456 (there are several other users who can be seen from the database sql file, and the passwords are all username 123456)

• port:

  • acimage_user : 8100

  • acimage_image : 8090

  • acimage_community : 8080

  • acimage_gateway : 8070

Technology selection

Backend technology stack

SpringBoot , SpringCloud , MyBatis-plus , Druid (database connection pool), Redis (distributed cache), Rabbitmq (message queue), Elasticsearch (distributed search engine), Minio (object storage service), Nginx (reverse proxy server) , Docker (application container engine)

user interface frontend

Vue2 , Vue Router (routing), ElementUi (Vue basic component library), axios (http client), jsencrypt (js library based on RSA encryption and decryption), vue-dompurify-html (anti-XSS attack), tinymce-vue (rich text editor)

Backend management interface front end

Vite , TypeSript

Todo

• Categories, tags
• Topics, user rankings
• Random recommendation
• Recommended similar topics
• Sensitive word filtering
• Interface idempotent
• Refined current limit
• Improve RABC authority control, unified identity authentication and authentication at the gateway
• Add email services, email verification, verification codes, etc.
• Store pictures in minio (originally stored in Qiniu Cloud)
• elasticsearch diversified search, keyword highlighting
• Add user message notification function
• Use redis+lua to batch extract topics and pageviews from the cache to reduce the number of communications and display data in real time.
• Add comment emoticons
• Add follow function
• Improve the configuration and use of sentinel and nacos
• Add crawler module
• Improve unit testing
• Wait wait wait

comminicate

The project was originally built to learn technology. Due to limited capabilities, there are still many imperfections. You are welcome to correct me. If anyone is interested (I really hope someone is interested) or if you encounter any problems with the project or have any suggestions to raise an issue, you can contact the email address [email protected] or join the group 692992463 to communicate. If you like it, remember to give it a star.

Website screenshot

Web side

Admin terminal <br> Feel free to post a few pictures of the management system. Anyway, the management systems all look the same.

Open source agreement

Apache License 2.0