當前位置:首頁 » 網頁前端 » 前端部署本地伺服器
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

前端部署本地伺服器

發布時間: 2022-08-09 22:06:35

1. 前端通過gulp編譯後的文件,怎麼部署到伺服器

伺服器上寫部署腳本,從代碼庫里拉項目代碼,跑gulp自動化。或者打包傳給後端讓他搞。

2. webpack打包後的代碼,如何部署到伺服器上

本文章前端代碼是基於vue+webpack開發的

Nginx是一款輕量級的Web 伺服器/反向代理伺服器

首先,webpack配置如下

在開發過程中,我們是通過npm run dev在開發環境中運行代碼
如果要部署到生產環境中,可以運行npm run build進行上線打包

打包完成後,會發現項目中多了dist這個文件夾

執行結果和webpack的配置文件一致。

代碼被webpack打包完成後下一步就是部署到伺服器上,此文僅適合於前端代碼是部署在windows操作系統的nginx服務中。
這里假設:
Windows操作系統:windows server 2008 64位
Nginx服務:nginx-1.12.2 64位

1.下載nginx-1.12.2 64位解壓,假設nginx-1.12.2放在D:nginx-1.12.2目錄中,nginx目錄結構。如圖下

2、前端代碼放在D:nginx-1.12.2html目錄中,dist目錄就是剛剛前端打包完的代碼。如圖下

3、在D:nginx-1.12.2conf目錄中,有個nginx.conf配置文件,進行編輯這個文件


4、假設前端的埠號為8082,如果埠號被佔用,請修改為其它埠號。後台服務訪問地址http://192.168.121.**:8080,

5、打開cmd控制台,進入目錄D:nginx-1.12.2中,用start nginx命令啟動服務,然後用tasklist /fi "imagename eq nginx.exe",查看nginx服務是否啟動。

4、如果改變配置文件時,需要用nginx -s reload 命令重啟nginx工作進程。

5、關閉服務
nginx -s stop
nginx -s quit 安全關閉
taskkill /F /IM nginx.exe > nul 關閉所有nginx服務

3. 一個前端頁面如何部署

一個前端頁面,在本地直接打開就能訪問。另外如果是要放到伺服器下的話,可以裝個nginx,或者apache,或者tomcat,直接放到網頁路徑下,就行。

4. 前端本地開發和伺服器部署的架構怎樣設計合適

在 Application Virtualization Server Management Console 中創建伺服器組之後,可以使用以下過程向該組中添加伺服器。注意 伺服器組中的所有伺服器必須連接到相同的數據存儲
如果您有一個資料庫的使用頻率非常高,而且由於這些資料庫經常發出更新請求而導致群集復制器過載的話,您需要考慮使用多個群集復制器。在一個伺服器中運行多個群集復制器,可以同時將新的更改復制到其它伺服器中。
如果一個群集復制器在把更改復制到一個資料庫時太忙,會有另外一個群集復制器把更改復制到其它的伺服器。這樣,通過共同分擔復制負荷的方式,多個群集復制器使得數據得到快速的更新並能嚴格的保持同步。

5. 網站的前端伺服器是什麼意思,怎麼和後端伺服器配合

前後端分離部署時,伺服器A用於部署前端項目,稱為前端伺服器,伺服器B用於部署後端項目,稱為後端伺服器。後端伺服器通過開放API的方式,向前端伺服器中的前端項目提供數據或數據操作介面,以此實現前端與後端的銜接。若受項目的成本限制,將前端項目與後端項目部署在同一伺服器上也是可以的,可以通過nginx等反向代理伺服器根據訪問地址進行分發。

6. 常見的前端集成部署方案有哪些各自的優缺點是什麼

