preface

Java enterprise development without Spring Boot and Vue, in today’s streets and alleyways are everywhere before and after the separation of items, has become an essential technology for the development of the company, recently xiaobian open source a project about RBAC, is also written with Spring Boot and Vue, want to obtain the source code, There’s a Gitee link at the bottom, and today I’m going to show you my personal project.

First, environmental preparation

1. Web server

MySql database

3, Nginx server

4. Java environment

Once the environment is ready, we will start to package and deploy. There will be a special section on Nginx usage and later articles on Docker.

Two, SpringBoot project jar package

1.1 Use Maven’s Package plug-in for packaging

1.2 Uploading data to a Linux Server

Upload the packaged Jar package to a Linux server in a random directory:

Iii. Vue project packaging

1.1 Changing the Background Request Address

Now in deployment, you need to change your front-end startup ports to all back-end project ports to be the same, and then change the BACK-END request IP address. It’s the IP address or domain name of your server.

1.2 Generating dist File

Of course, you can also use the following command to package:

npm run build
Copy the code

After the package is successfully packaged, a dist static folder will be generated, which is full of our VUE project packaged and compiled CSS, JS and other static resource files.

1.3 Uploading data to a Linux Server

Create a directory for storing the dist file. Remember the location of the dist file. Configure the following static resources:

For easy management, I put them all in one file directory:

/usr/local/dt
Copy the code

Configure Nginx

Due to Nginx server are deployed on a server, and we don’t have a domain name, don’t do what load balancing, so the configuration is simple, IP will write this machine, is localhost server machine, we have deployed behind the upgrade of the article, such as about static resource configure load balancing, compression, Https certificate and so on.

Key points:

Static resource file path for Vue:

root   /usr/local/dt/dist; 
Copy the code

Spring Boot interface address:

proxy_pass  http://localhost:9090/api/;
Copy the code

Xiaobian all interfaces have an API as a prefix, because it is easy to do permission resources interception.

Complete configuration:

server { listen 80; server_name localhost; Root /usr/local/dt-dist; Try_files $uri $uri/ /index.html; index index.html index.htm; } # {proxy_set_header Host $Host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; Nginx reverse proxy proxy_pass HTTP://localhost:9090/api/;}}Copy the code

With everything configured, we can start the project.

Iv. Start the project

1.1 Starting the Nginx Server

1.2 start SpringBoot

Recommended background boot mode:

nohup java -jar cms-manage-1.0-SNAPSHOT.jar >online.log 2> &1 &
Copy the code

Online. log indicates startup trial logs, which can be viewed by running the cat command.

1.3 Access Items

conclusion

Due to Nginx server are deployed on a server, and we don’t have a domain name, don’t do what load balancing, so the configuration is simple, IP will write this machine, is localhost server machine, we have deployed behind the upgrade of the article, such as about static resource configure load balancing, compression, Https certificate and so on. Later we will use Docker deployment in combination, and xiaobian has some articles to write, we can refer to.

DT CMS is committed to the most concise front and back end separation RBAC background management system, like you can join the small series of technical exchange group to receive: 176251012

Stay up late dry goods, creation is not easy, move small hands point praise ！！！！ Behind will continue to output more dry goods to you, like please pay attention to xiaobian CSDN: blog.csdn.net/qq_41107231 and nuggets: juejin.cn/user/394024…