linux不專業心得分享-3 一起來安裝和設定架設網站需要的軟體apache2

linux不專業心得分享-3 一起來安裝和設定架設網站需要的軟體apache2

這篇將帶領你完成整個架設網站的過程,不過在此之前,你需要先有自己的網站資料,
網站資料就是包括文章以及網站所需要的一些檔案,那這些檔案要怎麼產生呢?當然就是看看我之前寫的教學囉!
你可以在你使用的電腦上,使用名為hugo的軟體,產生靜態的網站所需的相關檔案,
要新增文章只需要建立一個.md的純文字檔案,在裡面使用MarkDown這個語法就可以了,在產生網站資料時hugo會自動把.md檔案轉成.html檔案,也就是最終會顯示在網頁上的檔案格式。
不過這系列的教學還在連載中,我會在近期內完成,有事沒事可以進去看看有沒有更新,hugo的教學文章可以到這兩個地方閱讀→
點我前往nvda台灣的小白也能用hugo架設屬於自己的網站 系列文章
點我前往小羔羊分享站的小白也能用hugo架設屬於自己的網站 系列文章

本篇重點摘要

  1. 小知識補充
  2. 在server中安裝apache2
  3. 打開防火牆的80和443port,讓外網可以連線到server中的apache2
  4. 設定apache2的網站設定檔
  5. 下載WinSCP、並用WinSCP連線到server
  6. 用WinSCP上傳網站設定檔到server
  7. 用WinSCP上傳網站資料夾到server
  8. 啟用網站並重啟apache2
  9. 開心的從其他裝置訪問架設好的網站

開始前的小知識補充

為了之後講解的方便,你需要先了解一些知識,這對你了解之後再做什麼很有幫助,
架構好概念之後,以後架設其他網站就會變得十分容易啦!

什麼是apt

在Ubuntu中,有個你需要長使用的軟體,名為apt,
apt是一個軟體管理器,你可以透過它來安裝、移除軟體,
而軟體的來源可以自訂,不過預設就有官方的來源,讓我們可以直接下載軟體來安裝,
早在上篇,就有用到apt來在沒有ufw的linux系統上安裝ufw,所以其實並不難喔!

什麼是apache

通常我們在linux系統上要架設網站的時候,會選擇用apache或Nginx,而我選擇使用的是apache,
apache是一款用來提供網站服務的軟體,除了在linux上可以架設網站之外,我也看過有人在windows上使用apache來架設網站,
介紹它之前,先來了解一下我們天天都會用到的網路連線流程,建立基礎的概念吧。

  1. 每一個網址,都是網域名稱+後綴所組成,
    網域名稱在上篇已經簡單介紹過了,而不同的後綴會有不同的含意,例如.tw是台灣、.cn是中國,還有代表機構的.org,
    網域名稱+後綴所組成的,就可稱為網址,例如我的網站網址→
    lamb.tw
  2. 當你在任何裝置的瀏覽器網址列中輸入了一串網址,會首先連線到網路提供商的電腦,這台電腦有個名字,叫做DNS
  3. 之後會根據DNS電腦中的紀錄,找到這串網址對應的ip地址並發回你的瀏覽器,瀏覽器再透過剛剛拿到的ip地址找到要連線的server
  4. 而找到server後,就會從80或443這兩個port(端口)連線到server中的apache軟體
  5. 根據你所輸入的網址,apache會找到與網址匹配的apache設定檔,之後再把設定檔中指定的網路資料傳送到你的瀏覽器
  6. 最後呈現在瀏覽器上的,就是apache傳回給你的資料了

ok,在上述流程中,每一個步驟其實都是在以毫秒為單位的時間內完成的,
另外,在apache中可以架設許許多多的網站,
每一個網站其實就只是一個apache設定檔,apache設定檔會記錄網站的網址,以及server內網站資料存放的完整路徑,
網站資料就需要用hugo或其他同類軟體產生,產生出的網路資料就是一個資料夾,資料夾內就會放網站所需的子資料夾和相關檔案。
所以你需要做的,只是寫好文章,用hugo產生網路資料相關檔案,設定好apache設定檔,
最後把網路資料上傳到server中,就能完成架設網站的整個流程了。

