Table of contents
That’s it for today, I hope it can help you! ! !
1. Stand-alone project
When we get the developed project, we first need to test it on our own host to see if there are any problems with the developed project.
After getting the developed project, unzip it, and there will be several files as shown below:
Among them are database scripts and developed projects
1.1. Local testing
First test the database script on the host machine to see if there are any problems, and randomly select a database to import the data script.
As shown in the picture, there is no problem:
Copy the WER of the developed project to the webapps directory under tomcat of the host machine.
As shown in the picture:
After that, in the bin directory of tomcat, find the startup.bat file and double-click it to start tomcat.
As shown in the picture:
After it is turned on, the path service is performed in the browser. The path is input and accessed according to the request path of the development project.
First, enter the import page. After logging in successfully, check whether there are any errors in the functions according to the project requirements.
1.2.Deployment
- Remotely connect the host to the virtual machine and deploy the project in the virtual machine
- Then share the file in the virtual machine and copy the developed project to the file of the virtual machine.
- Unzip the stand-alone project and put the wer project package into the tomcat webapps directory of the virtual machine.
- Go to the host database, find the database connected to the virtual machine, create a database with the same name as the database in the stand-alone project, and import the database script into the database.
- In tomcat's bin directory, find the startup.bat file and double-click it to start tomcat.
- Access the project deployed in the virtual machine in the host's browser. You need to add the IP of the virtual machine to the access request address. You can provide access instructions to complete the deployment.
As shown in the picture:
If you cannot log in, it is likely that the database password is inconsistent with the database password configured in the project. In the project that has been opened, tomcat Make modifications, find the configuration file that configures the database password in the project, and change the password in it:
Sequence: ( tomcat/webapps/ssm/WEB-INF/classes )
As shown in the picture:
2. Front and rear ends
3.1.Preparation
- In the virtual machine, unzip the back-end project. After unzipping, put the wer package of the back-end project into the webapps directory of tomcat.
- And import the database of the back-end project into the database of the virtual machine through the host. Of course, the name of the database needs to be consistent with the name of the back-end database configuration. If it is inconsistent, you can create a new database and import the data.
- After the backend is ready, it’s time to start with the frontend
- Download and install node.js, and configure it in the environment variables, then configure the npm global module path and cache default installation location, and configure the Taobao source
3.2.Deployment
Start tomcat in the virtual machine and enter the startup command in the directory of the front-end project of the project.
In the root path of the front-end project, open the cmd window and enter the following command to start:
npm run dev
As shown in the picture:
Here, you will find a problem. The browser on the host cannot access the front-end project in the virtual machine.
This is because the host's front-end project in the virtual machine is restricted by the port.
There are two ways to solve the following problems.
As shown in the picture: pop-up
The first
Usenginx as a reverse proxy to solve this problem
Find the nginx.conf file in the nginx file, and plant the file in its location Modify and access the port through proxy
#access_log logs/host.access.log main;
location / {
proxy_pass http://localhost:8081;
}#error_page 404 /404.html;
If you don’t know how to do it, you can download it from the official website of nginx, unzip it and use it:
If you want to use it after modification, just double-click the startup file, as shown in the figure:
All codes of nginx.conf
#user nobody;
worker_processes 1;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';
#access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
#gzip on;
server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
proxy_pass http://localhost:8081;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}
# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}
# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;
# location / {
# root html;
# index index.html index.htm;
# }
#}
# HTTPS server
#
#server {
# listen 443 ssl;
# server_name localhost;
# ssl_certificate cert.pem;
# ssl_certificate_key cert.key;
# ssl_session_cache shared:SSL:1m;
# ssl_session_timeout 5m;
# ssl_ciphers HIGH:!aNULL:!MD5;
# ssl_prefer_server_ciphers on;
# location / {
# root html;
# index index.html index.htm;
# }
#}
}
Then visit, as shown in the figure:
The second kind
In the path of the front-end project, find the index.js file, change the port to an open port, and config in the directory under the front-end path In file.
Open the index.js file, find location The location of the configuration port, change it to: 0.0.0.0
As shown in the picture:
Then restart the front-end project and access it on the host:
Both methods are available, whichever you prefer to use