⑴ 在自己搭建的gitlab中，能部署用戶可訪問的前端打包文件嗎
不知道 自建的gitLab 是否有 pages服務，
但是你既然有自己的伺服器，應該是可以通過 Nginx 配置 ，將路徑映射到你打包後的目錄中去。這個是可以實現的
nginx 靜態文件伺服器的配置請網路。
⑵ 前後端分離的前端是怎麼部署到生產環境中的，直接通過 nginx 嗎
1>>前端離意思前端通 JSON 交流...
同意其幾位JSON 種選協議唯未必前端通信佳案
2>>組件化、工程化需要依賴端實現...哪些處或弊端
前端組件化、工程化js 等代碼越越胖點類似於 C/S 代 fat client所問題相於計算主要放 client server
Fat client thin client 取決於所發應用、產品、系統類型、規模特點其些權衡素主要包括軟體復雜度、機交互模型、網路帶寬、server 與 client 處理能力等等所謂壞適合
Client-side MVC 確實趨勢Web 架構設計創新
⑶ 前後端分離的前端是怎麼部署到生產環境中的，直接通過 nginx 嗎
front-end-separate(前後端分離腳手架)
front-end-separate
一個前後端分離的腳手架工具（自主研發）
為什麼選擇grunt而不是gulp
如果你也和我一樣喜歡grunt這種配置的方式，那麼我相信這個腳手架覺對十分適合你
所有靜態資源都md5全並壓縮打包,css,js,img,html
已在生產環境驗證
基於express和grunt的前後端分離框架
模板引擎使用的是nunjucks，好處是可以實現模版繼承，又不像jade一樣把html標簽都簡化了
express提供路由服務
項目中app為原代碼文件（開發用），dist為打包後的文件（用於線上）
開發使用app，線上使用dist，支持一鍵cdn部署，加速你的項目
項目啟動時，修改任何express代碼，可以實現自動重啟–基於nodemon
支持sass圖片精靈（自動打包精靈圖片，再也不用手動去拼湊了）
基於grunt md5 打包合並
線上輸出的html已經壓縮成一行（讓你的代碼更有Geeker范）
⑷ 前端如何部署nginx跨域
跨域基本上都是要後端來配合的，
打比方說，我提供的server，只是供我自己域名下web應用來請求的，如果對方在自己的web應用裡面調用我提供的api，給用戶提供了很好的體驗，但是負荷扔給了我的伺服器，這是不合理的
所以，跨域很難通過前端來配置
那麼就要說解決辦法了
①如果另一面也是自己的伺服器，那麼在自己的伺服器配置即可
②如果是他人的伺服器，那麼可以自己在自己的伺服器上做一個轉發，轉發出去的請求會以你自己伺服器的ip署名，如果對方不同意這個做法，也可以屏蔽掉你，合情合理
⑸ 模塊化後的前端怎麼部署django nginx
以vue框架為例，在nginx.conf中監聽80或443埠的server的路由配置設置為：
location ^~ /api { # url如/api/v1.0/user/info等，通過uwsgi轉發到django後端項目中處理
include /etc/nginx/uwsgi_params;
uwsgi_pass 127.0.0.1:8077;
include /etc/nginx/mime.types;
}
location ^~ /static { # 後端的資源文件夾為static，前端請求後端項目包內的靜態文件
root /root/backend_end_project/static/;
}
location ^~ /admin { # django的後台管理頁面通過uwsgi轉交給django處理
include /etc/nginx/uwsgi_params;
uwsgi_pass 127.0.0.1:8077;
include /etc/nginx/mime.types;
}
location ^~ /assets { # 前端的資源文件夾為assets，前端請求前端項目包內的靜態文件
root /root/front_end_project/dist;
}
location / { # 表示其它路徑都交給前端項目根目錄下的index.html處理
root /root/front_end_project;
try_files $uri /index.html;
}
⑹ nginx怎麼部署前端項目
1、安裝護衛神·nginx大師
2、開設站點，綁定和解析域名
3、上傳前端頁面到網站
⑺ 怎樣實現前端nginx後端apache
說明：
nginx處理靜態內容是把好手，apache雖然佔用內存多了點，性能上稍遜，但一直比較穩健。倒是nginx的FastCGI有時候會出現502
Bad Gateway錯誤。一個可選的方法是nginx做前端代理，處理靜態內容，動態請求統統轉發給後端apache。
本文就是實現Nginx作為前端，apache作為後端。當用戶訪問的是80埠的nginx，然後nginx將靜態內容留給自己，其餘的轉發給非80端
口的apache，apache處理完畢後再回傳給nginx。例如這里我分別訪問www.test.com/a.html,www.test.com
/info.php。nginx因為做前面，nginx的訪問日誌應該都有a.html,info.php的記錄；而apache作為後端，只處理php
請求，應該只有info.php的訪問記錄。
實現：
1.修改nginx配置文件，將php動態請求轉發給apache
# cat /usr/local/nginx/conf/vhosts/test.conf
server
{
listen 80;
server_name www.test.com test.com;
index index.html index.htm index.php default.html default.htm default.php;
root /home/www/data/test;
access_log /usr/local/nginx/logs/test-access.log;
# nginx找不到文件時，轉發請求給後端Apache
error_page 404 @proxy;
# 這是原來lnmp時，nginx自己將php請求提交到127.0.0.1:9000。現在由apache來處理，因此注釋掉這段。
#location ~ .*\.(php|php5)?$
#{
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# include fastcgi.conf;
#}
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
{
expires 30d;
}
location ~ .*\.(js|css)?$
{
expires 12h;
}
# 動態文件.php請求轉發給後端Apache
location ~ \.php$ {
# 向後端伺服器發起請求時添加指定的header頭信息
proxy_set_header Host $http_host;
# 向後端伺服器發送真實 IP
proxy_set_header X-Real-IP $remote_addr;
# 讓後端如php能直接通過變數獲取真實IP
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://127.0.0.1:8080;
}
# nginx找不到文件時，轉發請求給後端Apache
location @proxy {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://127.0.0.1:8080;
}
}
然後只要開啟nginx監聽80埠，apache監聽8080埠，開啟php，就可以了。這邊，我同時開啟nginx，apache的訪問日誌。當我
訪問www.test.com/a.html,www.test.com/info.php時，nginx記錄下了所有a.html,info.html
的訪問請求。
nginx訪問日誌
192.168.45.30 - - [19/Jun/2013:14:41:06 +0800] "GET /a.html HTTP/1.1" 304 0 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:06 +0800] "GET /favicon.ico HTTP/1.1" 404 209 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:08 +0800] "GET /info.php HTTP/1.1" 200 10518 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:08 +0800] "GET /info.php?=PHPE9568F35-D428-11d2-A769-00AA001ACF42 HTTP/1.1" 200 2158 "http://www.test.com/info.php" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:08 +0800] "GET /info.php?=PHPE9568F34-D428-11d2-A769-00AA001ACF42 HTTP/1.1" 200 2536 "http://www.test.com/info.php" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:08 +0800] "GET /favicon.ico HTTP/1.1" 404 209 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /info.php HTTP/1.1" 200 10518 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
當我訪問www.test.com/a.html,www.test.com/info.php時，apache只記錄了info.html的訪問請求。說明nginx將php請求轉發給了apache。這里可以看到來源都是127.0.0.1。而不是真實的來源ip。
apache訪問日誌
127.0.0.1 - - [19/Jun/2013:11:04:16 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:04:23 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:04:31 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:04:34 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:04:39 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:05:09 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:05:18 +0800] "GET /favicon.ico HTTP/1.0" 404 209
127.0.0.1 - - [19/Jun/2013:11:05:24 +0800] "GET /info.php HTTP/1.0" 200 55447
127.0.0.1 - - [19/Jun/2013:11:05:24 +0800] "GET /info.php?=PHPE9568F34-D428-11d2-A769-00AA001ACF42 HTTP/1.0" 200 2524
127.0.0.1 - - [19/Jun/2013:11:05:24 +0800] "GET /info.php?=PHPE9568F35-D428-11d2-A769-00AA001ACF42 HTTP/1.0" 200 2146
127.0.0.1 - - [19/Jun/2013:11:05:24 +0800] "GET /favicon.ico HTTP/1.0" 404 209
2.apache添加mod_rpaf， 獲取nginx轉發過來的真實IP
mod_rpaf模塊不是必須安裝，除非你需要開啟apache日誌，但有多此一舉之嫌，因為已經有nginx日誌了，再開apache日誌話就出現重復了。
Apache rpaf模塊作用是獲取Nginx轉發過來的真實IP，否則在Apache日子中來訪IP全部為127.0.0.1。
# wget http://stderr.net/apache/rpaf/download/mod_rpaf-0.6.tar.gz
# tar zxvf mod_rpaf-0.6.tar.gz
# cd mod_rpaf-0.6
# /usr/local/www/apache/bin/apxs -i -c -n mod_rpaf-2.0.so mod_rpaf-2.0.c
安裝過程中，若出現error: 'conn_rec' has no member named
'remote_ip，請參考附錄1.mod_rpaf-2.0.c error: 'conn_rec' has no
member named 'remote_ip
# vim /usr/local/apache/conf/httpd.conf //在LoadMole後添加以下內容
LoadMole rpaf_mole moles/mod_rpaf-2.0.so
RPAFenable On
RPAFproxy_ips 127.0.0.1
RPAFsethostname On
RPAFheader X-Forwarded-For
下面是apache添加了mod_rpaf模塊後，apache的訪問日誌
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /info.php?=PHPE9568F35-D428-11d2-A769-00AA001ACF42 HTTP/1.1" 200 2158 "http://www.test.com/info.php" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /info.php?=PHPE9568F34-D428-11d2-A769-00AA001ACF42 HTTP/1.1" 200 2536 "http://www.test.com/info.php" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /favicon.ico HTTP/1.1" 404 209 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /info.php HTTP/1.1" 200 10520 "-" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
192.168.45.30 - - [19/Jun/2013:14:41:09 +0800] "GET /info.php?=PHPE9568F34-D428-11d2-A769-00AA001ACF42 HTTP/1.1" 200 2536 "http://www.test.com/info.php" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36"
附錄：
附錄1.mod_rpaf-2.0.c error: 'conn_rec' has no member named
'remote_ip
mod_rpaf-2.0.c: In function 'rpaf_cleanup':
mod_rpaf-2.0.c:150: error: 'conn_rec' has no member named
'remote_ip'
mod_rpaf-2.0.c:151: error: 'conn_rec' has no member named
'remote_addr'
mod_rpaf-2.0.c:151: warning: implicit declaration of function
'inet_addr'
mod_rpaf-2.0.c:151: error: 'conn_rec' has no member named
'remote_ip'
mod_rpaf-2.0.c: In function 'change_remote_ip':
mod_rpaf-2.0.c:164: error: 'conn_rec' has no member named
'remote_ip'
mod_rpaf-2.0.c:183: error: 'conn_rec' has no member named
'remote_ip'
mod_rpaf-2.0.c:186: error: 'conn_rec' has no member named
'remote_ip'
mod_rpaf-2.0.c:187: error: 'conn_rec' has no member named
'remote_addr'
mod_rpaf-2.0.c:187: error: 'conn_rec' has no member named
'remote_ip'
apxs:Error: Command failed with rc=65536
只要將mod_rpaf-2.0.c的150、151、164、183、186、187這幾行的remote_ip修改成client_ip，remote_addr修改成client_addr，
然後再/usr/local/www/apache/bin/apxs -i -c -n mod_rpaf-2.0.so
mod_rpaf-2.0.c即可
⑻ 前後端分離的前端是怎麼部署到生產環境中的，直接通過 nginx 嗎
1、HTML、CSS3、JS、jQuery、BootStrap、交互設計、Ajax、AngularJS等。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服務