Giter Club home page Giter Club logo

mblog-backend's Introduction

起因

之前一直用的flomo,免费版的图片只有500MB空间,再加上数据在别人那里总归有点不爽,然后又看到了Memos,支持自部署,还需要个服务器.

我这最近不是才买了群晖ds920嘛,安排上.装完了才发现电信不给80/443端口,有了公网ip也无用武之地,难受.咋办?折腾内网穿透,tailscale,wireguard之类的?不想,毕竟还是希望能部署在公网,公网能直接访问.

然后又想到如果前后端分离,服务端在nas上,前端在各大支持静态网页的cdn上不就ok?cdn都支持绑定域名,想法很好,现实打脸.Memos我看了下,确实是前后分离,但是看这里,作者把前端编译出来的dist目录直接嵌入到了生成的go的可执行文件里.

这就导致了我想前端部署在cdn,后端部署在nas上实现不了,除非自己改memos的代码,太折腾.

转念一想,就这么点microBlog的功能能有多麻烦?自己撸一个得了?(其实是给闲的).

更新记录

项目介绍

mBlog,全称micro blog.基于java+mysql.支持自部署的前后端分离的微博,可单用户使用,也可以支持多用户.

DEMO:

mblog.coo.st

mblog.cooolr.online(开放注册)

图片预览

Docker镜像

大体功能如下:

  • 基本的文字/图片输入,支持标签
  • 支持对历史博文/标签修改
  • 支持单/多用户,支持开启/关闭注册
  • 支持博文 登录用户/所有人/只有自己 可见
  • 支持按照标签,作者等条件搜索
  • 支持标签管理(一键改标签,删除无用标签等)
  • 支持上传图片(目前支持本地文件存储和七牛云,后续继续添加阿里云/腾讯云等)
  • 支持开发者使用api token
  • 响应式设计,支持pc和手机,支持夜间模式
  • 支持RSS
  • 支持markdown语法
  • 支持emoji表情
  • 前后端分离,前端和后端域名可以不一致,可以后端部署在nas上,前端部署在cdn.

待开发的功能

  • 输入博文时自动带入当时天气信息
  • 支持更多的oss提供商
  • ......

使用到的框架

服务端

前端

微信交流群

部署

不会命令行安装的看这里,通过Nas的Docker管理界面安装

服务端

数据库记得提前建好,对应的账号得有create table的权限

数据库记得提前建好,对应的账号得有create table的权限

需要注意的

  • 初始用户名密码是admin/a123456

  • 登录成功后可以在 用户设置 页面修改密码.

  • 在设置 - 系统设置中,需要设置服务端域名,安全域名(也就是前端域名,逗号分割,只有配置在这里的,才会允许跨域调用.没配置的,不支持跨域.前端会报错)

  • 其中服务端域名是在生成RSS内容,和本地上传文件时启用.

  • 写内容时,只有第一行的 以 # 开头的才会被解析为 标签,第二行以及后面的,不解析.

  • AllInOne 安装可以参看 根目录下的docker-compose.yml,里面包含了前端,后端和MySQL 8.

源码安装
  1. git clone [email protected]:kingwrcy/mblog-backend.git
  2. 更改application.properties文件中的数据库相关信息和前端域名(配置跨域)
  3. 在项目根目录下执行mvn clean package,需要java>=17和maven>=3.9.1
  4. 打包出来的Jar文件在服务器执行java -jar xxx.jar
Docker安装
docker run --volume=${PWD}/upload:/opt/mblog/upload \
--publish=你要映射的后端端口:38321 \
--restart=always \
--name=mblog-backend \
--detach=true \
--env MYSQL_USER=数据库用户名 \
--env MYSQL_PASS=数据库密码 \
--env MYSQL_URL=数据库地址:端口 \
--env MYSQL_DB=数据库名称 \
--env MBLOG_FRONT_DOMAIN=mblog前端地址(配置跨域使用的) \
kingwrcy/mblog-backend:latest
  • 其中--volume=${PWD}/upload:/opt/mblog/upload是图片在本地存储才需要挂载的,如果是七牛云之类的,不需要挂载.
  • 数据库相关的记得更改
  • 映射的端口自己需要就改
  • 其中MBLOG_FRONT_DOMAIN如果前后端域名+端口全部一致,可以不用配置,如果不一致,哪怕端口不一致,也需要配置,如:https://mblog-front.com

前端安装

源码安装
  1. git clone [email protected]:kingwrcy/mblog-front.git
  2. 更改.env.docker文件中的VITE_BASE_URL内容为你的服务端地址,有端口的端口也要加上,如:https://mblog-server.com:2023
  3. yarn i && yarn build-only --mode=docker 需要Node版本>=v18
  4. 打包出来的dist目录就可以传到cdn了

自己部署前端的注意事项

由于使用了vue-router的 HTML5 Mode,所以需要在服务器的nginx上写入一条配置. 详情参见HTML5 Mode

如果不配置的话,直接访问详情页,登录页等页面会404,站内跳转的不受影响.

用Docker安装的不需要这个步骤,我已经在Dockerfile中处理过了.

Docker安装
docker run \
--publish=你要映射的前端端口:80 \
--restart=always \
--name=mblog-front \
--detach=true \
--env MBLOG_SERVER_URL=mblog服务端地址,有端口就带上端口 \
kingwrcy/mblog-front:latest

mblog-backend's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.