第 15 章 建立網路商店

43
15 15 第第第第第第 第第第第第第 15-1 15-1 第第第第第第第 第第第第第第第 15-2 15-2 第第第第第第第第第第 第第第第第第第第第第 15-3 15-3 第第第第第第第第第 第第第第第第第第第 15-4 15-4 第第第第第第第第第 第第第第第第第第第 15-5 15-5 第第第第第第第第第 第第第第第第第第第 15-6 15-6 第第第第第第第第 第第第第第第第第 15-7 15-7 第第第第第第第第第 第第第第第第第第第

Upload: kamal-arnold

Post on 03-Jan-2016

43 views

Category:

Documents


1 download

DESCRIPTION

第 15 章 建立網路商店. 15-1 網路商店的基礎 15-2 網路商店的信用卡檢查 15-3 網路商店的廣告管理 15-4 網路商店的系統架構 15-5 網路商店的產品目錄 15-6 網路商店的購物車 15-7 網路商店的訂單處理. 15-1網路商店的基礎. 15-1-1 什麼是網路商店 15-1-2 網路上的付錢方式. 15-1-1 什麼是網路商店 - 說明. 網路商店是在 Internet 開設的虛擬店面,它的目的和一般實體商店相同,都是開店作生意。不過,網路商店並沒有實際店面,只是模擬現實生活方式,讓使用者在網頁選購商品。 - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: 第 15 章  建立網路商店

第第 1515 章 章 建立網路商店建立網路商店 15-1 15-1 網路商店的基礎網路商店的基礎 15-2 15-2 網路商店的信用卡檢查網路商店的信用卡檢查 15-3 15-3 網路商店的廣告管理網路商店的廣告管理 15-4 15-4 網路商店的系統架構網路商店的系統架構 15-5 15-5 網路商店的產品目錄網路商店的產品目錄 15-6 15-6 網路商店的購物車網路商店的購物車 15-7 15-7 網路商店的訂單處理網路商店的訂單處理

Page 2: 第 15 章  建立網路商店

15-115-1網路商店的基礎網路商店的基礎 15-1-1 15-1-1 什麼是網路商店什麼是網路商店 15-1-2 15-1-2 網路上的付錢方式網路上的付錢方式

Page 3: 第 15 章  建立網路商店

15-1-1 15-1-1 什麼是網路商店什麼是網路商店 -- 說明說明 網路商店是在網路商店是在 InternetInternet 開設的虛擬店面,開設的虛擬店面,

它的目的和一般實體商店相同,都是開店它的目的和一般實體商店相同,都是開店作生意。不過,網路商店並沒有實際店面,作生意。不過,網路商店並沒有實際店面,只是模擬現實生活方式,讓使用者在網頁只是模擬現實生活方式,讓使用者在網頁選購商品。選購商品。

網路商店是模擬現實生活的賣場,讓消費網路商店是模擬現實生活的賣場,讓消費者在虛擬商店推著虛擬購物車,輕鬆在商者在虛擬商店推著虛擬購物車,輕鬆在商品目錄採購所需的商品。品目錄採購所需的商品。

Page 4: 第 15 章  建立網路商店

15-1-1 15-1-1 什麼是網路商店什麼是網路商店 -- 商品目錄商品目錄(( CatalogCatalog ))

網路商店沒有實際賣場架位,也不會將商品實際網路商店沒有實際賣場架位,也不會將商品實際上架,它提供的是商品目錄,讓消費者瀏覽商品上架,它提供的是商品目錄,讓消費者瀏覽商品分類或快速查詢商品,並且提供產品詳細資料來分類或快速查詢商品,並且提供產品詳細資料來模擬賣場架上的商品。模擬賣場架上的商品。

當然網路商店並不能將商品真的放上網頁,取而當然網路商店並不能將商品真的放上網頁,取而代之的是顯示銷售商品的圖片,並且提供快速的代之的是顯示銷售商品的圖片,並且提供快速的商品查詢功能,擁有商品分類目錄和關鍵字搜尋商品查詢功能,擁有商品分類目錄和關鍵字搜尋功能,可以讓消費者快速瀏覽或找到所需的商品。功能,可以讓消費者快速瀏覽或找到所需的商品。

Page 5: 第 15 章  建立網路商店

15-1-1 15-1-1 什麼是網路商店什麼是網路商店 -- 購物車購物車(( Shopping CartShopping Cart ))

購物車的英文為購物車的英文為 Shopping CartShopping Cart ,有些國內網站,有些國內網站稱為購物袋,也就是實體賣場或超級市場採購時,稱為購物袋,也就是實體賣場或超級市場採購時,方便儲存選購商品的哪輛推車,通常我們是推著方便儲存選購商品的哪輛推車,通常我們是推著購物車逛著賣場,看到有意購買的商品,就將它購物車逛著賣場,看到有意購買的商品,就將它放入購物車,在採購完成後才去結帳櫃台結帳。放入購物車,在採購完成後才去結帳櫃台結帳。

