Q4. [個人技能題組][Backend] 架設 web 平台，可以放置靜態檔案(ex: 圖片, html)。 #5

wildwindjen · 2017-03-15T07:54:54Z

從現在開始，將以開發一個簡單的購物平台為模擬情境。但是我們得先建立環境。不限 web server，如果你不熟悉，那從安裝 nginx 開始是個不錯的選擇。
a. 什麼是 web server？什麼是 client？什麼是 client-server 架構？還有其他架構嗎？
b. 你安裝了哪一個 web server？為什麼？
c. 你怎麼驗證你架設成功了？

提示:
nginx, apache,...etc。

答題時間: 4 hr

dustfantasy · 2017-03-27T11:35:55Z

「於 2017/03/27 開始答題」
a.
web server是可以用來提供網頁的電腦，而apach是 web server軟體，可以通過這種軟體將自己寫好的網頁放到網路上。
client-server為一種網路架構，訂定client與server兩種角色，其中送出請求的為client，接收的則為server。
p2p為另一種網路架構，與client-server比較，p2p每個點可以同時client與server。
b.
apache
較為耳熟的的一個web server
c.
使用/etc/init.d/apache2 status指令可查看server狀態確定是否運行
在網址輸入localhost:(port)確認設置網頁是否有出現

「於 2017/03/27 答題結束」

HoHow · 2017-03-30T15:27:58Z

「於 2017/03/30 開始答題」
a.1 可以將寫好的程式碼放到web Server 去執行，web server接收request後去處理，回傳response給使用者。
a.2 向伺服端程式提出請求者，都算是用戶端程式。
a.3 以一台運算處理能力較強的電腦為主機，來處理使用者(client)提出的要求(request)和維護資料庫，且部分的工作可由client端電腦處理。
a.4對等式架構、混合式架構
b.1 nginx
b.2 我知道有apache和nginx，因為都沒玩過兩套web server，上網查了說nginx的效能比較好，所以就先安裝nginx來玩玩看。
c.安裝成功時可以看到Welcome to nginx!的字樣顯示在畫面上，也試著把之前的網頁丟上去，可以成功執行。

「於 2017/03/30 答題結束」

dwatow · 2017-04-03T07:59:44Z

「於 2017/04/03 開始答題」
安裝...
a. 一個提供網頁的伺服器程式
b. 用python呼叫python -m SimpleHTTPServer 8000, 瀏覽器連到localhost:8000/，該目錄的index.html就可以顯示在瀏覽器上。
c. 用Postman丟get的API有正確的response

「於 2017/04/03 答題結束」

YenChunchen · 2017-04-04T12:14:29Z

「於 2017/04/04 開始答題」
a. 什麼是 web server？存放後端程式碼及相關target resource接受請求及回傳響應的主機
什麼是 client？向web server發出請求及接收響應的那方
什麼是 client-server 架構？主從式架構,由client端發出請求,server端提供響應資源,因為client-server資源採集中式安全管理,相較於點對點分散式管理,在安全維護上較為容易

還有其他架構嗎？BT常用的P2P點對點的架構,即每個端點都可以同時是client及server
b. 你安裝了哪一個 web server？為什麼？apache2,比較常聽到,加上本機已安裝
c. 你怎麼驗證你架設成功了？使用curl去連ip位置,得到200 OK回應,網頁顯示It's work等圖示

wildwindjen · 2017-04-04T23:38:28Z

@YenChunchen
「通常sever為效能較強大的主機,安全性叫點對點的結構高」
這邊看不懂。出來的東西，請先檢查過。做好比作快還重要。

YenChunchen · 2017-04-05T03:48:36Z

