1. Pet store adoption project implementation and deployment exercise
1. Pre-operation:
The first step is to check whether there is a process containing the "FISCO" keyword.
ps -ef |grep fisco
If no related processes are being started
First start FISCO BCOS
cd fisco-bcos
bash nodes/127.0.0.1/start_all.sh
Start WeBASE-Front
cd WeBASE-Front
cd dist/
bash start.sh
Monitor the startup status of WeBASE-Front
tail -f log/WeBASE-Front.log
Verify via web page:
2. Configure and start software applications
first step:
1. Open the virtual machine, use mobaxterm and other software to connect to the virtual machine, and create an AdoptionProject
mkdir AdoptionProject
Step 2:
2. Copy the front-end and back-end code of the software application to the AdoptionProject directory of the virtual environment
3. Unzip the front-end and back-end code
Step 1: Unzip the front end
cd AdoptionProject
unzip pet-store-front-master.zip
Step 2: Unzip the backend
unzip pet-store-flask-master.zip
4. Deploy the Adoption smart contract
first step:
Open the WeBASE-Front web page, find the Adoption smart contract, "Save" -> "Compile" -> "Deploy", and use "admin" to deploy
5. Create a virtual environment
Now start to deploy the software application backend (pet-store-flask), enter ~/AdoptionProject/pet-store-flask-master, and use virtualenv to create a virtual environment
cd pet-store-flask-master/
python3 -m virtualenv venv
6. Install dependencies
Enter the backend file and use pip install -r requirements.txt to install all dependencies on the backend
Cd pet-store-flask-master/
pip install -r requirements.txt
The following output shows that the execution is correct
7. Modify the config file
Modify the corresponding config.py file in the back-end project, including admin_address, contract_address
vim config.py
8. Find app.py and change the port to 8081
Port 8080 is already occupied and needs to be changed to another port.
vim app.py
9. Start the backend through nohup
nohup python app.py &
10. Use tail monitoring
tail -f nohup.out
11. Start deploying the front end
Enter the pet-store-front-master directory and use npm install to install the front-end dependencies.
npm install
If the installation is successful, the following output will appear:
12. Generate static files of front-end project through npm
npm run buildGenerate static files:
The dist directory will be generated after the static files of the front-end project are successfully executed.
13. Configure nginx
Point 8022 port to the dist subdirectory in the local pet-store-master directory through a reverse proxy
Get nginx.conf address: sudo nginx -t
sudo nginx -t
Modify nginx.conf and add the configuration to the local dist directory through 8022 reverse proxy
sudo vim /etc/nginx/nginx.conf
Add server configuration to the http context of nginx.conf. The specific contents are as follows:
After saving nginx.conf, use the command to let the nginx tool reload nginx.conf
sudo nginx -s reload
Check the occupancy of port 8022:
Check page usage
14. Verification function
(1) Registration
First enter the registration page:
Copy a user's address in webase-front and register:
The following output indicates successful registration
(2) Login
Enter login page
Copy the user address you just registered on the login page and log in. The following output indicates that the login is successful:
2. Blockchain system deployment and verification based on container technology
1. Case design:
2. Pre-operation
Step 1: Modify the docker source to domestic
sudo vim /etc/docker/daemon.jsonStep 2: Configure content
{
"registry-mirrors": [
"http://hub-mirror.c.163.com",
"https://docker.mirrors.ustc.edu.cn",
"https://registry.docker-cn.com"
]
}
Step 3: Restart docker
sudo service docker restart3. Deployment operations
Part One: Server Configuration
Project directory (:~/AdoptionProject /pet-store-flask-master), modify admin_address (deployment contract user address) and contract_address (contract address), webase_host (webase-front access IP under LAN) in config.py
vim pet-store-flask-master/config.py
Step 2: Create BackDockerfile
cd AdoptionProject
vim BackDockerfile
#添加以下内容
FROM python:3.8
ADD ./pet-store-flask-master /root/pet-store
ADD ./.pip /root/.pip
WORKDIR /root/pet-store
RUN pip install -r requirements.txt
EXPOSE 8081
CMD /bin/bash -c "python app.py"
Copy the .pip directory in the user root directory (~) to the AdoptionProject directory
cp -r .pip AdoptionProject/ 
Modify the backend code ( ~/ AdoptionProject /pet-store -flask-master/app.py ) and add the host configuration at the end :
vim pet-store-flask-master/app.py
Step 3: Generate back:v1
docker build -f BackDockerfile -t back:v1 .
Step 4: Verify custom image
docker images
Step 5: Run the backend code to verify the corresponding container
docker run -itd --name pet-store-back -p 8081:8081 back:v1
Use docker ps to verify
Use netstat -nlp |grep 8081 to verify that the process is running
Step 6: Use postman to verify
Verify that the url is: "/" interface
#ip地址
192.168.200.100:8081/
verify/ user/register
First create a test4 user in webase-front
Use postman to verify, url: /user/register?address=[ the user address you created ]
Step 7: Client generates static files
Project directory (~/AdoptionProject/pet-store-front-master)
Enter this directory to confirm that the dist file exists.
If the dist folder does not exist, use the following command to generate it:
npm run build
Step 8: Copy the configuration nginx.conf
cp /etc/nginx/nginx.conf .
Step 9: Modify the nginx.conf file
vim nginx.conf
#配置文件内容
server{
listen 8020;
server_name localhost;
root /root/dist;
location / {
try_files $uri $uri/ @router;
index index.html;
}
location /api/ {
proxy_pass http://back:8081/;
}
location @router{
rewrite ^.*$ /index.html last;
}
}
Step 10: Configure docker-compose.yml
vim docker-compose.yml
#配置文件内容
version: '3.3'
services:
back:
image: back:v1
container_name: petstore_back
ports:
- 8081:8081
front:
image: nginx
container_name: petstore_front
volumes:
- /home/arthur/AdoptionProject/pet-store-front-master/dist:/root/dist
- ./nginx.conf:/etc/nginx/nginx.conf
ports:
- 8020:8020
Step 11: Use docker-compose up to start the project
docker-compose upStep 12: Verify startup results
Access {virtual machine IP}:8020
(1)Registration
(2) Login
(3) Adoption
Other error messages:
1. If the following error message appears, please restart the virtual machine
2. If the following error message appears, first stop the mirror, delete the mirror, and then regenerate bave:v1
docker stop 9b653e4f612a
docker rm 9b653e4f612a 
3. If the following error message appears when running the backend, it means that the port is occupied
#查看被占用的端口
ps aux | grep python
#杀掉这个端口
kill 39859
4. If you encounter this problem when starting the project, it means that the port is occupied.
First use docker ps to view the occupied ports
Stop starting the project: docker-compose down
Stop the occupied port: docker stop pet-store-back
Restart the project: docker-compose up
5. If a 500 error is reported when opening the browser and the following content appears in the terminal, modify the configuration file nginx.conf
vim nginx.conf