什麼是http和https

上面說完了網址,那就要來介紹一下http和https了,
當你在瀏覽器輸入一串網址時,例如→
lamb.tw
其實瀏覽器默默地在前面幫你補上了http或https了,因此實際上網址會長這樣→
http://lamb.tw
或是
https://lamb.tw
要特別注意,兩者只差在http後面有沒有s喔。
長話短說,http和https,你只要理解他們都是網路連線的一種協議就好了,有興趣可以上網查查他們的由來,
而比另一個多了一個s的https,其實就是多了名為ssl的安全證書。
在幾年前,google就有推動https的發展,使用https協議網址的網站,就能在搜尋結果中有著更高的排名,
那為什麼要推動https的發展呢? 這是因為http容易被駭客惡意使用,在連線的過程中容易產生安全問題,
因此才有了後來的https,使用https連線的網站會有著更高的安全性,也不易被駭客利用。
而在apache的設定檔中,http和https是兩個不同的設定檔,http的設定檔較為簡單,所以這篇先以http作範例來架設網站,
另外,http使用的是80port(端口),而https會使用到443port(端口),
這也就是上文介紹連線流程時,經過的兩個port(端口),之後我們需要開啟防火牆的這兩個port,別人才能連到你server上的apache。
關於ssl的免費申請、購買和設定,會在之後的文章再進行介紹喔。

什麼是WinSCP

一般來說,當你需要上傳檔案或資料夾到server的時候,就需要以指令的方式,指定要被上傳的檔案或資料夾路徑,以及目的地的資料夾路徑,比較麻煩,
也因為這種方式對小白來說實在太困難、不夠便捷,因此就有了WinSCP這個工具的誕生,
你只需要在軟體上輸入要連線的server地址,例如→
lamb.tw
再輸入用戶名稱跟密碼,就能順利的登入了,
或許你會想,為什麼不需要打http或https呢,難道是軟體也會自動補上嗎?
那是因為,我們這裡要用ssh的協議連線,而ssh用的是22port,
http用的是80port,https用的是443port,且這兩種協議通常都是給瀏覽器用的,所以在這裡才不用打http跟https,
OK! 回到正題,
如果以後登入WinSCP,不想打帳號密碼還能在桌面上建立捷徑,以後點選捷徑就能自動登入,超級方便,
登入後就能以日常操作檔案總管的方式,使用上、下、左、右、enter和倒退鍵來瀏覽資料夾和檔案,
上下傳檔案、資料夾也能用ctrl+c複製、ctrl+v貼上來傳送檔案、資料夾,
唯一需要注意的是,linux系統有著嚴格的權限規範,所以有時候上傳的檔案、資料夾還需要調整一下權限才能在linux被順利的使用,
但也不必太過擔心,所有的設定都能在WinSCP裡,用最直覺的方式完成。


下載

  1. 從官方網站下載WinSCP5.19安裝版
  2. 從小羔羊下載站下載WinSCP6.1安裝版

操作開始

接下來要進入實際操作的流程了,你可以先打開cmd,用ssh登入你的server,
如果忘記操作步驟或指令,可以參考上一篇,
別忘了在cmd裡,要看上面的內容要按小鍵盤7、9查看喔,輸入完指令也要記得按enter送出指令。

安裝apache2

下面有提到要輸入的,就用複製或手打的方式輸入到cmd視窗內。

  1. 更新apt軟體包,這個動作可以抓取apt來源的最新軟體包,輸入→
    apt update
    通常需要跑個幾秒鐘,最後一行會顯示下載了多少大小的軟體包
  2. 安裝apache2,輸入→
    apt install apache2
    之後你會看到下面的詢問訊息
    Do you want to continue? [Y/n]
    輸入→
    y
  3. 最後幾行會看到類似下面的內容,代表安裝完成了
    Processing triggers for man-db (2.9.1-1) ...
    Processing triggers for libc-bin (2.31-0ubuntu9.7) ...
    root@localhost:~#

