前言
平時開發我會寫一些小demo，我自己覺得有用的會集中起來形成一個專案，本來想利用gitee的gitee page直接部署出來，但后面了解了下，它只支持官網之類的靜態頁面，無法與后臺資料互動，想要完整的服務還是得有自己的服務器(我整了個輕量應用服務器)，接下來我就以此專案為例子，不用敲一行代碼，將其部署到云端，并記錄下具體步驟，
效果
話不多說，先看結果，
- 瀏覽鏈接：http://xisite.top/
- 我做了個特效封面，有滑鼠滑動的漣漪效果，用的ripples.js，
- 具體內容就下面這些，有些是自己開發的，有些是學習程序中收集的，之前疫情可視化的專案https://www.cnblogs.com/xi12/p/16690119.html 也在里面，
服務器
我自己的話，第一步肯定是買現成的云服務器，當然你要買物理設備搭建的話，那你是大佬，下面的你就不用看了，我大概看了下騰訊，阿里，華為等等都是類似的，都可以，我選了阿里的，就以此為例子，
- 直接進阿里云官網，在產品里面找到輕量應用服務器，
- 選擇服務器實體，區域盡量選擇靠近自己位置的，應用鏡像為寶塔(一個服務器管理應用)，沒有選到寶塔也無所謂，后面可以重置，
- 購買完成后從這里進入產品控制臺，
我自己個人使用對機器性能沒有過多要求，買的是2核2g記憶體50g固態，
- 點擊"我的輕量"進入服務器詳情，之前不是寶塔鏡像的可以點擊系統重置，選中寶塔進行重置，
- 在“應用詳情”中找到寶塔面板資訊，點擊遠程連接的Workbench一鍵連接，在彈出的命令列界面中依此輸入這三條命令，獲取面板地址、用戶名、密碼，
- 登錄進入后，即可通過該寶塔面板控制管理你的服務器，
面板進不去的需要在防火墻中開放8888埠，
專案部署
上面服務器相關的就處理完了，接下來是處理專案的部署，
- 點擊“網站”中的添加站點，輸入地址欄的ip地址(自己有域名的也可以直接填寫域名，但需要決議)，
- 點擊“檔案”，站點添加成功后會在這個：/www/wwwroot/目錄下自動生成以你網站名為名的檔案夾，
- 將你專案打包后生成的dist檔案直接拖拽上傳到你的網站名檔案夾下，我是純web前端專案，沒后臺的，這里就不做后端部署說明，
- 在瀏覽器中輸入你的ip地址或域名，是不是頁面已經出來了？沒出來的話需要在防火墻中開放80埠，同時點擊：網站--設定--防盜鏈--允許空HTTP_REFERER請求，出來的仔細瀏覽你的頁面會發現使用了介面的地方會報跨域錯誤，你需要使用nginx進行反向代理，在“軟體商店”中找到nginx進行安裝，
- 安裝完成后，點擊：網站--設定--添加反向代理，
域名
有了ip，為什么還要域名呢？其實使用ip完全是可以訪問使用的，但為了方便人們記憶使用方便所以才出現了域名，一般的頂級域名比較貴，也就知名度比較高，利于seo優化，自己使用的話選一個便宜的也無所謂，我就用了top，
證書
在使用chrome或者edge訪問你自己的頁面時，相信你已經發現了，百度、阿里、騰訊之類的網站在地址欄有個小鎖的圖示，但自己的卻是個感嘆號，標記了不安全，把地址拷出來，會發現他們都是https開頭的，自己的卻是http開頭的，這是由于沒有證書的原因，影響到的就是網站安全性，對于自己的網站要求不高的可以不用管，畢竟我自己私人的玩意兒不值幾個錢，沒人會搞你，但想要證書的也可以自己去買一般比較貴，有免費的，但安全性不高，
結語
此文章僅做自己發布專案的一個記錄，可能還有其他紕漏的地方請見諒，
原創者：曦12
原文鏈接：https://www.cnblogs.com/xi12/p/16974558.html
轉載請注明原創者添加原文鏈接！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/539732.html
標籤：其他