同樣的採購流程轉換到同樣的採購流程轉換到 WebWeb 舞台,網路商店依舞台,網路商店依然保留現實生活中的哪輛車,可以讓消費者在網然保留現實生活中的哪輛車,可以讓消費者在網路商店將選購商品丟入車中,只是並非將商品拿路商店將選購商品丟入車中,只是並非將商品拿起來放入購物車,而是將商品資料和數量記錄下起來放入購物車,而是將商品資料和數量記錄下來,並且提供功能隨時可以檢示選購商品的清單,來,並且提供功能隨時可以檢示選購商品的清單,這個功能稱為網路商店的購物車。這個功能稱為網路商店的購物車。

Page 6: 第 15 章  建立網路商店

15-1-2 15-1-2 網路上的付錢方式網路上的付錢方式 -SET-SET 電電子交易子交易 11

在談到網路在談到網路 SETSET(( Secure Electronic Secure Electronic TransactionsTransactions )電子交易前,我們必須看看現實)電子交易前,我們必須看看現實生活是如何使用信用卡刷卡付帳。首先信用卡特生活是如何使用信用卡刷卡付帳。首先信用卡特約商店需要與收單銀行簽約,才能擁有刷卡機和約商店需要與收單銀行簽約,才能擁有刷卡機和簽單,開始接受顧客的信用卡付帳。簽單,開始接受顧客的信用卡付帳。

在信用卡實際交易過程中,授權階段是最重要的在信用卡實際交易過程中,授權階段是最重要的部分,它可以保證特約商店收到錢。轉換到網路部分,它可以保證特約商店收到錢。轉換到網路舞台的信用卡交易,最大的差別是無法真的將信舞台的信用卡交易,最大的差別是無法真的將信用卡刷過刷卡機以取得授權,此時的方法是使用用卡刷過刷卡機以取得授權,此時的方法是使用SETSET。。 SETSET 是網路上進行交易授權格式,這和銀是網路上進行交易授權格式,這和銀行間金融業跨行交易的標準行間金融業跨行交易的標準 ISO8583ISO8583 格式並不格式並不相同。相同。

Page 7: 第 15 章  建立網路商店

15-1-2 15-1-2 網路上的付錢方式網路上的付錢方式 -SET-SET 電電子交易子交易 22

整個網路的授權過程比較複雜,如下圖所整個網路的授權過程比較複雜,如下圖所示:示:

Page 8: 第 15 章  建立網路商店

15-1-2 15-1-2 網路上的付錢方式網路上的付錢方式 -SSL-SSL(( Secure Socket LayerSecure Socket Layer )交易方)交易方

式式 SSLSSL 電子交易缺乏消費者認證,所以,網路商店電子交易缺乏消費者認證,所以,網路商店

需要使消費者加入會員來作把關。不過,只需擁需要使消費者加入會員來作把關。不過,只需擁有別人信用卡資料,就可以在網路上進行消費,有別人信用卡資料,就可以在網路上進行消費,雖然傳送信用卡的資料有加密保護,但是比起雖然傳送信用卡的資料有加密保護,但是比起SETSET 機制的複雜認證,其交易風險就大的多。機制的複雜認證,其交易風險就大的多。

因為因為 SSLSSL 只是將網頁加密傳送來保護信用卡資料只是將網頁加密傳送來保護信用卡資料不被竊取,不被竊取, WebWeb伺服器需要指定加密保護的目伺服器需要指定加密保護的目錄來使用錄來使用 SSLSSL ,不同於,不同於 SETSET 機制需要開發相關程機制需要開發相關程式進行線上交易,式進行線上交易, SSLSSL 相對來說,在實作上就簡相對來說,在實作上就簡單的多。單的多。

Page 9: 第 15 章  建立網路商店

15-2 15-2 網路商店的信用卡檢查網路商店的信用卡檢查 -- 信用信用卡的基礎卡的基礎

信用卡的卡號並不是流水號碼,而是暗藏玄機,信用卡的卡號並不是流水號碼,而是暗藏玄機,它是採用特殊規則和演算法產生的一組號碼。事它是採用特殊規則和演算法產生的一組號碼。事實上,從卡號組合就可以判斷信用卡種類,數學實上,從卡號組合就可以判斷信用卡種類,數學公式可以檢查卡號是否為合法卡號。信用卡的相公式可以檢查卡號是否為合法卡號。信用卡的相關資料,如下所示:關資料,如下所示:• 信用卡種類:卡號前四碼可以判斷是信用卡種類:卡號前四碼可以判斷是 VisaVisa、、 Master Master

