This article is a sub-chapter of the personal development framework for SpringBoot2.1. Please read the personal development framework for SpringBoot2.1

Back-end project address: personal application development framework for SpringBoot2.1

Front-end project address: yWH-vuE-admin

Preview address: www.zandy.top

To prepare

Before the formal deployment to the server, some modifications to the project, and need to install some necessary software on the server, such as mysql, Redis, nginx, etc., because it is started with Docker, Docker also needs to be installed

Deployment environment:

  • Ali Cloud Server (Centos7)
  • Install docker in Liunx: Install Docker in centos7
  • Liunx install mysql8.0: docker install mysql8
  • Liunx install Redis: Docker install Redis
  • Liunx installs Nginx: Docker installs Nginx

Since our back end is open port 8082, we need to open port 8082 in the security group of Ali Cloud.

Optimize back-end projects

The project encountered some errors in packaging. I have corrected, here to take, do not focus on record. If it is my project of Clone, it can be packaged and deployed directly.

  • Using unchecked or unsafe operations in.Java using IDEA. Note: For more information, use -xLint :unchecked recompilation.

In the BaseController class of the common module, there is no certain type to return. This is because it is a common BaseController, so the return type can be any type. The compiler considers it unsafe.

@SuppressWarnings("unchecked")
Copy the code

In the RedisCacheConfig class of the cache module, there is a reference to add generics, and new does not add generics and report a warning

RedisTemplate<String, Object> template = new RedisTemplate(); RedisTemplate<String, Object> template = new RedisTemplate<>();Copy the code

  • Delete startup and test classes for modules other than core modules

  • Remove the < build > tag from poM files of modules other than core modules

Optimize the front-end VUE project

After the front end is packed, there will be a blank page when opening the home page. This is because the CSS and JS files cannot be found due to the path problem. Modify config->index.js

# / represents the root directory assetsPublicPath: '/' # change to the current directory assetsPublicPath: './'Copy the code

In NPM run build, the following error is reported. According to the reference, the version does not match.

  • Modify package.json html-webpack-plugin”: “^4.0.0-alpha to html-webpack-plugin”: “4.0.0-alpha
  • Delete node_modules delete package-lock.json and reinstall NPM install

Two ways to pack the back end

Packaging can be done in two ways: one is to upload the JAR package to the server after being packaged locally, and the other is to package the project in the server after being put on the server.

Note: Before the formal packaging starts, you need to change the DATABASE connection IP address, logback. XML log file address, redis connection address to the corresponding SERVER IP and address. The database connection address I filled in is the Intranet address, I filled in the public IP of redis, in fact, here quite let me wonder, obviously redis and the project are on the computer, why can’t use the Intranet IP or 127.0.0.1 connection, is a problem ha.

Back-end local packaging and deployment

Use Maven Projects on the right in the IDEA editor. First click clean and then click Package. Click the top arrow to skip the test phase in the packaging process.

The jar package named artifactId and version number will be found in the target file of the core module.

Create a Dockerfile file with no suffix and build a mirror of the project with the following contents

Base image indicates that the base image is java8
FROM java:8
# indicates that the temporary file directory is/TMP. The effect is to create a temporary file in the host /var/lib/docker directory, linked to the container's/TMP. This step is optional
VOLUME /tmp
# means to add the JAR package to the image and rename app.jarADD core-0.0.1 -snapshot.jar app.jar RUN sh -c'touch /app.jar'
# represents the JVM parameters and can be written here if necessary
ENV JAVA_OPTS=""
# indicates that Java -jar app.jar is run at startup
ENTRYPOINT ["java"."-Djava.security.egd=file:/dev/./urandom"."-jar"."/app.jar"]
Copy the code

Upload jar package and Dockerfile to our server. Use rz command to upload the jar package and Dockerfile in the same folder.