您好,這樣的:
磁碟陣列的由來: 由美國柏克萊大學(University of California-Berkeley)在1987年,發表的文章:「A Case for Rendant Arrays of Inexpensive Disks」。文章中,談到了RAID這個字匯,而且定義了RAID的5層級。柏克萊大學研究其研究目的為,反應當時CPU快速的性能。CPU效能每年大約成長30~50%,而硬磁機只能成長約7%。研究小組希望能找出一種新的技術,在短期內,立即提升效能來平衡計算機的運算能力。在當時,柏克萊研究小組的主要研究目的是效能與成本。 另外,研究小組也設計出容錯(fault-tolerance),邏輯數據備份(logical data rendancy),而產生了RAID理論。研究初期,便宜(Inexpensive)的磁碟也是主要的重點,但後來發現,大量便宜磁碟組合並不能適用於現實的生產環境,後來Inexpensive被改為independence,許多獨立的磁碟組。 磁碟陣列,時勢所趨: 自有PC以來,硬碟是最常使用的儲存裝置。但在整個計算機系統架構中,跟CPU與RAM來比,硬碟的速度是PC中最弱的設備之一。所以,為了加速計算機整體的數據流量,增加儲存的吞吐量,進階改進硬碟數據的安全,磁碟陣列的設計因應而生。 硬碟隨著科技的日新月異,現在其容量已達1500GB以上,轉速到了1萬轉,甚至15000轉,而且價格實在是很便宜,再加現在企業流行建造網路,企業資源計劃(Enterprise Resource Planning:ERP)是每個公司建構網路的主要目標。所以,利用區域網絡來傳遞數據,伺服器所使用的硬碟顯得非常重要,除了容量大、速度快之外,穩定更是基本要求。基於此因,磁碟陣列開始被廣泛的應用在個人計算機上。 磁碟陣列其樣式有三種,一是外接式磁碟陣列櫃、二是內接式磁碟陣列卡,三是利用軟體來模擬。外接式磁碟陣列櫃最常被使用大型伺服器上,具可熱抽換(Hot Swap)的特性,不過這類產品的價格都很貴。內接式磁碟陣列卡,因為價格便宜,但需要較高的安裝技術,適合技術人員使用操作。另外利用軟體模擬的方式,由於會拖累機器的速度,不適合大數據流量的伺服器。 由上述可知,現在IDE磁碟陣列大行其道的道理;IDE介面硬碟的穩定度與效能表現已有很大的提升,加上成本考量,所以採用IDE介面硬碟來作為磁碟陣列的解決方案,可說是最佳的方式 在網路存儲中,磁碟陣列是一種把若干硬磁碟驅動器按照一定要求組成一個整體,整個磁碟陣列由陣列控制器管理的系統。磁帶庫是像自動載入磁帶機一樣的基於磁帶的備份系統,磁帶庫由多個驅動器、多個槽、機械手臂組成,並可由機械手臂自動實現磁帶的拆卸和裝填。它能夠提供同樣的基本自動備份和數據恢復功能,同時具有更先進的技術特點。掌握網路存儲設備的安裝、操作使用也是網管員必須要學會的。在架構無線區域網時,對無線路由器、無線網路橋接器AP、無線網卡、天線等無線區域網產品進行安裝、調試和應用操作。 磁碟陣列的主流結構: 磁碟陣列作為獨立系統在主機外直連或通過網路與主機相連。磁碟陣列有多個埠可以被不同主機或不同埠連接。一個主機連接陣列的不同埠可提升傳輸速度。 和目前PC用單磁碟內部集成緩存一樣,在磁碟陣列內部為加快與主機交互速度,都帶有一定量的緩沖存儲器。主機與磁碟陣列的緩存交互,緩存與具體的磁碟交互數據。 在應用中,有部分常用的數據是需要經常讀取的,磁碟陣列根據內部的演算法,查找出這些經常讀取的數據,存儲在緩存中,加快主機讀取這些數據的速度,而對於其他緩存中沒有的數據,主機要讀取,則由陣列從磁碟上直接讀取傳輸給主機。對於主機寫入的數據,只寫在緩存中,主機可以立即完成寫操作。然後由緩存再慢慢寫入磁碟。
編輯本段磁碟陣列的優點
RAID的採用為存儲系統(或者伺服器的內置存儲)帶來巨大利益,其中提高傳輸速率和提供容錯功能是最大的優點。 RAID通過同時使用多個磁碟,提高了傳輸速率。RAID通過在多個磁碟上同時存儲和讀取數據來大幅提高存儲系統的數據吞吐量(Throughput)。在RAID中,可以讓很多磁碟驅動器同時傳輸數據,而這些磁碟驅動器在邏輯上又是一個磁碟驅動器,所以使用RAID可以達到單個磁碟驅動器幾倍、幾十倍甚至上百倍的速率。這也是RAID最初想要解決的問題。因為當時CPU的速度增長很快,而磁碟驅動器的數據傳輸速率無法大幅提高,所以需要有一種方案解決二者之間的矛盾。RAID最後成功了。 通過數據校驗,RAID可以提供容錯功能。這是使用RAID的第二個原因,因為普通磁碟驅動器無法提供容錯功能,如果不包括寫在磁碟上的CRC(循環冗餘校驗)碼的話。RAID容錯是建立在每個磁碟驅動器的硬體容錯功能之上的,所以它提供更高的安全性。在很多RAID模式中都有較為完備的相互校驗/恢復的措施,甚至是直接相互的鏡像備份,從而大大提高了RAID系統的容錯度,提高了系統的穩定冗餘性。
編輯本段磁碟陣列問答
1. 什麼是磁碟陣列(Disk Array)? 磁碟陣列(Disk Array)是由一個硬碟控制器來控制多個硬碟的相互連接,使多個硬碟的讀寫同步,減少錯誤,增加效率和可靠度的技術。 2.什麼是RAID? RAID是Rendant Array of Inexpensive Disk的縮寫,意為廉價冗餘磁碟陣列,是磁碟陣列在技術上實現的理論標准,其目的在於減少錯誤、提高存儲系統的性能與可靠度。常用的等級有1、3、5級等。 3.什麼是RAID Level 0? RAID Level 0是Data Striping(數據分割)技術的實現,它將所有硬碟構成一個磁碟陣列,可以同時對多個硬碟做讀寫動作,但是不具備備份及容錯能力,它價格便宜,硬碟使用效率最佳,但是可靠度是最差的。 以一個由兩個硬碟組成的RAID Level 0磁碟陣列為例,它把數據的第1和2位寫入第一個硬碟,第三和第四位寫入第二個硬碟……以此類推,所以叫「數據分割",因為各盤數據的寫入動作是同時做的,所以它的存儲速度可以比單個硬碟快幾倍。 但是,這樣一來,萬一磁碟陣列上有一個硬碟壞了,由於它把數據拆開分別存到了不同的硬碟上,壞了一顆等於中斷了數據的完整性,如果沒有整個磁碟陣列的備份磁帶的話,所有的數據是無法挽回的。因此,盡管它的效率很高,但是很少有人冒著數據丟失的危險採用這項技術。 4.什麼是RAID Level 1? RAID Level 1使用的是Disk Mirror(磁碟映射)技術,就是把一個硬碟的內容同步備份復制到另一個硬碟里,所以具備了備份和容錯能力,這樣做的使用效率不高,但是可靠性高。 5.什麼是RAID Level 3? RAID Level 3採用Byte-interleaving(數據交錯存儲)技術,硬碟在SCSI控制卡下同時動作,並將用於奇偶校驗的數據儲存到特定硬碟機中,它具備了容錯能力,硬碟的使用效率是安裝幾個就減掉一個,它的可靠度較佳。 6.什麼是RAID Level 5? RAID Level 5使用的是Disk Striping(硬碟分割)技術,與Level 3的不同之處在於它把奇偶校驗數據存放到各個硬碟里,各個硬碟在SCSI控制卡的控制下平行動作,有容錯能力,跟Level 3一樣,它的使用效率也是安裝幾個再減掉一個。 7.什麼是熱插拔硬碟? 熱插拔硬碟英文名為Hot-Swappable Disk,在磁碟陣列中,如果使用支持熱插拔技術的硬碟,在有一個硬碟壞掉的情況下,伺服器可以不用關機,直接抽出壞掉的硬碟,換上新的硬碟。一般的商用磁碟陣列在硬碟壞掉的時候,會自動鳴叫提示管理員更換硬碟。
編輯本段RAID技術規范簡介
在計算機發展的初期,「大容量」硬碟的價格還相當高,解決數據存儲安全性問題的主要方法是使用磁帶機等設備進行備份,這種方法雖然可以保證數據的安全,但查閱和備份工作都相當繁瑣。1987年, Patterson、Gibson和Katz這三位工程師在加州大學伯克利分校發表了題為《A Case of Rendant Array of Inexpensive Disks(廉價磁碟冗餘陣列方案)》的論文,其基本思想就是將多隻容量較小的、相對廉價的硬碟驅動器進行有機組合,使其性能超過一隻昂貴的大硬碟。這一設計思想很快被接受,從此RAID技術得到了廣泛應用,數據存儲進入了更快速、更安全、更廉價的新時代。 磁碟陣列對於個人電腦用戶,還是比較陌生和神秘的。印象中的磁碟陣列似乎還停留在這樣的場景中:在寬闊的大廳里,林立的磁碟櫃,數名表情陰郁、早早謝頂的工程師徘徊在其中,不斷從中抽出一塊塊沉重的硬碟,再插入一塊塊似乎更加沉重的硬碟……終於,隨著大容量硬碟的價格不斷降低,個人電腦的性能不斷提升,IDE-RAID作為磁碟性能改善的最廉價解決方案,開始走入一般用戶的計算機系統。 RAID技術主要包含RAID 0~RAID 7等數個規范,它們的側重點各不相同,常見的規范有如下幾種: RAID 0:RAID 0連續以位或位元組為單位分割數據,並行讀/寫於多個磁碟上,因此具有很高的數據傳輸率,但它沒有數據冗餘,因此並不能算是真正的RAID結構。RAID 0隻是單純地提高性能,並沒有為數據的可靠性提供保證,而且其中的一個磁碟失效將影響到所有數據。因此,RAID 0不能應用於數據安全性要求高的場合。 RAID 1:它是通過磁碟數據鏡像實現數據冗餘,在成對的獨立磁碟上產生互 為備份的數據。當原始數據繁忙時,可直接從鏡像拷貝中讀取數據,因此RAID 1可以提高讀取性能。RAID 1是磁碟陣列中單位成本最高的,但提供了很高的數據安全性和可用性。當一個磁碟失效時,系統可以自動切換到鏡像磁碟上讀寫,而不需要重組失效的數據。 RAID 0+1: 也被稱為RAID 10標准,實際是將RAID 0和RAID 1標准結合的產物,在連續地以位或位元組為單位分割數據並且並行讀/寫多個磁碟的同時,為每一塊磁碟作磁碟鏡像進行冗餘。它的優點是同時擁有RAID 0的超凡速度和RAID 1的數據高可靠性,但是CPU佔用率同樣也更高,而且磁碟的利用率比較低。 RAID 2:將數據條塊化地分布於不同的硬碟上,條塊單位為位或位元組,並使用稱為「加重平均糾錯碼(海明碼)」的編碼技術來提供錯誤檢查及恢復。這種編碼技術需要多個磁碟存放檢查及恢復信息,使得RAID 2技術實施更復雜,因此在商業環境中很少使用。 RAID 3:它同RAID 2非常類似,都是將數據條塊化分布於不同的硬碟上,區別在於RAID 3使用簡單的奇偶校驗,並用單塊磁碟存放奇偶校驗信息。如果一塊磁碟失效,奇偶盤及其他數據盤可以重新產生數據;如果奇偶盤失效則不影響數據使用。RAID 3對於大量的連續數據可提供很好的傳輸率,但對於隨機數據來說,奇偶盤會成為寫操作的瓶頸。 RAID 4:RAID 4同樣也將數據條塊化並分布於不同的磁碟上,但條塊單位為塊或記錄。RAID 4使用一塊磁碟作為奇偶校驗盤,每次寫操作都需要訪問奇偶盤,這時奇偶校驗盤會成為寫操作的瓶頸,因此RAID 4在商業環境中也很少使用。 RAID 5:RAID 5不單獨指定的奇偶盤,而是在所有磁碟上交叉地存取數據及奇偶校驗信息。在RAID 5上,讀/寫指針可同時對陣列設備進行操作,提供了更高的數據流量。RAID 5更適合於小數據塊和隨機讀寫的數據。RAID 3與RAID 5相比,最主要的區別在於RAID 3每進行一次數據傳輸就需涉及到所有的陣列盤;而對於RAID 5來說,大部分數據傳輸只對一塊磁碟操作,並可進行並行操作。在RAID 5中有「寫損失」,即每一次寫操作將產生四個實際的讀/寫操作,其中兩次讀舊的數據及奇偶信息,兩次寫新的數據及奇偶信息。 RAID 6:與RAID 5相比,RAID 6增加了第二個獨立的奇偶校驗信息塊。兩個獨立的奇偶系統使用不同的演算法,數據的可靠性非常高,即使兩塊磁碟同時失效也不會影響數據的使用。但RAID 6需要分配給奇偶校驗信息更大的磁碟空間,相對於RAID 5有更大的「寫損失」,因此「寫性能」非常差。較差的性能和復雜的實施方式使得RAID 6很少得到實際應用。 RAID 7:這是一種新的RAID標准,其自身帶有智能化實時操作系統和用於存儲管理的軟體工具,可完全獨立於主機運行,不佔用主機CPU資源。RAID 7可以看作是一種存儲計算機(Storage Computer),它與其他RAID標准有明顯區別。除了以上的各種標准(如表1),我們可以如RAID 0+1那樣結合多種RAID規范來構築所需的RAID陣列,例如RAID 5+3(RAID 53)就是一種應用較為廣泛的陣列形式。用戶一般可以通過靈活配置磁碟陣列來獲得更加符合其要求的磁碟存儲系統。 RAID 5E RAID 5E(RAID 5 Enhencement): RAID 5E是在 RAID 5級別基礎上的改進,與RAID 5類似,數據的校驗信息均勻分布在各硬碟上,但是,在每個硬碟上都保留了一部分未使用的空間,這部分空間沒有進行條帶化,最多允許兩塊物理硬碟出現故障。看起來,RAID 5E和RAID 5加一塊熱備盤好象差不多,其實由於RAID 5E是把數據分布在所有的硬碟上,性能會與RAID5 加一塊熱備盤要好。當一塊硬碟出現故障時,有故障硬碟上的數據會被壓縮到其它硬碟上未使用的空間,邏輯盤保持RAID 5級別。 RAID 5EE RAID 5EE: 與RAID 5E相比,RAID 5EE的數據分布更有效率,每個硬碟的一部分空間被用作分布的熱備盤,它們是陣列的一部分,當陣列中一個物理硬碟出現故障時,數據重建的速度會更快。 開始時RAID方案主要針對SCSI硬碟系統,系統成本比較昂貴。1993年,HighPoint公司推出了第一款IDE-RAID控制晶元,能夠利用相對廉價的IDE硬碟來組建RAID系統,從而大大降低了RAID的「門檻」。從此,個人用戶也開始關注這項技術,因為硬碟是現代個人計算機中發展最為「緩慢」和最缺少安全性的設備,而用戶存儲在其中的數據卻常常遠超計算機的本身價格。在花費相對較少的情況下,RAID技術可以使個人用戶也享受到成倍的磁碟速度提升和更高的數據安全性,現在個人電腦市場上的IDE-RAID控制晶元主要出自HighPoint和Promise公司,此外還有一部分來自AMI公司。 面向個人用戶的IDE-RAID晶元一般只提供了RAID 0、RAID 1和RAID 0+1(RAID 10)等RAID規范的支持,雖然它們在技術上無法與商用系統相提並論,但是對普通用戶來說其提供的速度提升和安全保證已經足夠了。隨著硬碟介面傳輸率的不斷提高,IDE-RAID晶元也不斷地更新換代,晶元市場上的主流晶元已經全部支持ATA 100標准,而HighPoint公司新推出的HPT 372晶元和Promise最新的PDC20276晶元,甚至已經可以支持ATA 133標準的IDE硬碟。在主板廠商競爭加劇、個人電腦用戶要求逐漸提高的今天,在主板上板載RAID晶元的廠商已經不在少數,用戶完全可以不用購置RAID卡,直接組建自己的磁碟陣列,感受磁碟狂飆的速度。 RAID 50 RAID 50:RAID50是RAID5與RAID0的結合。此配置在RAID5的子磁碟組的每個磁碟上進行包括奇偶信息在內的數據的剝離。每個RAID5子磁碟組要求三個硬碟。RAID50具備更高的容錯能力,因為它允許某個組內有一個磁碟出現故障,而不會造成數據丟失。而且因為奇偶位分部於RAID5子磁碟組上,故重建速度有很大提高。優勢:更高的容錯能力,具備更快數據讀取速率的潛力。需要注意的是:磁碟故障會影響吞吐量。故障後重建信息的時間比鏡像配置情況下要長。