CardCard、、 DiscoveryDiscovery或或 American ExpressAmerican Express 等不同種等不同種類的信用卡。類的信用卡。

• 信用卡卡號:數學公式可以檢查信用卡卡號:數學公式可以檢查 1616碼卡號是否為合法碼卡號是否為合法卡號。卡號。

• 有效期限:信用卡上有發卡銀行授予的有效期限,即有效期限:信用卡上有發卡銀行授予的有效期限,即GOOD THRUGOOD THRU 字串後的日期,一張有效的信用卡其刷字串後的日期,一張有效的信用卡其刷卡日期不能超過卡上的日期。卡日期不能超過卡上的日期。

Page 10: 第 15 章  建立網路商店

15-2 15-2 網路商店的信用卡檢查網路商店的信用卡檢查 -- 信用信用卡檢查函式庫:卡檢查函式庫: CreditCardLib.incCreditCardLib.inc

在在 ASP.NETASP.NET 程式輸入程式輸入 1616 碼信用卡卡號後,碼信用卡卡號後,就可以使用就可以使用 CreditCardLib.incCreditCardLib.inc 函式庫的函式庫的函數來執行信用卡檢查。函數說明如下所函數來執行信用卡檢查。函數說明如下所示:示:• checkCardType()checkCardType()函數:檢查信用卡種類。函數:檢查信用卡種類。• validCardNumber()validCardNumber() 函數:使用數學公式判函數:使用數學公式判斷是否為合法卡號,因為數學公式有些敏感,斷是否為合法卡號,因為數學公式有些敏感,所以筆者並不打算詳細說明,有興趣的讀者請所以筆者並不打算詳細說明,有興趣的讀者請自行研究此函數的程式碼。自行研究此函數的程式碼。

Page 11: 第 15 章  建立網路商店

15-3 15-3 網路商店的廣告管理網路商店的廣告管理 15-3-1 AdRotator15-3-1 AdRotator 控制項的網頁廣告控制項的網頁廣告 15-3-2 15-3-2 資料庫監控的網路廣告資料庫監控的網路廣告

Page 12: 第 15 章  建立網路商店

15-3-1 AdRotator15-3-1 AdRotator 控制項的網頁廣控制項的網頁廣告告 -- 說明說明

ASP.NETASP.NET的的 AdRotatorAdRotator 控制項是一個橫控制項是一個橫幅廣告管理元件,屬於幅廣告管理元件,屬於System.Web.UI.WebControlsSystem.Web.UI.WebControls 名稱空間。名稱空間。AdRotatorAdRotator 控制項使用亂數隨機選擇顯示控制項使用亂數隨機選擇顯示的廣告圖片,每一張圖片都是圖片超連結的廣告圖片,每一張圖片都是圖片超連結可以連接目的網址。可以連接目的網址。

Page 13: 第 15 章  建立網路商店

15-3-1 AdRotator15-3-1 AdRotator 控制項的網頁廣控制項的網頁廣告告 -XML-XML 文件的設定檔文件的設定檔

AdRotatorAdRotator控制項是使用控制項是使用 XMLXML 文件來記錄顯示文件來記錄顯示圖片和超連結等相關資訊,其內容如下所示:圖片和超連結等相關資訊,其內容如下所示:

<?xml version="1.0" encoding="Big5"?><?xml version="1.0" encoding="Big5"?><Advertisements><Advertisements> <Ad><Ad> <ImageUrl>images/banner1.gif</ImageUrl><ImageUrl>images/banner1.gif</ImageUrl> <NavigateUrl>http://www.hinet.net</NavigateUrl><NavigateUrl>http://www.hinet.net</NavigateUrl> <AlternateText><AlternateText> 中華電信中華電信 </AlternateText></AlternateText> <Keyword>ISP</Keyword><Keyword>ISP</Keyword> <Impressions>5</Impressions><Impressions>5</Impressions> <Caption><Caption> 中華電信中華電信 </Caption></Caption> </Ad></Ad>…………………………………………</Advertisements></Advertisements>

Page 14: 第 15 章  建立網路商店

15-3-1 AdRotator15-3-1 AdRotator 控制項的網頁廣控制項的網頁廣告告 -- 標籤標籤

在在 ASP.NETASP.NET 程式可以新增程式可以新增 AdRotatorAdRotator 控控制項來顯示網頁廣告,如下所示:制項來顯示網頁廣告,如下所示:

<asp:AdRotator Id="banner" Runat="server"<asp:AdRotator Id="banner" Runat="server"

KeywordFilter="ISP"KeywordFilter="ISP"

AdvertisementFile="Ch15-3-1.xml"AdvertisementFile="Ch15-3-1.xml"

