一種網絡購物車的異步交互方法
2023-04-23 13:54:26 1
專利名稱：一種網絡購物車的異步交互方法
技術領域：
本發明屬於信息領域，特別是涉及一種網絡購物車的異步交互方法。
背景技術：
網絡購物車是現今電子商務平臺不可或缺的一部分，在電子虛擬交易系統 中發揮了關鍵作用。網絡購物車可以簡單理解為商家為用戶提供的一種方便快
捷的購物工具， 一般採用B/S (瀏覽器/伺服器)結構實現，通過瀏覽器向用戶 所使用的計算機等客戶端提供。通過網絡購物車，可以一次性批量挑選各種不
同的所需商品，並可一次性完成付款。當今的購物車一般具有以下幾種功能
(1) 在瀏覽商品的時候，根據商品信息，可以將商品添加到購物車中。
(2) 將商品成功添加到購物車中後，可以打開購物車頁面查看已經成功添加到
購物車中的商品。
(3) 進入購物車頁面後，可以進行多種操作點擊商品名稱或商品圖片可以査 看商品的詳細信息；可以修改單件商品的購買數量；可以將單件商品從購 物車中刪除；可以從商品頁面繼續將商品添加到購物車中；可以進入結算 頁面實現在線支付購買。
目前的網絡購物車大多用於各類通用的電子商務平臺，主要支持實物商品， 而對於虛擬商品的特殊性，缺乏技術手段進行區分處理。因為數碼圖片之類虛 擬商品不同於實物商品，購買一件與購買多件沒有區別，客戶無需購買多件。為了避免糾紛，如何限制客戶因誤操作等原因而購買了多件同樣虛擬商品，是
網絡購物車技術尚待解決的技術問題。
發明內容
本發明目的在於克服現有技術缺點，提供一種網絡購物車的異步交互方法。
本發明的技術方案對每一種虛擬商品在展示該虛擬商品的HTML頁面的HTML 標籤上設定一個"可購買"標記屬性；當瀏覽器從伺服器端加載展示該虛擬商 品的HTML頁面時通過"可購買"標記屬性標識該虛擬商品是否處於可購買狀 態；
當客戶通過瀏覽器在展示該虛擬商品的HTML頁面點擊該虛擬商品的"購 買"按鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端；服務 器端採用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話 中的購物車對象中添加該虛擬商品，將展示該虛擬商品的HTML頁面中"可購 買"標記屬性修改為標識不可購買狀態，同時修改"購買"按鈕外觀提示用戶 該虛擬商品不可重複購買；
當客戶通過瀏覽器在網絡購物車的HTML頁面點擊該虛擬商品的"刪除"按 鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端，伺服器端採 用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話中的購 物車對象中刪除該虛擬商品，將展示該虛擬商品的HTML頁面中"可購買"標記 屬性恢復，同時恢復"購買"按鈕外觀提示用戶可以繼續購買該商品。
而且，用戶請求參數通過javascript語言的XMLHttpRequest對象使用異 步發送模式發送到伺服器端，所述用戶請求參數包括該虛擬商品的標識碼。
而且，伺服器端在本次http會話中的購物車對象中添加該虛擬商品成功時，發送表示成功添加的返回碼到瀏覽器；添加該虛擬商品不成功時，瀏覽器發送 的用戶請求參數在伺服器端將視為無效請求不予處理，伺服器端發送表示未成 功添加的返回碼到瀏覽器，瀏覽器發出消息提示告訴用戶出現了錯誤。
本發明針對虛擬商品特點，採取標記式技術手段實現不允許將虛擬商品添 加到購物車後繼續購買同一件虛擬商品，當從購物車中刪除某個虛擬商品允許 繼續購買該虛擬商品；同時不允許在購物車中修改單件虛擬商品的購買數量。 本發明具有多種優點對於只需購買一次的虛擬商品，可以做到防止用戶重複 購買而導致額外沒有意義的花費。通過彩色圖標與黑白圖標明白的告訴用戶哪 些商品可以購買，哪些不能購買，即時完成從彩色圖標到黑白圖標的變化切換， 提高了用戶的使用體驗度。對於出錯信息可以在瀏覽器上向用戶報錯，不至於 使用戶不知道問題在哪裡，方便用戶找到出錯原因。
圖1為本發明實施例客戶添加商品到購物車時的購物車交互流程圖。
圖2為本發明實施例的購物車類以及其內部結構圖。 圖3為本發明實施例的客戶端的標籤節點結構與變化示意圖。
具體實施例方式
本發明提供的是一種網絡購物車的異步交互方法，是在商務網站的伺服器 和客戶使用的瀏覽器之間進行的交互。客戶一般使用計算機、智慧型手機等客戶 端，通過瀏覽器登陸商務網站，在伺服器端提供的HTML頁面上瀏覽商品，並按 意願添加商品到購物車或從購物車中刪除商品。伺服器端至少提供有兩種頁面， 一種是展示虛擬商品的HTML頁面，其中提供虛擬商品的"購買"按鈕，以便客 戶點擊購買；另一種展示了購物車中目前所含虛擬商品的HTML頁面，其中將目前所含虛擬商品列表展現，每項虛擬商品旁都提供該商品的虛擬商品的"刪 除"按鈕，以便客戶點擊刪除。兩種頁面中互設超連結以便客戶隨時查看。
本發明提出對每一種虛擬商品在展示該虛擬商品的HTML頁面的HTML標籤 上設定一個"可購買"標記屬性；當客戶端的瀏覽器從伺服器端加載展示該虛 擬商品的HTML頁面時通過"可購買"標記屬性標識該虛擬商品是否處於可購買 狀態。進行這種標記設定後，本發明對客戶添加商品到購物車時、從購物車中 刪除商品時的交互過程分別進行了相應設計。當然，客戶添加虛擬商品到購物 車，前提是該虛擬商品處於可購買狀態；客戶從購物車中刪除虛擬商品時，前 提是該虛擬商品已處於購物車中。
客戶添加虛擬商品到購物車時，有關交互過程如下
當客戶通過瀏覽器在展示該虛擬商品的HTML頁面點擊該虛擬商品的"購 買"按鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端；服務 器端採用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話 中的購物車對象中添加該虛擬商品，將展示該虛擬商品的HTML頁面中"可購 買"標記屬性修改為標識不可購買狀態，同時修改"購買"按鈕外觀提示用戶 該虛擬商品不可重複購買。
客戶從購物車中刪除虛擬商品時，有關交互過程如下
當客戶通過瀏覽器在網絡購物車的HTML頁面點擊該虛擬商品的"刪除"按
鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端，伺服器端採 用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話中的購 物車對象中刪除該虛擬商品，將展示該虛擬商品的HTML頁面中"可購買"標記 屬性恢復，同時恢復"購買"按鈕外觀提示用戶可以繼續購買該商品。特殊情況下，可能出現用戶點擊"購買"按鈕時添加不成功，本發明提出 伺服器端在本次http會話中的購物車對象中添加該虛擬商品成功時，發送表示 成功添加的返回碼到瀏覽器。如果出現了網絡錯誤或其它未知錯誤，購買操作 被異常終止，導致添加該虛擬商品不成功時，瀏覽器發送的用戶請求參數在服 務器端將視為無效請求不予處理，伺服器端發送表示未成功添加的返回碼到瀏 覽器，瀏覽器發出消息提示告訴用戶出現了錯誤。用戶點擊"刪除"按鈕時， 也可根據刪除是否成功，發送相應返回碼到瀏覽器。
具體實施時，可由本領域技術人員運用軟體技術實現本發明技術方案。為 了便於實施參考，提供虛擬商品是數碼圖片的實施例，下面結合實施例及附圖 對本發明作進一步說明，但不限定實施例。
本發明實施例利用現有軟體平臺實現，例如採用作業系統WindowsXP，軟體 開發環境則可採用MyEclipse6. 5. 1實現開發工作平臺，採用Tomcat5. 5實現Web 實現應用伺服器，JSP2.0作為動態網頁技術標準，Javal.5.0為開發語言版本。
異步交互中，用戶所處客戶端和伺服器端分別實現以下操作
(1) 客戶端在瀏覽器所展示頁面中顯示"購買"按鈕的彩色圖標與黑白色圖 標切換效果；虛擬商品的"可購買"標記屬性的切換；實現採用異步發送模式 發送添加或刪除虛擬商品請求。
(2) 伺服器端提供存儲虛擬商品對象的http會話管理容器；接收瀏覽器的 添加或刪除虛擬商品請求並執行後臺虛擬商品對象處理；提供購物車對象容器。 現有技術中的http會話管理容器，英文名為session,可以簡稱為HTTP會話， 這裡側重說明對http會話的管理，因此使用"http會話管理容器"。
實施例在現有軟體平臺支持下，進行以下設定(1) 標記設定即建立購物車對象中虛擬商品的存在狀態與表示該虛擬商 品為可購買狀態的HTML標籤屬性之間的關係；建立代表虛擬商品為可購買狀態 與"購買"按鈕顯示外觀之間的關係。
參見圖2，實施例在JSP環境下進行標記設定。包括構造數碼圖片類Photo 和購物車條目類Cartltem:數碼圖片類Photo用來表示一張數碼圖片，至少具 有一個屬性inCart來表明這個對象是否存在於購物車中；購物車條目類 Cartltem用來表示一件存在於購物車之中的虛擬商品，具有一個元數據對象 photo,其中photo對象為一個Photo類。還包括構造購物車類ShopCart:購物 車類ShopCart用來表示網絡購物車，具有一個列表對象CartltemList，這個列 表用來存儲購物車條目Cartltem對象；同時ShopCart具有添加條目、刪除條
目、清空條目等方法。
每個Cartltem對象都有一個Photo類型的屬性變量photo，將Photo類設 置一個inCart類型的布爾變量屬性。具體表示"購買"按鈕的HTML標籤為一 個a標籤內嵌一個img標籤和一個i叩ut標籤。根據HTML代碼規範，標籤的class 屬性默認簡省，本發明利用a標籤的class屬性，設定a標籤的class屬性為
"buyPhoto"表示為該虛擬商品可以購買；a標籤的class屬性為空表示該虛擬 商品不可購買。input標籤的value屬性用於表示虛擬商品標識碼。
設置兩張一模一樣的圖標圖片 一張為彩色，另一張為黑白色。當a標籤的 class屬性為"buyPhoto"時img標籤的src屬性指向彩色圖標圖片；a標籤的 class屬性為空時img標籤的src屬性指向黑白色圖標圖片。這樣用戶可以很明 顯的區別哪些商品已經添加到購物車中，哪些還沒有添加。
(2) 服務端響應請求機制設定為了便於實現添加商品到購物車過程中的交互，實施例還預先構造伺服器
端針對添加操作的響應請求類AddCartltemAction:添加操作的響應請求類 AddCartltemAction使用異步交互模式響應瀏覽器的添加操作請求。具體添加過 程中，在瀏覽器與伺服器之間的http會話內處理操作如下
1. 首先解析瀏覽器發送的用戶請求參數中的虛擬商品標識碼；
2. 然後從http會話管理容器中獲取本次http會話中的購物車對象 shoppingcaxt;
3. 在http會話管理容器中根據虛擬商品標識碼找到已經存在的虛擬商品對象變 量Obj;
4. 修改虛擬商品對象變量Obj的inCart屬性將inCart屬性置為true,並將 虛擬商品對象變量Obj組裝為一個購物車條目Cartltem對象放入shoppingcart 對象中；
5. 將shoppingcart對象重新放入http會話管理容器中；
6. 根據執行結果反饋返回碼給瀏覽器。
相應地，在從購物車刪除商品的過程中的交互中，設定向伺服器端發送從 購物車中刪除虛擬商品的請求，伺服器端使用異步交互模式響應瀏覽器的添加 操作請求。具體添加過程中，在瀏覽器與伺服器之間的http會話內處理操作如 下
1. 從http會話管理容器中獲取本次http會話中的購物車對象shoppingcart;
2. 在http會話管理容器中根據虛擬商品標識碼找到已經存在的虛擬商品對象變 量Obj;
3. 修改虛擬商品對象變量Obj的inCart屬性將inCart屬性置為false,並將虛擬商品對象變量Obj的購物車條目Cartltem對象從shoppingcart對象中移 除；
4. 將sh叩pingcart對象重新放入http會話管理容器中；
5. 根據執行結果反饋返回碼給瀏覽器。
(3)瀏覽器請求發送與接收響應機制設定 為了便於實現添加商品到購物車過程中的交互，設定利用javascript語言 中的XMLHTTPRequest對象向伺服器端的AddCartltemAction類發送添加虛擬商 品到購物車中的請求(攜帶用戶請求參數發送)，發送完後接收從 AddCartltemAction反饋的返回碼，如果返回碼表示成功添加，則將表示"購 買"按鈕的HTML節點中(即虛擬商品對象變量Obj在頁面上顯示對應的節點) 的a標籤的class屬性設置為空，同時將img標籤的src屬性設為黑白圖標圖 片，可以通過將彩色圖標圖片路徑改為黑白圖標圖片路徑實現。標籤的變化過 程見圖3。具體實施時，也可設置用灰色圖標圖片提出用戶不可購買，只需與彩 色圖標圖片有明顯區別方便辨認即可。
相應地，在購物車刪除商品過程的交互過程中，與添加商品到購物車過程 中的交互過程相似，設定利用javascript語言中的XMLHTTPRequest對象向服 務器端發送從購物車中刪除虛擬商品的請求，發送完後接收從伺服器端反饋的 返回碼，如果返回碼表示成功刪除，則將表示"購買"按鈕的HTML節點中的a 標籤的class屬性設置為"buyPhoto"，同時將img標籤的src屬性設為彩色 圖標圖片。
進行以上設定後，購物車交互遵循設定即可。
參見圖l，實施例中，客戶添加虛擬商品到購物車，虛擬商品由購買到已購買狀態，有關交互過程如下
Al.瀏覽器加載從伺服器端取得的HTML頁面，加載時從http會話管理容器中讀 取虛擬商品對象變量Obj的inCart屬性，如果為true:其中所有的a標籤class 屬性為"buyPh。t。" ，img標籤的six屬性指向彩色圖標圖片；否則a標籤class 屬性為空，img標籤的src屬性指向黑白色圖標圖片。
A2.用戶在瀏覽器點擊"購買"按鈕時，瀏覽器將用戶請求參數採用異步發送模 式發送到伺服器端，包括虛擬商品標識碼。
這個過程是一個異步交互過程，過程中使用了 javascript語言的 XMLHttpRequest對象，用戶在瀏覽器端不需要等待這個點擊"購買"操作的結 果，可以進行其他操作。
A3.伺服器端收到瀏覽器發出的請求後，從用戶請求參數中解析獲取代表虛擬商 品標識碼的變量A:然後完成三個操作
1. 在http會話管理容器中根據變量A找到虛擬商品對象變量Obj，將變量 0bj裝配為一個購物車條目對象並添加到http會話管理容器中的購物車對象中。
2. 將變量0bj的inCart屬性由false轉換置為true,即在伺服器端記錄了 相應虛擬商品是否已經存在於購物車中。
3. 向瀏覽器返回表示執行結果的返回碼。
A4.當瀏覽器收到伺服器端傳回的執行結果代碼後，檢查結果就可知虛擬商品對 象變量0bj代表的虛擬商品是否已經添加到購物車中，如果添加成功或已經存 在於購物車中，則將虛擬商品對應的a標籤的class屬性設置為空，同時將img 標籤的src屬性指向黑白色圖標圖片。此時已經不能再購買虛擬商品，"購買" 圖標為黑白色。實施例中，客戶刪除虛擬商品到購物車時，有關交互過程為
Bl.瀏覽器從伺服器加載網絡購物車的HTML頁面，從http會話管理容器中讀取 虛擬商品對象變量Obj的inCart屬性，購物車中存在的虛擬商品的class屬性 為"空"，此時可以刪除虛擬商品。
B2.用戶在網絡購物車的HTML頁面中，點擊"刪除"按鈕時，瀏覽器將用戶請 求參數採用異步發送模式發送到伺服器端，包含虛擬商品標識碼。 B3.伺服器端根據虛擬商品標識碼在http會話管理容器中的購物車對象中找到 對應的購物車條目對象，並從購物車對象的條目列表中移除這個條目對象。但 是並不刪除虛擬商品對象變量Obj，只是將Obj的inCart屬性置為false。同 時，該虛擬商品對應a標籤的class屬性恢復為"buyPhoto"。 B4.瀏覽器端刷該虛擬商品的HTML頁面，則剛才己經購買過的虛擬商品重新顯 示為可購買狀態，由於class屬性為"buyPhoto" ， img標籤的src屬性指向彩 色圖標圖片，"購買"圖標為彩色。
實施例通過標記限制clasS="可購買"時，"添加"按鈕就是可以點擊 的，反之會變成灰色，為未激活按鈕，失去購買操作的效用。採用現有JAVASCRIPT 技術即可實現這種激活觸發，從而不允許將虛擬商品添加到購物車後繼續購買 同一件虛擬商品。在網絡購物車的HTML頁面中不提供用戶輸入數量的文本輸入 框，則可以控制用戶在購物車中無法修改虛擬商品的購買數量。
權利要求
1.一種網絡購物車的異步交互方法，其特徵在於對每一種虛擬商品在展示該虛擬商品的HTML頁面的HTML標籤上設定一個「可購買」標記屬性；當瀏覽器從伺服器端加載展示該虛擬商品的HTML頁面時通過「可購買」標記屬性標識該虛擬商品是否處於可購買狀態；當客戶通過瀏覽器在展示該虛擬商品的HTML頁面點擊該虛擬商品的「購買」按鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端；伺服器端採用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話中的購物車對象中添加該虛擬商品，將展示該虛擬商品的HTML頁面中「可購買」標記屬性修改為標識不可購買狀態，同時修改「購買」按鈕外觀提示用戶該虛擬商品不可重複購買；當客戶通過瀏覽器在網絡購物車的HTML頁面點擊該虛擬商品的「刪除」按鈕時，瀏覽器將用戶請求參數採用異步發送模式發送到伺服器端，伺服器端採用異步交互模式響應用戶請求參數，根據用戶請求參數在本次http會話中的購物車對象中刪除該虛擬商品，將展示該虛擬商品的HTML頁面中「可購買」標記屬性恢復，同時恢復「購買」按鈕外觀提示用戶可以繼續購買該商品。
2. 根據權利要求1所述網絡購物車的異步交互方法，其特徵在於用戶請求參 數通過javascript語言的XMLHttpRequest對象使用異步發送模式發送到服務 器端，所述用戶請求參數包括該虛擬商品的標識碼。
3. 根據權利要求1或2所述網絡購物車的異步交互方法，其特徵在於伺服器 端在本次http會話中的購物車對象中添加該虛擬商品成功時，發送表示成功添加的返回碼到瀏覽器；添加該虛擬商品不成功時，瀏覽器發送的用戶請求參數 在伺服器端將視為無效請求不予處理，伺服器端發送表示未成功添加的返回碼 到瀏覽器，瀏覽器發出消息提示告訴用戶出現了錯誤。
4.根據權利要求1或2所述網絡購物車的異步交互方法，其特徵在於所述修 改"購買"按鈕外觀提示用戶該虛擬商品不可重複購買，是將"購買"按鈕外 觀由彩色圖標修改為黑白圖標；所述恢復"購買"按鈕外觀提示用戶可以繼續 購買該商品，是將"購買"按鈕外觀由黑白圖標恢復為彩色圖標。
全文摘要
本發明提供一種網絡購物車的異步交互方法，對每一種虛擬商品在展示該虛擬商品的HTML頁面的HTML標籤上設定一個「可購買」標記屬性；當瀏覽器從伺服器端加載展示該虛擬商品的HTML頁面時通過「可購買」標記屬性標識該虛擬商品是否處於可購買狀態，並且通過「購買」按鈕外觀提示用戶該虛擬商品不可重複購買。應用本發明實現的標記式購物車，對於只需購買一次的虛擬商品，可以做到防止用戶重複購買而導致額外沒有意義的花費。這種標記式購物車簡單易用，適合使用於虛擬數碼圖片等虛擬商品的應用環境。
文檔編號G06Q30/00GK101599159SQ200910063170
公開日2009年12月9日 申請日期2009年7月14日 優先權日2009年7月14日
發明者向斯達, 丹 毛, 王亦民, 胡瑞敏, 鐃 陳, 靜 陳 申請人:武漢大學