1.存在的問題

前面三個步驟，我們已經(jīng)打通了vue、nginx、supervisor、vapor之間的連接，接下來我們要優(yōu)化如下內(nèi)容：

• 1.nginx和supervisor的配置文件中，user都是用的root，這是需要修改的，root用戶的權(quán)限過大。
• 2.vue相關(guān)內(nèi)容配置在了nginx.conf這個文件中，nginx.conf這個文件是nginx基本的配置文件，不應(yīng)該在這個文件中配置，應(yīng)該把配置挪到相應(yīng)站點的配置文件中，也就是三中我們創(chuàng)建的位于sites-enabled文件夾下的samplecode.conf文件中。
• 3.接口配置在了8888端口上，vue打包好的資源在80端口，這是不方便后續(xù)寫代碼的，應(yīng)該把接口也配置到80端口，通過請求的uri進行轉(zhuǎn)發(fā)。

2.解決用戶問題

2.1.使用root用戶登錄服務(wù)器

2.2.添加新的用戶

root@sweet-story-2:~# adduser yuhua
Adding user `yuhua' ...
Adding new group `yuhua' (1000) ...
Adding new user `yuhua' (1000) with group `yuhua' ...
Creating home directory `/home/yuhua' ...
Copying files from `/etc/skel' ...
Enter new UNIX password: 
Retype new UNIX password: 
passwd: password updated successfully
Changing the user information for yuhua
Enter the new value, or press ENTER for the default
    Full Name []: yh
    Room Number []: 
    Work Phone []: 
    Home Phone []: 
    Other []: 
Is the information correct? [Y/n] y

除了輸入密碼，其余的內(nèi)容可以全部回車，為空即可。

2.3.允許新用戶使用sudo命令

usermod -aG sudo yuhua

2.4.退出，使用新用戶登錄

exit
ssh yuhua@11.11.11.11

2.5.停掉nginx和supervisor

sudo systemctl stop nginx
sudo supervisorctl stop sample-code
// 或者如下命令停掉所有
sudo supervisorctl stop all

2.6.上傳vue代碼以及拉取vapor代碼到y(tǒng)uhua用戶目錄下

先在目錄下新建一個dist文件夾，然后使用scp命令上傳vue打包好的內(nèi)容。

mkdir dist
scp -r ./dist/* yuhua@11.11.11.11:/home/yuhua/dist/"

然后使用git命令拉取vapor的代碼。

git clone https://github.com/flywo/SampleCode.git

此時，文件夾下的內(nèi)容是這個樣子的

yuhua@sweet-story-2:~$ ls
dist  SampleCode

2.7.修改nginx.conf和sample-code.conf配置文件

修改nginx.conf中user為yuhua，然后注釋掉server的內(nèi)容

user yuhua;
http {

    ##
    # Basic Settings
    ##

    #server {
    #   listen 80;
    #   server_name code.yuhua.pub;
    #   location / {
    #       root /root/dist;
    #       index index.html index.htm;
    #       try_files $uri $uri/ /index.html;
    #   }
    #}
}

修改supervisor的配置文件/etc/supervisor/conf.d/sample-code.conf

[program:sample-code]
command=/home/yuhua/SampleCode/.build/release/Run serve --env production
directory=/home/yuhua/SampleCode/
user=yuhua
stdout_logfile=/var/log/supervisor/%(program_name)-stdout.log
stderr_logfile=/var/log/supervisor/%(program_name)-stderr.log

3.配置nginx的samplecode.conf文件

/etc/nginx/sites-enabled下的samplecode.conf文件修改配置。

server {
//監(jiān)聽的域名
    server_name code.yuhua.pub;
//監(jiān)聽的端口
    listen 80;
//vue相關(guān)配置
    location / {
        root /home/yuhua/dist;     
        index index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
//接口轉(zhuǎn)發(fā)配置，后續(xù)接口都是以api開頭
    location ^~ /api/ {
        proxy_pass http://127.0.0.1:8080;
        proxy_pass_header Server;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass_header Server;
        proxy_connect_timeout 3s;
        proxy_read_timeout 10s;
    }
}

4.構(gòu)建vapor項目，然后運行

1.構(gòu)建vapor項目

swift build -c release

這一步有可能會有這個錯誤

-bash: swift: command not found

原因很簡單，當前用戶沒有配置swift的可執(zhí)行文件路徑。使用如下命令添加即可。

echo "export PATH=/usr/share/swift/usr/bin:$PATH" >> ~/.bashrc
source ~/.bashrc

2.啟用supervisor

sudo supervisorctl reread
sudo supervisorctl add sample-code
sudo supervisorctl start sample-code

使用curl測試：

curl http://localhost:8080
訪問接口成功

3.啟用nginx

sudo systemctl start nginx

訪問：http://code.yuhua.pub即可看到頁面

image.png

image.png

curl http://localhost:8080/api/
{"error":true,"reason":"Not Found"}

接口和postman相同，說明這個json是vapor返回的。原因也很簡單，因為我們沒有處理/api/的請求。但是重點不在這里，重點是說明nginx將請求轉(zhuǎn)發(fā)給了vapor。

5.結(jié)果

大功告成，現(xiàn)在就可以投入到服務(wù)器代碼的編寫和前端代碼編寫了。

• 有代碼潔癖的朋友，可以去/root/目錄下，把之前的代碼給刪除掉，我就受不了，都刪了的。