OnAdCreated="AdCreated_Event"OnAdCreated="AdCreated_Event"

BorderWidth="2"/>BorderWidth="2"/>

Page 15: 第 15 章  建立網路商店

15-3-1 AdRotator15-3-1 AdRotator 控制項的網頁廣控制項的網頁廣告告 --事件處理程序事件處理程序

AdRotatorAdRotator控制項提供控制項提供 AdCreatedAdCreated事件,可以事件,可以在標籤使用在標籤使用 OnAdCreatedOnAdCreated屬性指定事件處理程屬性指定事件處理程序,傳入參數是序,傳入參數是 AdCreatedEventArgsAdCreatedEventArgs 物件。物件。例如:例如: AdCreated_Event()AdCreated_Event() 程序,如下所示:程序,如下所示:

Sub AdCreated_Event(Sender As Object, _Sub AdCreated_Event(Sender As Object, _

E As AdCreatedEventArgs) E As AdCreatedEventArgs)

msg.Text = "msg.Text = "連結網址連結網址 : " & E.NavigateUrl: " & E.NavigateUrl

title.Text = E.AdProperties("Caption")title.Text = E.AdProperties("Caption")

End SubEnd Sub

Page 16: 第 15 章  建立網路商店

15-3-2 15-3-2 資料庫監控的網路廣告資料庫監控的網路廣告 -- 說說明明

AdRotatorAdRotator 控制項是使用亂數隨機選擇顯控制項是使用亂數隨機選擇顯示的廣告圖片,並沒有辦法記錄顯示廣告示的廣告圖片,並沒有辦法記錄顯示廣告圖片的次數,或是有多少位使用者曾按下圖片的次數,或是有多少位使用者曾按下圖片超連結,和限制廣告圖片的顯示期限。圖片超連結,和限制廣告圖片的顯示期限。

在本節的在本節的 ASP.NETASP.NET 程式範例是使用資料表程式範例是使用資料表儲存廣告圖片資料,提供欄位記錄圖片顯儲存廣告圖片資料,提供欄位記錄圖片顯示和按下次數,屬於資料庫監控的廣告圖示和按下次數,屬於資料庫監控的廣告圖片管理。片管理。

Page 17: 第 15 章  建立網路商店

15-3-2 15-3-2 資料庫監控的網路廣告資料庫監控的網路廣告 --BannersBanners 資料表資料表

AccessAccess 資料庫資料庫【【 Banners.mdbBanners.mdb】】擁有擁有BannersBanners 資料表,可以儲存廣告圖片的相關資訊,資料表,可以儲存廣告圖片的相關資訊,如下表所示:如下表所示:

欄位名稱 資料類型 大小 說明ID 自動編號 N/A 廣告圖片的編號

URL 文字 50 圖片超連結的網址CurrDisplays 數字 N/A 目前顯示圖片的次數MaxDisplays 數字 N/A 圖片最大的顯示次數CurrClicks 數字 N/A 圖片超連結按一次的次數MaxClicks 數字 N/A 圖片超連結最大允許按一次的次數EndDate 日期/時間 N/A 圖片顯示期限

URLName 文字 50 超連結名稱FigureName 文字 50 廣告圖片的網址

Page 18: 第 15 章  建立網路商店

15-4 15-4 網路商店的系統架構網路商店的系統架構 15-4-1 15-4-1 網路商店的檔案清單與架構網路商店的檔案清單與架構 15-4-2 15-4-2 網路商店的資料庫網路商店的資料庫 15-4-3 15-4-3 網路商店的主版頁面網路商店的主版頁面

Page 19: 第 15 章  建立網路商店

15-4-1 15-4-1 網路商店的檔案清單與架構網路商店的檔案清單與架構 在網路商店主在網路商店主

目錄「目錄「 Ch1Ch155 」下,擁有」下,擁有33 個子目錄個子目錄App_DataApp_Data、、App_CodeApp_Code和和imagesimages ,其,其說明如右表所說明如右表所示:示:

檔案與目錄 說明BookStore.master 網路商店的主版頁面

Global.asax 處理訪客計數 Application變數和合併匿名 Profile物件web.config 啟用表單基礎驗證、匿名個人化和新增名為Cart的Profile

物件屬性web.sitemap 定義網路商店的導覽架構Default.aspx 網站首頁,可以顯示是登入會員或匿名使用者

CreateUserWizard.aspx 使用 CreateUserWizard控制項來新增會員Login.aspx 使用 Login控制項登入網站

PasswordRecovery.aspx 使用 PasswordRecovery控制項重發忘記的密碼PasswordRecovery.txt 寄送新密碼的郵件內容範本ChangePassword.aspx 使用 ChangePassword控制項更改密碼