7. 我是個前端,公司讓我搭建伺服器,如何弄

公司讓我搭建伺服器,這個說來也簡單,如果是專業的數據中心託管伺服器,會幫你搭建系統,配置環境。我們的數據中心就是這樣,工程師可以協助用戶搭建環境,上傳應用,都是免費服務。

8. 前端的代碼怎麼部署到伺服器

1、安裝護衛神主機大師,一鍵配置全能網站環境
2、用主機大師開設網站,並綁定域名
3、解析域名到伺服器IP
4、FTP上傳前端代碼到伺服器
5、輸入域名即可訪問前端代碼了

9. 如何測試前端設備消息落地本地伺服器

一、PC本地查看(調試)方法

如果是靜態頁面,最簡單的方法就是把這個單一頁面下載(復制)到本地,然後本地運行調試代碼或者看效果。

但是如果是動態頁面,如最終預發布生成的地址為 www.xxx.com/y.html。當頁面內包含數據請求介面時,該介面域名應與www.xxx.com一致。

由於本地測試模擬的環境域名與線上並不一致,所以會導致介面請求變成跨域請求導致請求失敗。所以需要進行上圖部分1的步驟映射本地host為請求介面的域。其具體方法如下:

  • 使用該方法首先需具備一個伺服器環境用於模擬真實的伺服器,即apache、nginx等。

  • 將本地的host(127.0.0.1或本地IP)指向介面所在域,這里的域為www.xxx.com。 具體方法在chrome下可以使用比較簡單的hosts文件管理插件

