Implementación del proyecto de separación de front-end de Java

1. Implementación del entorno de ventana

despliegue frontal

1. Primero empaquete el proyecto:

npm ejecutar compilación;

2. Configurar nginx

El punto de entrada del proyecto Vue es index.html, y la ruta nginx debe pasar por este archivo, por lo que se debe configurar el archivo nginx.conf.

Busque localhost, agregue una línea de código try_files $uri $uri/ /index.html last;

location / {
   root   html;
   try_files $uri $uri/ /index.html last;
   index  index.html index.htm;
}

3. Reiniciar nginx

nginx.exe -s reiniciar

implementación de back-end

1. Proyecto de paquete

mvn clean package -Dmaven.test.skip=true

2. Simplemente comience el proyecto

java -jar vueblog-0.0.1-SNAPSHOT.jar --spring.profiles.active=default

2. Implementación del entorno Linux

1. Configure el yml del proyecto back-end en el entorno de producción

spring:
  datasource:
    type: com.alibaba.druid.pool.DruidDataSource
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://mysql:3306/simple_blog?&useSSL=false&serverTimezone=UTC&allowPublicKeyRetrieval=true
    username: root
    password: 123456

mybatis-plus:
  mapper-locations: classpath:/mapper/*.xml
#  configuration:
#    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl

shiro-redis:
  enabled: true
  redis-manager:
    host: redis:6379

Debido a que los proyectos mysql, redis y back-end están organizados en la misma red, puede usar el nombre del acuerdo en lugar de la dirección IP especificada

2. Empaquetar el proyecto backend

mvn clean package -Dmaven.test.skip=true

3. Escriba Dockerfile para crear una imagen de back-end

FROM java:8
EXPOSE 8081
ADD simpleBlog-0.0.1-SNAPSHOT.jar app.jar
RUN bash -c 'touch /app.jar'
ENTRYPOINT ["java", "-jar", "app.jar", "--spring.profiles.active=pro"]

Nota: si los servicios de terceros en el proyecto se implementaron en otros servicios, solo necesita configurar la dirección especificada en el proyecto de back-end, y el resto de los pasos se basan en el hecho de que todos los servicios están en el mismo linux en el servidor

4. Escriba docker-compose.yml

version: "3"
services:
  nginx: 
    image: nginx:latest  
    ports:
    - 80:80  
    volumes: 
    - ./nginx/html:/usr/share/nginx/html
    - ./nginx/nginx.conf:/etc/nginx/nginx.conf
    privileged: true 
    image: mysql:8.0.29-oracle
    ports:
    - 3306:3306
    volumes:
      - ./mysql/data:/var/lib/mysql
      - ./mysql/config/my.cnf:/etc/my.cnf
    environment: 
      - MYSQL_ROOT_PASSWORD=123456
  redis:
    image: redis:latest
  vueblog:
    image: vueblog:latest
    build: . 
    ports:
    - 8081:8081

Tanto mysql como nginx usan volúmenes de datos para montarlos fuera de la máquina host; de lo contrario, los últimos datos y los proyectos front-end configurados se perderán cada vez que se inicie el contenedor.

nginx: primero cree la carpeta html en la máquina host, luego coloque todos los archivos en la carpeta dist empaquetada por el proyecto front-end en la carpeta html y luego modifique nginx.conf

mysql: primero cree las carpetas de datos y configuración, y luego cree el archivo my.cnf en la carpeta de configuración.

nginx.conf

#user  root;
worker_processes  1;
events {
  worker_connections  1024;
}
http {
  include       mime.types;
  default_type  application/octet-stream;
  sendfile        on;
  keepalive_timeout  65;
  server {
      listen       80;
      server_name  localhost;
      location / {
          root   /usr/share/nginx/html;
          try_files $uri $uri/ /index.html last; 
          index  index.html index.htm;
      }
      error_page   500 502 503 504  /50x.html;
      location = /50x.html {
          root   html;
      }
  }
}

mi.cnf

[mysqld]
user=mysql
default-storage-engine=INNODB
character-set-server=utf8
[client]
default-character-set=utf8
[mysql]
default-character-set=utf8

5. Sube los archivos preparados al mismo directorio

6. Ejecute el comando para organizar el proyecto y aparecerá el contenido que se muestra en la siguiente figura.

ventana acoplable-componer hasta -d