打開防火牆的80和443port,讓apache可以接受外網的連線

一樣,下面有提到要輸入的,就用複製或手打的方式輸入到cmd視窗內。

  1. 設定防火牆,打開http會用到的80port,輸入→
    sudo ufw allow 80
  2. 設定防火牆,打開https會用到的443port,輸入→
    sudo ufw allow 443
  3. 檢查上面新增的兩個規則是否成功新增到防火牆,輸入後用7、9查看有沒有80跟443→
    sudo ufw status

修改網站的http設定檔

apache網站的設定檔都是以.conf結尾,你可以把.conf理解為副檔名,先在目前使用的電腦上修改這個檔案,在稍後連同網站資料一起上傳到server。

  1. 下載http範例檔案
    點我從小羔羊下載站下載lamb.conf
  2. 用記事本或notepad++打開lamb.conf,並且修改三個地方的內容
    • 修改成自己的網址,如果還沒有註冊域名,可以先到linode複製ipv4的地址,也就是四段數字的ip地址替換下方的網址,例如
      192.168.1.1
      在檔案裡找到這行→
      ServerName lamb.tw
      修改後會像這樣→
      ServerName 192.168.1.1
    • 接下來的這兩個地方,都要輸入之後網路資料存放的絕對路徑,不過網站資料夾最好都統一放在/var/www/這個路徑下
      這裡假設網站資料都放在名為gagaga的資料夾裡,且之後打算放在
      /var/www/
      這個路徑下,那麼,就先在檔案裡找這行→
      <Directory /var/www/lamb_public/>
      修改後看起來會像這樣→
      <Directory /var/www/gagaga/>
      p.s 注意修改完後行尾還有斜線跟大於號,不要把這兩個符號刪掉了,否則啟動網站時會報錯
    • 還有一行也要改,找到→
      DocumentRoot /var/www/lamb_public
      修改完後會像這樣→
      DocumentRoot /var/www/gagaga
      p.s 這裡在gagaga後面就沒有任何符號了,也不要亂加其他符號,不然一樣會在啟動時報錯
  3. 這樣就修改完了,按ctrl+s存檔後就能關閉視窗,
    你也可以把lamb.conf改成你喜歡的檔名,通常為了方便識別,會以網域名稱命名,例如網域名是gagaga,那修改後就是
    gagaga.conf

