Requirement: I just want to upload the front-end and back-end projects I wrote. It is no longer only accessible locally, but other people can also access my project, so as to record it so as not to forget it later. The article is very long and detailed. I go online by myself I will also post any errors I encounter. It is recommended to read it.
1. First buy a server
Because I have the privilege of being a student, I just prostituted a free server for a month, and I can get a total of 7 months, but I have to take an exam ==, I will leave you speechless after passing the exam, just click the link below. , Alibaba Cloud, Tencent Cloud, etc. can be essentially the same
Alibaba cloud student privileges free cloud server for 7 months
For the student server, there are only two regions. I chose Heyuan here , and the other default options are fine.
After buying ---------------------- click on the console in the upper right corner
Then click on the upper left corner to select the cloud server to see the server you bought
If you are not a student but buying for the first time , you can directly select the product in the upper right corner - cloud server ecs. If you are an individual, it is recommended to choose this way
Notice! ! ! The account password configured above, take a text and remember it, it will be used when configuring xshell
The change is as shown in the picture above, and other default options are fine, and then click to buy. After the purchase is successful------click the upper right corner to enter the console---click the upper left corner to select the cloud server ecs, if you don't know how to read the beginning of the article flow chart. click to see
After clicking the example, you can see the cloud server you bought in the picture below. Remember where I typed the code, and then copy the public network ip address. + (public) after the ip is the public network ip
2- Download Xshell, download pagoda in xshell
Xshell官网:NetSarang Homepage CN - NetSarang Website https://www.xshell.com/zh/
After that, just fill in the account and password. It doesn’t matter and there are no restrictions. You can download it after filling it in. The installation is very simple and you don’t need to configure anything. Just pay attention to the download path, open xshell, the steps are as follows
then click confirm
3. Use xshell to install the pagoda
After copying the first one, paste it directly behind the number # in the above picture, right-click and select Paste--Enter to start downloading ------ An option pops up and directly select y------If there is still a choice---- It will download automatically after a few seconds
Pagoda panel download, free all-round server operation and maintenance software (bt.cn)
After the pagoda is installed, it will display as follows. I copied this. The address of the external network panel on my side is like this. The serverip is your own public network ip. Just replace this directly: it is recommended to add the external network and internal network address and user name Passwords are copied and saved
External network panel address: http://SERVE:IP:13762/awhe1
1----------Open the external network address, pop up, and just copy the above username and password values into it. After entering, first register an account and bind it. There should be a home page, first Otherwise, you need to verify something after binding
The first time you enter, a pop-up window will appear first, download all directly
4. Create a database in the pagoda and bind the local database
Pay attention to the picture below, the database name, username and password are all set the same, easy to change and match, set the access permission to everyone, set the utf-8 format - and finally click submit to complete.
Click the backup import button --- pop-up window --- click upload from local --- click select file --- select your .sql database file --- click upload- ---Close the first pop-up window-------Click to import------Close the pop-up window-------Test whether the import is successful
Click the tool to see if the import is successful. If the import is not successful, there will be no file display
5. The local database is connected to the database of the pagoda, and the synchronous modification operation is performed
After the connection is connected, the synchronous modification is realized. It is as simple as that. The port number must be consistent with the value of the port connection in the background.
6. Open ports - both Pagoda and Alibaba Cloud must be opened, otherwise they may not be accessible
Pagoda's ports open --- open 8889 and 3306
Aliyun open port ----- click configuration rules as shown in the figure below
Just select 1 as the priority, the highest priority is
7. Back-end project upload pagoda
Click on the file, find the default file under wwwroot, click upload on the left ------After uploading the packaged back-end file-----After the list is decompressed, it will be as shown below
1-------Modify the interface address of the backend to the ip address of the public network. My side is the modification of the default.json file under the config folder. The following coded addresses are all changed to the ip address of the public network , the port number is 8889, database and user, and password are all changed to the account password of the database uploaded on the pagoda.
Modify the listening port number of the app.js file and change it to port number 8889
8. Download the pm2 startup project
Find the software store in the menu bar - search and download - after the download is complete - open the home page to display the switch
Find pm2 in the software on the home page, open it and add the project
If the startup is successful, it is as follows
8-Use postman to test whether the interface request is successful
Protocol + public network ip + port number 8889, if there is a response, the request is successful
Notice! ! ! ! Some projects report an error 502 problem when requesting, which is caused by the back-end project not writing a reverse proxy, csdn search and write it and it’s over
9. Front-end project configuration package upload
1- First add the site in the pagoda
The root directory hangs the address where the front-end files are stored under wwwroot, that is, the http folder. Other defaults, if you don’t buy a domain name, just copy the public IP into it, such as 132.1232
2- After the site is added, click on the file ----- you will find an additional html folder under wwwroot
The default request address of the front-end project is changed to the ip address of the public network, and the others remain unchanged
Use npm run build to start packaging ---------
Package and generate dist file-------compress dist file-------upload the compressed dist file to the http folder-------decompress dist file----- --Click the dist file and cut all the content inside to the html directory, as shown below
10. Enter the project address on the website
The address is: http://public network ip
There is no need for a domain name here, and you can access it directly from the public network ip
This is the end of the article, I hope it will help you~~~