Products.aspx 商品目錄ProductDetails.aspx 各商品的詳細資料,包含商品圖片ShoppingCart.aspx 購物車

CheckOut.aspx 訂單處理Products.mdb 儲存商品與訂單資料的 Access資料庫

App_Data目錄 會員管理與 Profile物件的 SQL Server 2005 Express資料庫

App_Code目錄 Visual Basic程式檔案,擁有 ShoppingCart.vb的購物車類別檔,和每一個項目的 CartItem.vb類別檔

images目錄 圖書封面圖片的 JPG檔,檔名就是書號

Page 20: 第 15 章  建立網路商店

15-4-2 15-4-2 網路商店的資料庫網路商店的資料庫 --PublishersPublishers 資料表資料表

在網路商店產品目錄可以使用出版商來進在網路商店產品目錄可以使用出版商來進行分類,也就是行分類,也就是 PublishersPublishers 資料表,其欄資料表,其欄位如下表所示:位如下表所示:

欄位名稱 資料類型 大小 說明PublisherID 文字 3 產品目錄的編號

PublisherName 文字 30 產品目錄的名稱

Page 21: 第 15 章  建立網路商店

15-4-2 15-4-2 網路商店的資料庫網路商店的資料庫 -Orders-Orders資料表資料表

在在 Products.mdbProducts.mdb 資料庫的資料庫的 OrdersOrders 資料資料表儲存訂單資料,其欄位如下表所示:表儲存訂單資料,其欄位如下表所示:

欄位名稱 資料類型 大小 說明OrderID 自動編號 N/A 訂單序號OrderNo 文字 15 訂單編號

OrderDate 日期/時間 N/A 訂單日期UserName 文字 20 訂單的使用者名稱

Name 文字 10 收貨者姓名Address 文字 50 送貨地址

Tel 文字 20 送貨的連絡電話Email 文字 50 送貨的電子郵件地址

Page 22: 第 15 章  建立網路商店

15-4-2 15-4-2 網路商店的資料庫網路商店的資料庫 --OrderItemsOrderItems 資料表資料表

在在 Products.mdbProducts.mdb 資料庫的資料庫的 OrderItemsOrderItems資料表儲存訂單的商品項目,其欄位如下資料表儲存訂單的商品項目,其欄位如下表所示:表所示:

欄位名稱 資料類型 大小 說明ItemNo 自動編號 N/A 訂單項目的序號

OrderNo 文字 15 訂單編號ItemID 文字 6 產品編號

ItemName 文字 30 產品名稱ItemPrice 數字 N/A 產品價格

ItemQuantity 數字 N/A 訂購數量

Page 23: 第 15 章  建立網路商店

15-4-3 15-4-3 網路商店的主版頁面網路商店的主版頁面 --主選主選單單

網路商店的主選單是使用網路商店的主選單是使用 SiteMapDataSourceSiteMapDataSource和和 MenuMenu控制項所建立,如下所示:控制項所建立,如下所示:

<asp:SiteMapDataSource Id="menu" <asp:SiteMapDataSource Id="menu" Runat="server"Runat="server"

ShowStartingNode="False"/>ShowStartingNode="False"/>

<asp:Menu Id="site" Runat="server"<asp:Menu Id="site" Runat="server"

DataSourceID="menu" Width="130"DataSourceID="menu" Width="130"

StaticMenuItemStyle-ForeColor="#6B696B"StaticMenuItemStyle-ForeColor="#6B696B"

StaticHoverStyle-ForeColor="white"StaticHoverStyle-ForeColor="white"

StaticHoverStyle-BackColor="black"/>StaticHoverStyle-BackColor="black"/>

Page 24: 第 15 章  建立網路商店

15-4-3 15-4-3 網路商店的主版頁面網路商店的主版頁面 -- 圖書圖書目錄目錄

網路商店圖書目錄可以使用分類、種類和網路商店圖書目錄可以使用分類、種類和關鍵字方式來搜尋圖書資料,如下圖所示:關鍵字方式來搜尋圖書資料,如下圖所示:

Page 25: 第 15 章  建立網路商店

15-4-3 15-4-3 網路商店的主版頁面網路商店的主版頁面 --事件事件處理程序處理程序