用WinSCP連線到自己的server

  1. 從上文中提供的連結下載WinSCP
  2. 打開下載好的
    WinSCP-5.19.6-Setup.exe
    安裝過程中有一步會讓你選擇WinSCP的顯示方式,有雙視窗跟檔案總管可以選,
    雙視窗模式可以用tab在本地和遠端server的目錄中交替切換,如果想要單純一點就選檔案總管,這樣怎麼按tab看到的都只會是遠端server的清單目錄和樹狀目錄,比較不易搞混,
    之後其他的步驟就按照引導安裝完成即可!
  3. 安裝完,點了完成後會開啟WinSCP軟體視窗,按tab可以看到幾個編輯框和下拉框,按照接下來的說明填入server的資訊來登入server
    • 下拉式方塊SFTP折疊
      這個不用動,再按一次tab
    • 編輯區空行
      這個編輯框輸入你server的ip或是網址,例如我會輸入lamb.tw
    • 編輯區多行已選取 22
      這個是選擇要用哪一個port(端口)連線,ssh就是用22,所以不用動
    • 編輯區空行
      這裡輸入用戶名稱,例如我就輸入root
    • 編輯區受保護空行
      這裡輸入登入linux的密碼,也就是在linode儀錶板設定的root密碼
    • 儲存(S)分割按鈕子功能表Alt+s
      在這裡往下找
      儲存(S)s
      按enter,會打開設定對話框,設定後以後就能快速的登入了
    • 編輯區已選取 root@www.lamb.tw
      這是根據你上面輸入的內容,自動填入的名稱,你可以修改成自己喜歡的名稱,這裡的名稱也會被用來命名之後建立到桌面上的捷徑名
    • 編輯區已選取 <無>
      這個不用裡它,繼續tab
    • 儲存密碼 (不建議)(P)核取方塊沒勾選Alt+p
      如果你的電腦還有其他人用的話建議不勾,如果自己用可以打勾,這樣才能最快的登入
    • 建立桌面捷徑(C)核取方塊沒勾選Alt+c
      按空格打勾,之後就會在桌面上建立捷徑
    • 確定按鈕
      確定上述設定無誤後在這裡按enter
  4. 焦點應該會回到WinSCP主視窗上,可以先按alt+f4關閉視窗,
  5. 接著從桌面上打開剛剛建立的捷徑,如果你沒有勾選記住密碼,需要先輸入密碼,按enter才會登入,
    如果你有勾選,那在打開桌面上的捷徑後就會登入server了,
    第一次登入會像第一次用cmd登入server一樣,不過這裡是會彈個對話框,詢問是否要連線,選擇是按enter即可
  6. 登入後焦點會停在server的目錄中,不過預設是大圖示,你需要修改成清單,這樣會比較方便使用
  7. 按alt聽到
    檔案(F)子功能表Alt+f
    往右找
    檢視(V)子功能表Alt+v
    往下找
    清單(T)
    或是
    詳細資料(D)
    其中之一都行,按enter
  8. 之後焦點回到清單中,上、下動一動,你應該能看到資料夾和檔案,如果沒有,按倒退鍵往回幾層應該就能看到server裡的目錄跟檔案了,
    要特別注意,可別隨意刪除檔案或資料夾,在linux可沒有資源回收桶的機制,資料刪除後將永遠消失

上傳.conf網站設定檔案到自己的server

  1. 打開桌面上建立好的捷徑,用WinSCP連線到server
  2. 按倒退鍵退到最外層的清單,依序找這幾個資料夾,並按enter進入
    etc
    apache2
    sites-available
    進入後你應該能看到裡面有兩個檔案,分別是
    000-default.conf
    default-ssl.conf
    這兩個是apache預設就有的檔案,你也可以理解為範例檔案,以後要架設其他網站也可以透過複製並修改裡面的內容來完成新網站的設定
  3. 之後離開WinSCP視窗,找到你前面修改好的.conf檔案,例如前面做為範例的
    gagaga.conf
    按ctrl+c複製
  4. 之後切換回WinSCP的視窗,按ctrl+v貼上,會彈出一個對話框,詢問上傳的相關設定,
    如果不要以後每次都彈窗,可以勾選以後不要再提示,接著點是,就開始上傳了
  5. 上傳完成後,你在WinSCP的清單裡就能看到剛貼上的gagaga.conf檔案了
    如果清單沒有找到剛上傳的檔案或資料夾,也可以按
    f5
    手動刷新清單

上傳網站資料夾到自己的server

  1. 打開桌面上建立好的捷徑,用WinSCP連線到server
  2. 按倒退鍵退到最外層的清單,依序找這幾個資料夾,並按enter進入
    var
    www
  3. 離開WinSCP視窗,找到用hugo或其他同類軟體產生的網站資料夾,例如上文一直作為範例的
    gagaga
    資料夾,按ctrl+c複製
  4. 回到WinSCP視窗,按ctrl+v貼上,
    如果前面上傳時你沒有勾選以後不要再詢問,那會再貼上後彈對話框,點是就會開始上傳了,
    這次上傳的步驟會比較久一點,建議先不要關閉WinSCP視窗,你可以先完成接下來啟動網站的步驟,
    p.s 如果WinSCP還有上傳或下載任務,當你按alt+f4要關閉視窗時會彈出對話框,所以關閉WinSCP時記得都要仔細看看對話框裡的內容,避免中斷資料傳輸,
    要查看對話框的內容,NVDA的用戶可以按nvda+b或用NVDA+小鍵盤4或6查看
    另外,如果你看到的是類似這樣的訊息
    是否終止你給捷徑取的名字」工作階段並關閉應用程式,但不儲存工作區?
    這是每次關閉WinSCP都會彈出來的,所以可以安心的按是,即可關閉WinSCP