$ rz
# start building in the uploaded folder and specify the image name as yWH-frame
$ docker build -t ywh-frame .
After the build is successful, you can run the command to view it
$ docker images
Run the image file
$ docker run -d --name ywh-frame --restart always -p 8082:8082  -v /ywh/projectwork/spring/logs:/usr/local/logs  ywh-frame
Copy the code
  • -d stands for background running,
  • -p indicates port mapping. Local: container
  • -v file mapping, which is the project’s log file, and to the right is the container’s log file location, which can be configured in the core module’s logback-spring. XML, as noted in previous chapters of notes
  • — Name indicates the container name
  • –restart always indicates that the system starts with startup

You can run commands to view logs to check whether the startup is normal. If there are exceptions, correct them based on specific exceptions.

Packaged deployment on the back-end (not recommended)

This approach is cumbersome and requires the installation of some necessary environments in Liunx, so it is not recommended, but it should be documented.

Install the Java runtime environment and Maven

  • Install JDk1.8 in Liunx
  • Install Maven in Liunx

Need to change the core module poM file package plug-in into docker-Maven plug-in

<plugin>
	<groupId>com.spotify</groupId>
	<artifactId>docker-maven-plugin</artifactId>
	<version>1.2.0</version>
	<configuration>
		<imageName>${project.artifactId}</imageName>
		<dockerDirectory>${project.build.outputDirectory}</dockerDirectory>
		<resources>
			<resource>
				<targetPath>/</targetPath>
				<directory>${project.build.directory}</directory>
				<include>${project.build.finalName}.jar</include>
			</resource>
		</resources>
	</configuration>
</plugin>
Copy the code
<imageName></imageName>Name of the mirror<dockerDirectory></dockerDirectory>Dockerfile Specifies the location of the file<directory></directory>Target Indicates the location of the directory<include></include>The name of the JAR package after the project is packagedCopy the code

Create a Dockerfile file with no suffix. Place the file in the core module’s resource directory, or in any other directory.

Base image indicates that the base image is java8
FROM java:8
# indicates that the temporary file directory is/TMP. The effect is to create a temporary file in the host /var/lib/docker directory, linked to the container's/TMP. This step is optional
VOLUME /tmp
# means to add the JAR package to the image and rename app.jarADD core-0.0.1 -snapshot.jar app.jar RUN sh -c'touch /app.jar'
# represents the JVM parameters and can be written here if necessary
ENV JAVA_OPTS=""
# indicates that Java -jar app.jar is run at startup
ENTRYPOINT ["java"."-Djava.security.egd=file:/dev/./urandom"."-jar"."/app.jar"]
Copy the code

Upload the project to the server and just upload the SRC and POM files for each module

# find the project directory
$ cd /ywh/projectwork/spring/ywh-frame
Install from root
$ mvn clean install package -Dmaven.test.skip=true
Enter the core module
$ cd ywh-starter-core/
Run the maven command to generate the jar package and image
$ mvn package docker:build -Dmaven.test.skip=true
# docker run the command
$ docker run -d --name ywh-frame --restart always -p 8082:8082  -v /ywh/projectwork/spring/logs:/usr/local/logs  ywh-frame
Copy the code

Front-end VUE projects are packaged and deployed

Note: before packaging the front-end project, you need to change the BASE_APIIP in config->prod.env.js to the IP address of your server. I entered the public IP address, to ensure that you can also change the BASE_API in dev.env.js.

Running the command directly in the project with node_modules will generate a dist folder in the project.

Run this command under the front-end project folder
$ npm run build
Copy the code

To install Nginx on the server, there is a link in the notes at the beginning of the introduction, is also a docker to start, then the generated static file package upload to the root directory of the Liunx server, mainly is the installation and configuration of Nginx, the page is nothing but static page.

$ cd /home/www/website
$ rz 
$ tar -xvf dist.tar
Copy the code

The end of the

If all started properly, you should have four containers started on your server

  • Preview address: www.zandy.top