Sub SearchClick(Sender As Object, E As EventArgs)Sub SearchClick(Sender As Object, E As EventArgs) Response.Redirect("Products.aspx?Filter=" & _Response.Redirect("Products.aspx?Filter=" & _ search.Text) search.Text) End SubEnd SubSub PublisherClick(Sender As Object, _Sub PublisherClick(Sender As Object, _ E As EventArgs)E As EventArgs) Response.Redirect("Products.aspx?Publisher=" & _Response.Redirect("Products.aspx?Publisher=" & _ dropList2.SelectedItem.Value & "&Name=" & _dropList2.SelectedItem.Value & "&Name=" & _ dropList2.SelectedItem.Text)dropList2.SelectedItem.Text)End SubEnd SubSub TypeClick(Sender As Object, E As EventArgs)Sub TypeClick(Sender As Object, E As EventArgs) Response.Redirect("Products.aspx?Type=" & _Response.Redirect("Products.aspx?Type=" & _ dropList1.SelectedItem.Text)dropList1.SelectedItem.Text)End SubEnd Sub

Page 26: 第 15 章  建立網路商店

15-5 15-5 網路商店的產品目錄網路商店的產品目錄 15-5-1 15-5-1 顯示產品目錄顯示產品目錄 15-5-2 15-5-2 產品的詳細資料產品的詳細資料

Page 27: 第 15 章  建立網路商店

15-5-1 15-5-1 顯示產品目錄顯示產品目錄 產品目錄產品目錄 ASP.NETASP.NET 程式程式 Products.aspProducts.asp 是是套用套用 BookStore.masterBookStore.master 主版頁面,使用主版頁面,使用GridViewGridView 控制項來顯示圖書資料,如下圖控制項來顯示圖書資料,如下圖所示:所示:

Page 28: 第 15 章  建立網路商店

15-5-2 15-5-2 產品的詳細資料產品的詳細資料 產品詳細資料的產品詳細資料的

ASP.NETASP.NET 程式是程式是ProductDetails.asProductDetails.aspxpx ,它是套用,它是套用BookStore.masterBookStore.master主版頁面,使用主版頁面,使用DetailsViewDetailsView 控制項控制項顯示圖書的詳細資料,顯示圖書的詳細資料,如右圖所示:如右圖所示:

Page 29: 第 15 章  建立網路商店

15-6 15-6 網路商店的購物車網路商店的購物車 15-6-1 ShoppingCart15-6-1 ShoppingCart與與 CartItemCartItem 類別宣告類別宣告 15-6-2 15-6-2 將選購的商品存入購物車將選購的商品存入購物車 15-6-3 15-6-3 檢視購物車的內容檢視購物車的內容 15-6-4 15-6-4 刪除購物車的商品數量刪除購物車的商品數量

Page 30: 第 15 章  建立網路商店

15-6 15-6 網路商店的購物車網路商店的購物車 網路商店的購物車是使用匿名個人化的網路商店的購物車是使用匿名個人化的 ProfileProfile 物件來儲物件來儲

存購物車內容。在存購物車內容。在 web.configweb.config 檔案啟用檔案啟用 WebWeb應用程式應用程式的匿名個人化和新增的匿名個人化和新增 ProfileProfile 物件的物件的 CartCart屬性,如下所示:屬性,如下所示:<system.web><system.web> <roleManager enabled="true"/><roleManager enabled="true"/> <authentication mode="Forms"/> <authentication mode="Forms"/> <anonymousIdentification enabled="true"/><anonymousIdentification enabled="true"/> <profile><profile> <properties><properties> <add name="Cart" allowAnonymous="true"<add name="Cart" allowAnonymous="true" serializeAs="Binary"serializeAs="Binary" type="ShoppingCart"/>type="ShoppingCart"/> </properties></properties> </profile></profile></system.web></system.web>

Page 31: 第 15 章  建立網路商店

15-6-1 ShoppingCart15-6-1 ShoppingCart與與 CartItemCartItem 類類別宣告別宣告

購物車清單是儲存在購物車清單是儲存在 ProfileProfile 物件的物件的 CartCart屬性,屬性,其資料型態其資料型態 ShoppingCartShoppingCart 類別宣告是位在類別宣告是位在「「 App_CodeApp_Code」目錄的」目錄的 Visual BasicVisual Basic 類別檔案。類別檔案。在此目錄的程式碼檔案在執行時會自動進行編譯。在此目錄的程式碼檔案在執行時會自動進行編譯。

ShoppingCartShoppingCart 類別使用類別使用 HashtableHashtable集合物件儲集合物件儲存購物車的商品清單,每一個商品是一個存購物車的商品清單,每一個商品是一個CartItemCartItem 物件。對於儲存在物件。對於儲存在 ProfileProfile 物件的類別物件的類別來說,類別需要使用來說,類別需要使用 <Serializable()><Serializable()> 進行宣進行宣告,如下所示:告,如下所示:

<Serializable()> _<Serializable()> _Public Class ShoppingCartPublic Class ShoppingCart………………End ClassEnd Class

Page 32: 第 15 章  建立網路商店

15-6-2 15-6-2 將選購的商品存入購物車將選購的商品存入購物車 --說明說明