啟用網站並重啟apache2

  1. 參考上篇用cmd使用ssh登入server的流程,登入自己的server
  2. 接下來要輸入幾個指令,告訴apache啟動剛上傳好的網站
  3. 建立捷徑,這個步驟是把前面上傳到server的網站設定檔,傳送一個捷徑到apache裡,一個專門放要啟動網站的資料夾中,
    將下面這條指令的gagaga替換為你設定檔的名稱,例如你的設定檔是abc.conf,那就只要把下方的gagaga改成abc即可,
    輸入→
    ln -s /etc/apache2/sites-available/gagaga.conf /etc/apache2/sites-enabled/gagaga.conf
    輸入這條指令後,並不會返回任何成功的訊息
  4. 啟動網站,告訴apache要啟動的網站設定檔是哪個,
    下面的指令一樣要把gagaga替換為你設定檔的名稱,輸入→
    a2ensite gagaga.conf
    如果apache有找到你輸入的設定檔,會看到下面這條成功訊息
    Site gagaga already enabled
  5. 重啟apache2,每次修改網站設定檔,都需要重啟apache服務,輸入→
    service apache2 reload
    不管重啟後成功或失敗,也不會返回任何訊息,但有一招可以快速確認究竟有沒有重啟成功,只要再輸入一次→
    service apache2 reload
    沒有看到任何錯誤訊息的話,代表重啟成功,且網站設定檔沒有重大錯誤,
    那麼恭喜你,所有的網站架設流程都完成囉!
    如果你的網站設定檔編輯後出了問題,apache無法啟動它,那在重啟apache時apache會直接崩潰,
    所以當你發現第二次重啟後有錯誤訊息,不妨先檢查一下網站設定檔,也就是.conf的檔案,看看是不是哪邊改錯了,
    你可以用WinSCP找到剛剛我們上傳網站設定檔的地方,也就是server中的
    /etc/apache2/sites-available/
    在清單裡找到剛上傳的gagaga.conf,直接按enter,就能用WinSCP內建的文字編輯器打開,修改完後按ctrl+s儲存,接著在cmd裡輸入
    service apache2 start
    然後再輸入兩次→
    service apache2 reload
    沒有錯誤訊息的話那就完成囉,如果還報錯那就需要在檢查網站設定檔看看有沒有錯漏處了

從自己的pc電腦或其他裝置訪問剛架設好的網站

OK! 費盡了千辛萬苦,終於設定好了,現在你可以打開你的瀏覽器,無論手機或電腦的皆可,
接著在網址列輸入剛剛你在設定檔內編輯的網址,以上文的操作而言,你的網址就是你server的IP,
也就是設定檔中
ServerName
後面的網址,
輸入完後,如果一切按照我的步驟來,你應該可以興奮的發現你的網站已經成功顯示在瀏覽器上了,恭喜你大功告成!


其他問題和補充

最後,因為本篇篇幅已經很長了,所以一些細節和小撇步我們移到下篇再談,
下篇會介紹WinSCP的幾個簡單好用的功能,以及如何在apache架設更多的網站,
還會介紹當你有了自己的域名後,如何修改設定檔,讓所有人都能打簡單好記的網址看到你的網站,
這篇所介紹的有些步驟是只需要做一次的,所以不用害怕接下來的步驟會很複雜,
最後,關於https和ssl可能就要再繼續往後順延了,敬請期待囉!