从零搭建博客Springboot+vue版

KINDLE站点建站流程

搭建这个博客主要是从b站+gitee搜索的模版，整体来说挺美观的。使用起来对于学习过vue+springboot技术栈的来说是很容易上手的。废话不多说以下就来说一下，我的建站步骤吧!
kindle站点

1.本地项目部署测试

1.1从gitee下载项目

https://gitee.com/littledokey/poetize

这里多种下载方式都可以，我是直接通过下载压缩包解压运行的。

1.1.1 运行前端

首先确保你有Node20+版本（可能18也可以，因为我是16的让我升级）、VScode编辑工具。
node官网:https://nodejs.org/en/download/prebuilt-installer
VScode官网：https://code.visualstudio.com/

- 到项目目录`poetize-ui`下使用命令行(Ctrl+R：输入cmd)运行 `npm install`自动下载依赖包。

• 安装完成直接使用npm run server就可以运行啦
• 根据自己的需求修改一些前端文本信息，在/utils/constant.js中修改前后端连接密钥cryptojs_key。
  (注意这里需要后端也修改，接下来会讲解。)

1.1.2 运行后端

需要的环境:JAVA8.0+ 、MAVEN、IDEA、MYSQL8.0（5版本需要修改一下驱动）。环境的配置就不做过多赘述了，网络上有很多高质量文章进行配置安装。

• MYSQL执行poetize-server/sql/poetry.sql文件
• 修改poetize-master\poetize-server\poetry-web\src\main\resources\application.yml配置文件`
  至少将上面的中文都替换掉

server:
  port: 8081
  tomcat:
    threads.max: 50
    max-connections: 100
    max-http-form-post-size: 120MB
    connection-timeout: 60000

mybatis-plus:
  mapper-locations: classpath*:mapper/**/*.xml
#  configuration:
#    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
  global-config:
    db-config:
      logic-delete-value: 1
      logic-not-delete-value: 0

spring:
  servlet:
    multipart:
      max-file-size: 100MB
      max-request-size: 100MB

  mail:
    host: smtp.qq.com
    username: QQ邮箱号
    password: smtp授权码
    default-encoding: utf-8
    protocol: smtp
    port: 465
    properties:
      mail:
        smtp:
          socketFactory:
            port: 465
            class: javax.net.ssl.SSLSocketFactory
          ssl:
            enable: true

  datasource:
    username: 账号(这里填root)
    password: 密码
    url: jdbc:mysql://localhost:3306/poetize?useUnicode=true&characterEncoding=utf-8&serverTimezone=Asia/Shanghai
    type: com.alibaba.druid.pool.DruidDataSource
    driver-class-name: com.mysql.cj.jdbc.Driver

user:
  code:
    format:
  subscribe:
    format:

store:
  type:

local:
  enable:
  uploadUrl:
  downloadUrl:

qiniu:
  enable:
  accessKey:
  secretKey:
  bucket:
  downloadUrl:

• 注意:我们前端如果修改了cryptojs_key，需要在\poetize-master\poetize-server\poetry-web\src\main\java\com\ld\poetry\constants\CommonConst.java中修改CRYPOTJS_KEY保持一致。

• 然后就可以运行项目了，在poetize-master\poetize-server\poery-web\src\main\java\com\ld\poetry\PoetryApplication.java右键run运行项目。
  

• 至此前后端项目都跑起来了，测试一下连接即可。

• 如何把站长账号变成自己的?

  1. 用前端随便注册一个账号后，进入mysql(cmd：mysql -uroot -p密码)，use poetry; 根据select * from user;修改站长账号update user set username = 账号名 and pssword = 注册的密码复制过来，即可。
  2. 根据后端的密码加密自己生成一个密码，直接修改数据库。

2.宝塔部署项目

前置条件:购买有公网的服务器，可以使用自带宝塔镜像，或者根据宝塔官网进行下载。

2.1 前端打包

• 修改/utils/constant.js文件
  注释测试环境打开生产环境即可。
  

• 当前项目目录下命令行运行npm run build

• 打包成功会生成dist文件夹,这是需要部署到服务器上文件。

2.2 后端打包

• 先在宝塔的mysql上导入poetry.sql，获取宝塔的mysql密码，修改poetize-master\poetize-server\poetry-web\src\main\resources\application.yml配置文件的mysql（datasource下的password）密码。
• 在项目根目录下的pom.xml中(或右边侧栏Maven），使用maven的package功能进行项目打包。打包成功后会在target文件夹下生成jar包

2.3 上传文件、创建文件夹

• 上传jar包、dist文件夹到宝塔文件路劲中 /www/wwwroot下。
• 在/home中创建文件夹file

2.4 使用java项目部署

2.5 修改配置文件

    #vue路劲404问题
    location / 
    {
      try_files $uri $uri/ /index.html;
    }
    
    #后端地址方向代理
    location /api/ 
    {
        proxy_pass http://mykindle.top:8081/;
	#proxy_pass http://127.0.0.1:8081/; #没域名就这样
    }
    #静态资源路劲引用 上传图片后路劲用/static/***即可
    location /static/ 
    {
      alias /home/file/;
    }

注意：需要在服务器防火墙开放一下端口。

到这里根据服务器ip浏览器访问，就可以成功啦！