二、手機端(無線端)查看及簡單測試方法

  • 這種方法僅能用於在手機端查看上文所述的PC端的頁面,並能進行簡單的數據攔截mock操作。

  • 其方法如上圖的第2、3部分,具體步驟如下:

  • PC端安裝代理軟體,本文使用fiddler

  • PC端安裝頁面二維碼生成插件,如chrome二維碼插件的安裝

  • 手機端設置網路代理指向PC端本地IP,埠8888

  • 手機安裝二維碼掃描軟體

  • 打開fiddler,手機端掃描PC端待檢測頁面生成的二維碼,即可查看頁面成功

在這個過程中,可以在fiddler中查看到詳細的數據傳輸及數據請求過程,可以通過fiddler對數據的更改從而mock數據查看頁面結果。

10. 怎麼把VUE項目部署到伺服器上面

1.使用xshell登錄到阿里雲伺服器。安裝nginx(本文安裝到/etc下)

[plain]view plain

  • cd/etc

  • apt-getupdate

  • apt-getinstallnginx

  • 2.首先先配置nginx,然後再根據配置文件做下一步操作

    打開/etc/nginx/nginx.conf文件

    [plain]view plain

  • vim/etc/nginx/nginx.conf

  • 在nginx.conf中配置如下:

    [plain]view plain

  • userwww-data;

  • worker_processesauto;

  • pid/run/nginx.pid;

  • events{

  • worker_connections768;

  • #multi_accepton;

  • }

  • http{

  • ##

  • #BasicSettings

  • ##

  • tcp_nodelayon;

  • keepalive_timeout65;

  • types_hash_max_size2048;

  • #server_tokensoff;

  • #server_names_hash_bucket_size64;

  • #server_name_in_redirectoff;

  • include/etc/nginx/mime.types;

  • default_typeapplication/octet-stream;

  • ##

  • #SSLSettings

  • ##

  • ssl_protocolsTLSv1TLSv1.1TLSv1.2;#DroppingSSLv3,ref:POODLE

  • ssl_prefer_server_cipherson;

  • ##

  • #LoggingSettings

  • ##

  • access_log/var/log/nginx/access.log;

  • error_log/var/log/nginx/error.log;

  • ##

  • #GzipSettings

  • ##

  • gzipon;

  • gzip_disable"msie6";

  • #gzip_varyon;

  • #gzip_proxiedany;

  • #gzip_comp_level6;

  • #gzip_buffers168k;

  • #gzip_http_version1.1;

  • ##

  • #VirtualHostConfigs

  • ##

  • gzipon;

  • gzip_disable"msie6";

  • #gzip_varyon;

  • #gzip_proxiedany;

  • #gzip_comp_level6;

  • #gzip_buffers168k;

  • #gzip_http_version1.1;

  • #gzip_typestext/plaintext/cssapplication/jsonapplication/javascripttext/xmlapplication/xmlapplication/xml+rsstext/javascript;

  • ##

  • #VirtualHostConfigs

  • ##

  • include/etc/nginx/conf.d/*.conf;

  • include/etc/nginx/sites-enabled/*;

  • #以下為我們添加的內容

  • server{

  • listen80;

  • server_nameyour-ipaddress;

  • root/home/my-project/;

  • indexindex.html;

  • location/datas{

  • rewrite^.+datas/?(.*)$/$1break;

  • includeuwsgi_params;

  • proxy_passhttp://ip:port;

  • }

  • }

  • }

  • 接下來就根據配置文件進行下一步工作。配置文件中的server_name後面是阿里雲伺服器的ip地址

    3.配置文件中的listen是nginx監聽的埠號,所以需要在阿里雲伺服器上為80埠添加安全組規則

    在本地的瀏覽器登錄阿里雲伺服器->進入控制台->點擊安全組->點擊配置規則->點擊添加安全組規則,之後配置如下(註:入方向和出方向都要配置)


    4.配置文件中的root和index那兩行表示我們把項目文件夾放在/home/my-project下

    例如有兩個項目文件夾分別為test1,test2,裡面都有index.html。則目錄結構如下

    /home

    |--my-project

    |--test1

    |--index.html

    |--test2

    |--index.html

    則在瀏覽器輸入http://ip/test1/index.html

    伺服器便會在/home/my-project中找到test1下的index.html執行;

    如果在瀏覽器中輸入http://ip/test2/index.html

    伺服器便會在/home/my-project中找到test2下的index.html執行;

    這樣便可以在伺服器下放多個項目文件夾。

    5.所以我們也需要在本地項目的config/index.js里的build下進行修改,如果要把項目放到test1下,則

    [javascript]view plain

  • assetsPublicPath:'/test1/',

  • 如果用到了vue-router,則修改/router/index.js

    [javascript]view plain

  • exportdefaultnewRouter({

  • base:'/test1/',//添加這行

  • linkActiveClass:'active',

  • routes

  • });

  • 6.nginx配置文件中的location則是針對跨域處理,表示把對/datas的請求轉發給http://ip:port,本文中這個http://ip:port下就是需要的數據,例如http://ip:port/seller,在本地項目文件中ajax請求數據的地方如下

    [javascript]view plain

  • consturl='/datas/seller';

  • this.$http.get(url).then((response)=>{

  • .....

  • });

  • 7.修改後在本地命令行下運行:cnpm run build 生成dist文件。把dist文件里的index.html和static文件上傳到伺服器的/home/my-project/test1下,目錄結構如下

    /home

    |--my-project

    |--test1

    |--index.html

    |--static

    8.啟動nginx

    [plain]view plain

  • servicenginxstart

  • 9.至此項目部署成功,在瀏覽器下輸入: http://ip/test1/index.html 即可