1. 程式人生 > >複習電商筆記-17-ngnix引數解釋和商品富文字編譯器(前端)

複習電商筆記-17-ngnix引數解釋和商品富文字編譯器(前端)

終極的解決方案-新SSO單點登入

將session從系統中獨立出來。Apache shiro頂級安全框架,它的session管理就是獨立出來的。目前主流做法是利用redis作為session管理的實現,因為redis訪問極其快速。

 

 

upstream狀態引數

狀態

說明

weight

預設為1weight越大,負載的權重就越大

max_fails

允許請求失敗的次數預設為1,當超過最大次數時,返回proxy_next_upstream

模組定義的錯誤

fail_timeout

超時時間

max_fails

次失敗後,暫停的時間

backup

其它所有的非backup機器down或者忙的時候,請求backup機器。所以這臺機器壓力會最輕

 

定義負載均衡裝置的Ip及裝置狀態:

upstream bakend{
      ip_hash;
      server 192.168.163.10:8081 down;
      server 192.168.163.10:8082 weight=2;
      server 192.168.163.10:8083 backup;
}

 

 

IP_HASH

官方解釋:

This directive causes requests to be distributed between upstreams based on the IP-address of the client.

The key for the hash is the class-C network address or the entire IPv6-address of the client. IPv6 is supported for ip_hash since 1.3.2 or 1.2.2. This method guarantees that the client request will always be transferred to the same server. But if this server is considered inoperative, then the request of this client will be transferred to another server. This gives a high probability clients will always connect to the same server. (簡譯:將客戶端ip轉化成C類網路地址,然後將該網路地址當作hash關鍵字,來保證這個客戶端請求總是被轉發到一臺伺服器上)

原始碼這裡:

for( ;; ) {
for(i = 0; i < 3; i++) {
hash = (hash * 113+ iphp->addr[i]) % 6271;  

for迴圈 i 取 012三個值,而ip的點分十進位制表示方法將ip分成四段(如:192.168.1.1),但是這裡迴圈時只將ip的前三個端作為引數加入hash函式。這樣做的目的是保證ip地址前三位相同的使用者經過hash計算將分配到相同的後端server。

作者的這個考慮是極為可取的,因此ip地址前三位相同通常意味著來著同一個區域網或者相鄰區域,使用相同的後端服務讓nginx在一定程度上更具有一致性。

 

 

故障自動切換

nginx轉發請求到tomcat,如果某個tomcat宕機,tomcat會進行超時判斷,如果某個tomcat宕機,訪問不了。它會自動把這個請求轉發給其它的tomcat。保證不會因為一個tomcat宕機導致業務無法繼續訪問。

當宕機服務重啟後可以實現自動重新加入叢集。

 

 

商品描述

 

 

表設計:*垂直分表

 

 

*富文字編輯器KindEditor使用說明

常見的HTML線上編輯器FCKEditor、CKEditor、KindEditor

最常見的問題:黏貼程式碼含有HTML標記導致內容超過顯示內容,儲存時欄位超長。黏貼word最終顯示和word展示樣子有差異。

使用步驟:

第一步:引入js和css。

<link href="/js/kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet">
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/lang/zh_CN.js"></script>

第二步:在form中增加一個textarea控制元件,並設定為隱藏。

隱藏域用於儲存要提交的資料。

在表格中插入一個textarea控制元件,visibility設定為不可見,設定name屬性。

<tr>
    <td>商品描述:</td>
    <td>
	<textarea style="width:800px;height:300px;visibility:hidden;" name="desc"></textarea>
    </td>
</tr>

第三步:頁面載入時執行初始化js方法,建立KindEditor控制元件。

在頁面載入完,執行js,初始化KindEditor控制元件。跟頁面desc控制元件繫結。使用者在KindEditor填寫編輯的內容。

<script type="text/javascript">
	var itemAddEditor ;
	$(function(){
		itemAddEditor = KindEditorUtil.createEditor("#itemAddForm [name=desc]");
		KindEditorUtil.init({fun:function(node){
			KindEditorUtil.changeItemParam(node, "itemAddForm");
		}});
	});

可以看到KindEditor的原理就是在隱藏域前動態插了一個iframe,動態嵌入一個網頁,使用者實際是在這個網頁上編輯內容。

第四步:在提交前執行KindEditor控制元件的同步方法,將資料寫入隱藏的textarea中。

當用戶點選“提交”按鈕時,執行submitForm()方法,在方法中呼叫itemAddEditor.sync()同步方法,將使用者編輯的這個網頁的內容填寫到隱藏域中,這樣form提交就將這個資料提交到後臺controller中進行處理。

 

測試富文字編輯器

利用GoogleChrome瀏覽器的除錯功能,點選F12開啟除錯視窗,在頁面商品描述出,滑鼠右鍵,選擇右鍵選單最下面的“審查元素”,可以看到動態頁面的原始碼(包括js產生的內容)。在concole中輸入:

$(“[name=desc]”) 按回車,偵錯程式展示textare域的程式碼;

$(“[name=desc]”).val()按回車,偵錯程式展示textare域的內容。沒填寫,所以返回空串;

在商品描述框中填寫內容,例如:這個本本不錯。

再執行$(“[name=desc]”).val()按回車,偵錯程式展示仍然為空串,為什麼呢?使用者填寫的內容並沒有填入進去;

那如何寫呢?

Kinder控制元件提供了同步方法,呼叫itemAddEditor.sync();程式碼

$("[name=desc]").val()按回車,展示出使用者填寫的內容。

 

 

 

Chrome除錯跟蹤

在controller中save方法上設定斷點,F12開啟瀏覽器偵錯程式,如下圖,選擇Network,可以檢視提交的form表單資料。