在在 ASP.NETASP.NET 程式程式 ProductDetails.aspxProductDetails.aspx 顯示產顯示產品詳細資料時,品詳細資料時, DetailsViewDetailsView 控制項上方提供控制項上方提供TextBoxTextBox和和 ButtonButton控制項,可以輸入購買數量控制項,可以輸入購買數量來將產品加入購物車,如下圖所示:來將產品加入購物車,如下圖所示:

Page 33: 第 15 章  建立網路商店

15-6-2 15-6-2 將選購的商品存入購物車將選購的商品存入購物車 --AddCart()AddCart() 事件處理程序事件處理程序

Sub AddCart(Sender As Object, E As EventArgs)Sub AddCart(Sender As Object, E As EventArgs) Dim name, price As StringDim name, price As String Dim label As LabelDim label As Label Dim quantity As IntegerDim quantity As Integer If Profile.Cart Is Nothing ThenIf Profile.Cart Is Nothing Then Profile.Cart = New ShoppingCart()Profile.Cart = New ShoppingCart() End IfEnd If label = ProductDetail.FindControl("itemName")label = ProductDetail.FindControl("itemName") name = label.Text ' name = label.Text ' 書名書名 label = ProductDetail.FindControl("itemPrice")label = ProductDetail.FindControl("itemPrice") price = label.Text ' price = label.Text ' 書價書價 If itemQuantity.Text <> "" Then ' If itemQuantity.Text <> "" Then ' 數量數量 quantity = CInt(itemQuantity.Text)quantity = CInt(itemQuantity.Text) ElseElse quantity = 1 ' quantity = 1 ' 預設值為預設值為 11 End IfEnd If Profile.Cart.AddItem(no, name, CDec(price), quantity)Profile.Cart.AddItem(no, name, CDec(price), quantity) Response.Redirect("ShoppingCart.aspx")Response.Redirect("ShoppingCart.aspx")End SubEnd Sub

Page 34: 第 15 章  建立網路商店

15-6-3 15-6-3 檢視購物車的內容檢視購物車的內容 -- 說明說明 當消費者將選購商品加入購物車後,網路商店提當消費者將選購商品加入購物車後,網路商店提

供功能可以檢視購物車內容,也就是執行供功能可以檢視購物車內容,也就是執行ShoppingCart.aspxShoppingCart.aspx的的 ASP.NETASP.NET 程式。不只如程式。不只如此,在主選單選此,在主選單選【【檢視購物車檢視購物車】】也一樣可以檢視也一樣可以檢視購物車內容,如下圖所示:購物車內容,如下圖所示:

Page 35: 第 15 章  建立網路商店

15-6-3 15-6-3 檢視購物車的內容檢視購物車的內容 --建立資建立資料繫結料繫結

ASP.NETASP.NET 程式是使用程式是使用 GridViewGridView 控制項,以表格方式顯控制項,以表格方式顯示購物車內容,其資料來源是示購物車內容,其資料來源是 ShoppingCartShoppingCart 物件,也物件,也就是就是 ProfileProfile 物件的物件的 CartCart屬性。屬性。

程序程序 BindShoppingCart()BindShoppingCart() 可以建立可以建立 GridViewGridView 控制項控制項CartGridCartGrid 的資料繫結,如下所示:的資料繫結,如下所示:

Sub BindShoppingCart()Sub BindShoppingCart() If Profile.Cart IsNot Nothing ThenIf Profile.Cart IsNot Nothing Then If Profile.Cart.Count <> 0 ThenIf Profile.Cart.Count <> 0 Then View.Visible = TrueView.Visible = True CartGrid.DataSource = Profile.Cart.CartItemsCartGrid.DataSource = Profile.Cart.CartItems CartGrid.DataBind()CartGrid.DataBind() ElseElse………………End SubEnd Sub

Page 36: 第 15 章  建立網路商店

15-6-4 15-6-4 刪除購物車的商品數量刪除購物車的商品數量 -- 說說明明

在購物車顯示的選購商品,如果不想購買,只需在購物車顯示的選購商品,如果不想購買,只需按前方的按前方的【【刪除刪除】】鈕,就可以刪除選購商品,如鈕,就可以刪除選購商品,如下圖所示:下圖所示:

Page 37: 第 15 章  建立網路商店

15-6-4 15-6-4 刪除購物車的商品數量刪除購物車的商品數量 - - RemoveItem()RemoveItem() 事件處理程序事件處理程序

按按 F5474F5474 書號前的書號前的【【刪除刪除】】鈕,就可以刪鈕,就可以刪除此項目,也就是執行除此項目,也就是執行 RemoveItem()RemoveItem() 事事件處理程序,如下所示:件處理程序,如下所示:

Sub RemoveItem(Sender As Object, _Sub RemoveItem(Sender As Object, _ E As EventArgs)E As EventArgs) Dim no As String = _Dim no As String = _ CartGrid.SelectedDataKey.ValueCartGrid.SelectedDataKey.Value Profile.Cart.RemoveItem(no)Profile.Cart.RemoveItem(no) BindShoppingCart()BindShoppingCart()End SubEnd Sub

Page 38: 第 15 章  建立網路商店

15-7 15-7 網路商店的訂單處理網路商店的訂單處理 15-7-1 15-7-1 會員管理會員管理 15-7-2 15-7-2 訂單處理訂單處理

Page 39: 第 15 章  建立網路商店

15-7-1 15-7-1 會員管理會員管理 --登入網站登入網站 11

當在購物車按當在購物車按【【結帳結帳】】鈕,如果尚未登入,鈕,如果尚未登入,就會轉址至就會轉址至 Login.aspxLogin.aspx 的登入網站表單,的登入網站表單,如下圖所示:如下圖所示:

Page 40: 第 15 章  建立網路商店

15-7-1 15-7-1 會員管理會員管理 --登入網站登入網站 22

至於為什麼會轉址至至於為什麼會轉址至 Login.aspxLogin.aspx ,因為,因為CheckOut.aspxCheckOut.aspx 程式的程式的 Page_Load()Page_Load() 程程序有檢查使用者是否已經登入網站,如下序有檢查使用者是否已經登入網站,如下所示:所示:If Not User.Identity.IsAuthenticated ThenIf Not User.Identity.IsAuthenticated Then

Response.Redirect("Login.aspx")Response.Redirect("Login.aspx")

End IfEnd If

Page 41: 第 15 章  建立網路商店

15-7-1 15-7-1 會員管理會員管理 --合併匿名使用者合併匿名使用者的的 ProfileProfile 物件物件

當使用者登入網站再次檢視購物車內容時,當使用者登入網站再次檢視購物車內容時,其內容是合併匿名使用者的其內容是合併匿名使用者的 ProfileProfile 物件所物件所取得的商品項目。取得的商品項目。

簡單的說,匿名使用者和會員都擁有自己簡單的說,匿名使用者和會員都擁有自己專屬的專屬的 ProfileProfile 物件,當登入後,我們需要物件,當登入後,我們需要將匿名使用者的將匿名使用者的 ProfileProfile 物件複製給登入會物件複製給登入會員。員。

Page 42: 第 15 章  建立網路商店

15-7-2 15-7-2 訂單處理訂單處理 -- 產生訂單網頁產生訂單網頁 當消費者在購物車上方按下當消費者在購物車上方按下【【結帳結帳】】鈕後,表示鈕後,表示

準備下訂單後,也就是執行準備下訂單後,也就是執行 CheckOut.aspxCheckOut.aspx 程程式產生訂單網頁,如下圖所示:式產生訂單網頁,如下圖所示:

Page 43: 第 15 章  建立網路商店

15-7-2 15-7-2 訂單處理訂單處理 --事件處理程序事件處理程序CheckOut()CheckOut()

在在 CheckOut()CheckOut()事件處理程序首先執行事件處理程序首先執行 SQLSQL指令指令在在 OrdersOrders 資料表新增一筆訂單記錄,然後在資料表新增一筆訂單記錄,然後在OrderItemsOrderItems 資料表新增商品項目的記錄資料,資料表新增商品項目的記錄資料,如下所示:如下所示:

Dim enum1 As IEnumerator = Profile.Cart.CartEnumsDim enum1 As IEnumerator = Profile.Cart.CartEnumsDo While enum1.MoveNext()Do While enum1.MoveNext() strSQL = "INSERT INTO OrderItems (OrderNo, " & _strSQL = "INSERT INTO OrderItems (OrderNo, " & _ "ItemID, ItemName, ItemPrice, ItemQuantity) ""ItemID, ItemName, ItemPrice, ItemQuantity) " strSQL &= "VALUES ('" & lblNo.Text & "','"strSQL &= "VALUES ('" & lblNo.Text & "','" strSQL &= enum1.Current.Key & "','" strSQL &= enum1.Current.Key & "','" strSQL &= enum1.Current.Value.Title & "',"strSQL &= enum1.Current.Value.Title & "'," strSQL &= enum1.Current.Value.Price & ","strSQL &= enum1.Current.Value.Price & "," strSQL &= enum1.Current.Value.Quantity & ")" strSQL &= enum1.Current.Value.Quantity & ")" objCmd = New OleDbCommand(strSQL, objCon)objCmd = New OleDbCommand(strSQL, objCon) objCmd.ExecuteNonQuery()objCmd.ExecuteNonQuery()LoopLoop