@wildwindjen 修正描述(client-server p2p安全管理的差異

PenguinRun · 2017-04-05T07:40:38Z

「於 2017/04/05 開始答題，因整理blog預計2017/04/06完成」

a. 什麼是 web server？什麼是 client？什麼是 client-server 架構？還有其他架構嗎？
https://medium.com/@justinlee_78563/%E9%97%9C%E6%96%BCweb%E5%BE%8C%E7%AB%AF-1-%E4%BB%80%E9%BA%BC%E6%98%AFweb-server-83ee32bc7d3e

b. 你安裝了哪一個 web server？為什麼？
在內文中是使用了apache，因為之前在Windows系統上是使用apache來做環境佈署。

c. 你怎麼驗證你架設成功了？
https://medium.com/@justinlee_78563/%E9%97%9C%E6%96%BCweb%E5%BE%8C%E7%AB%AF-2-%E6%80%8E%E9%BA%BC%E5%BB%BA%E7%AB%8B%E5%BE%8C%E7%AB%AF%E9%96%8B%E7%99%BC%E7%92%B0%E5%A2%83-b564d3dc309c

「於 2017/04/06 結束答題」

wildwindjen · 2017-04-16T06:44:30Z

@YenChunchen
其實不能證明 client-server 架構比 p2p 安全，安全通常是看各自的實作與流程上的搭配。client-server 是呈現出訊息集中，方便管理的特性，但是不代表比較安全。
ex: server 弱爆了，可是上億人的密碼明文都在 server 上流通。

YenChunchen · 2017-04-17T05:44:46Z

@wildwindjen 了解,所以只能算是安全管理上較方便而已

alxtz · 2017-05-26T06:09:43Z

「於 2017/05/26 開始答題」

a

使用網路的時候，會由一方發出請求，並由另一方接收。
接收方對請求(檔案、網頁、指令)做出相應的回應。

處理請求的一方就叫做 server ，web server 是指使用HTTP協議做傳輸的 server。
client 是在這個模式裡，扮演發出請求的一方。
client-server 架構就是作為 client 和 server 的兩方各司其職。client 只發出請求，server 只接收請求。
例如 P2P (peer-to-peer) 架構，在網路上每個裝置同時是 server 也是 client 。
每個裝置，都可以向其他裝置發請求、以及接收其他裝置的請求。

b

我最後安裝了nginx，原本顯示403，後來發現要在他的預設目錄下加上index.html
我有碰到一個問題，那就是以前有用node.js寫過一個小頁面，那時候只有改port跟路由器的設定，就可以從外面連進我的網站了。

所以原本覺得好像node.js就足以寫出web server該有的功能，對apache、nginx沒什麼概念。(只是顯示檔案node.js也做得到)

後來查了一些資料，web server實際上做的事情除了收request、根據url丟不同資料回去，還有不少功能。(Load Balancing / Virtual Web Server / Falut Handling)

如果是要實際上線的 web server ，似乎是會讓apache、ngnix架在外層處理重導向...等等功能。需要時再呼叫指定的後端程式(node.js...)

apache的設定有點複雜，所以後來先使用了nginx

c

有成功讓頁面從localhost:80上顯示出來
使用 sudo lsof -i ':80' 確認只有nginx在接收localhost:80

參考資料:

web server & file server
node.js VS. apache
check program listening on port X
network & server

「於 2017/05/27 開始答題」

TengLee888 · 2017-11-29T03:25:59Z

「於 2017/11/29 開始答題」

a

什麼是 web server

從網路接受請求，然後提供回覆給請求者client
白話一點：讓client跟我電腦溝通的東西，當client要資料或丟資料給我(server)，server就負責收資料和吐資料給client
最白話：在網路上提供服務的電腦

什麼是 client？

與伺服器相對應，為客戶提供本地服務的程式

什麼是 client-server 架構？

把用戶端與伺服器區分開，用戶向伺服器發出請求，伺服器回復請求，同時也是一個主從式架構
服務端的特徵：
- 被動的角色（從）。
- 等待來自用戶端的請求。
- 處理請求並傳回結果。
用戶端的特徵：
- 主動的角色（主）。
- 發送請求。
- 等待直到收到回應。

還有其他架構

對等式網路 p2p

作用在於，減低以往網路傳輸中的節點，以降低資料遺失的風險。
對等網路的每個用戶端既是一個節點，也有伺服器的功能，任何一個節點無法直接找到其他節點，必須依靠其戶群進行資訊交流。
eg: Bitcoin就是使用這種網路架構

b

nginx
效能好設定較容易聽到是異步就覺得很潮

c

terminal brew services start nginx
瀏覽器 http://localhost:8080/
瀏覽器就會顯示nginx默認的頁面
可以去nginx.conf修改他的設定，把路徑改型以下的圖片就可以連到自己的html了

「於 2017/11/29 結束答題」

godlike0108 · 2018-01-19T07:57:29Z

[於2018/1/18 開始答題]

a

Web Server （伺服端）

Web Server 有兩個意思，第一個是指實體的主機，該主機上裝有伺服器軟體，該主機會根據 HTTP 協定等待客戶端發過來的需求（Request），然後回應（Response）。

第二個意思就是指裝在主機上面，提供回應的伺服器程式。現在多指第二個意思。比較有名的 Web Server 有 nginx 、 apache 等。

Client （用戶端）

Client 簡單來說就是透過網路存取伺服器所提供的服務的軟體。

Client - Server Model

是一個由伺服器跟用戶端所組成的系統。用戶端負責透過網路送出請求給伺服器。伺服器負責等待來自用戶端的請求，並且根據請求所提供的內容將用戶端要求的服務透過網路回傳給用戶端，讓用戶端能夠取得資訊。兩者都使用相同的協定溝通。一個伺服器上可以提供許多不同的服務，一次可以有許多用戶端向伺服器提出請求。

Peer - to - Peer Model（P2P）

點對點系統中，每台電腦不分伺服器與用戶端，同時既是伺服器也是用戶端。在 client - server model 中， client 要和其他 client 溝通，必須通過 server ，且大家都只能透過 server 取得資訊，這種中心化的架構使 server 很吃資源。但是 P2P 不需要，任兩台電腦可以互相溝通並且共享硬體能力的資源。這種分散式的架構使資料流通異常快速，通常這種技術被用在檔案傳輸。

b & c

安裝 nginx

nginx 就是其中一種有名的 web server 。

MacOS 我們用 HomeBrew 安裝。

$brew install nginx

透過 homebrew 安裝的 nginx ，執行檔位置在

/usr/local/Cellar/nginx/<版本編號>/

安裝完後，在終端機輸入指令 nginx 可以開啟伺服器。

$nginx

伺服器預設使用 port:8080 ，打開瀏覽器輸入 localhost:8080 或是在終端機輸入

$curl http://127.0.0.1:8080

都可以看到伺服器成功開啟的畫面。

使用 nginx -s <指令> 可以使用一些簡單指令，例如：

$nginx -s stop # 暴力關閉伺服器
$nginx -s quit # 等待 workers 將現存 requests 執行完再關閉伺服器
$nginx -s reload # 若有更改 nginx.conf，重整使設定生效

nginx -s stop 後再重新整理一次 localhost:8080 就會發現伺服器被關了。

設定 `nginx.conf`

伺服器的設定檔 nginx.conf 被放在

＄cd usr/local/etc/nginx

順帶一提， nginx 安裝檔案的各個路徑可以藉由輸入以下指令查到：

$nginx -V

nginx.conf 由三種結構組合成，第一種是簡單的指示（Simple Directives）：

listen 80; # 前面是命令，後面是值

第二種是區塊命令（Block Directives）：

# 區塊命令裡面裝著一堆簡單命令
location / {
	root html
}

第三種是段落（Context）：

# 段落裡面裝一堆區塊命令或簡單命令
server {
	listen 8080;
	location / {
		# ....
	}
}

要架一個簡單的靜態頁面，得先設定網站的根目錄，然後在根目錄內放入頁面，再指定預設首頁。

根目錄位置會隨著不同的安裝方式而不同，若在 Mac 用 Homebrew 安裝，預設根目錄位置如下：

$ /usr/local/var/www/

如何把根目錄位置移動到我們要的資料夾？

server {
	server_name 	localhost # 伺服器名稱
	listen 				8080 # 要使用的 port
	
	location / {
		root /<指定根目錄位置>/www # www 是習慣問題
		index index.html # 指定首頁名稱
	}
	
	location /images {
		root /<指定根目錄位置>/images # 圖片放置目錄 也是習慣問題
	}
}

/ 就是 Mac OS 的硬碟根目錄，可當成絕對位置的起點用。
用戶端對伺服器發送 request 的時候，伺服器會比對 request 裡面要求的檔案資料夾位置（就是 location 命令後面那個）加上 root 所指定的位置。

接下來只要把 index.html 放在該資料夾的 www 資料夾下，就可以呈現該頁面了。

Reference

nginx 根目錄位置

[於2018/1/19 結束答題]

qscgyujm · 2018-02-15T06:26:58Z

a.

什麼是 web server？

提供網頁服務相關的伺服器，例如apache,IIS,nginx
等都是web server。

什麼是 client？

client端為請求要求給server端，呈現server端的回應資料。

什麼是 client-server 架構？

client-server為主從式架構，client為主動發起需求，向server端發出需求，而server端被動的等待資料的請求，當server端接到請求時，再透過請求回應給client端。

還有其他架構嗎？

另外為p2p架構，即點對點架構，每個點即是server也是client。BT就是著名點對點架構。

b. 你安裝了哪一個 web server？為什麼？

node.js的http原生套件，可以建立一個http的server。

var http = require("http");  
 
http.createServer(function(request, response)   {  
  response.writeHead(200,   {"Content-Type":   "text/plain"});  
  response.write("Hello World");  
  response.end();  
}).listen(8888);

node server.js 駐1

python的webserver，python可以建立一個webserver，透過下列的命令，可以在本機建立web server。

python -m SimpleHTTPServer 註2

nginx

brew install nginx 安裝nginx

問題1: 被說沒有權限訪問註3
A: 使用 sudo nginx 開啟
問題2: 網頁預設port號為80，但開啟後發現localhost為
 註4
A:在路徑:/usr/local/etc/nginx/nginx.conf 加入

server {
    listen       80;
    server_name  localhost;

c. 你怎麼驗證你架設成功了？

node.js:

python:
nginx:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Q4. [個人技能題組][Backend] 架設 web 平台，可以放置靜態檔案(ex: 圖片, html)。 #5

Q4. [個人技能題組][Backend] 架設 web 平台，可以放置靜態檔案(ex: 圖片, html)。 #5

wildwindjen commented Mar 15, 2017 •

edited

Loading

dustfantasy commented Mar 27, 2017 •

edited

Loading

HoHow commented Mar 30, 2017 •

edited

Loading

dwatow commented Apr 3, 2017

YenChunchen commented Apr 4, 2017 •

edited

Loading

wildwindjen commented Apr 4, 2017

YenChunchen commented Apr 5, 2017

PenguinRun commented Apr 5, 2017 •

edited

Loading

wildwindjen commented Apr 16, 2017

YenChunchen commented Apr 17, 2017

alxtz commented May 26, 2017 •

edited

Loading

TengLee888 commented Nov 29, 2017 •

edited

Loading

godlike0108 commented Jan 19, 2018

qscgyujm commented Feb 15, 2018

Q4. [個人技能題組][Backend] 架設 web 平台，可以放置靜態檔案(ex: 圖片, html)。 #5

Q4. [個人技能題組][Backend] 架設 web 平台，可以放置靜態檔案(ex: 圖片, html)。 #5

Comments

wildwindjen commented Mar 15, 2017 • edited Loading

dustfantasy commented Mar 27, 2017 • edited Loading

HoHow commented Mar 30, 2017 • edited Loading

dwatow commented Apr 3, 2017

YenChunchen commented Apr 4, 2017 • edited Loading

wildwindjen commented Apr 4, 2017

YenChunchen commented Apr 5, 2017

PenguinRun commented Apr 5, 2017 • edited Loading

wildwindjen commented Apr 16, 2017

YenChunchen commented Apr 17, 2017

alxtz commented May 26, 2017 • edited Loading

a

b

c

TengLee888 commented Nov 29, 2017 • edited Loading

a

什麼是 web server

什麼是 client？

什麼是 client-server 架構？

還有其他架構

對等式網路 p2p

b

c

godlike0108 commented Jan 19, 2018

a

Web Server （伺服端）

Client （用戶端）

Client - Server Model

Peer - to - Peer Model（P2P）

b & c

安裝 nginx

設定 nginx.conf

Reference

qscgyujm commented Feb 15, 2018

a.

b. 你安裝了哪一個 web server？為什麼？

c. 你怎麼驗證你架設成功了？

wildwindjen commented Mar 15, 2017 •

edited

Loading

dustfantasy commented Mar 27, 2017 •

edited

Loading

HoHow commented Mar 30, 2017 •

edited

Loading

YenChunchen commented Apr 4, 2017 •

edited

Loading

PenguinRun commented Apr 5, 2017 •

edited

Loading

alxtz commented May 26, 2017 •

edited

Loading

TengLee888 commented Nov 29, 2017 •

edited

Loading

設定 `nginx.conf`