1 / 43

第 15 章 建立網路商店

第 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 開設的虛擬店面，它的目的和一般實體商店相同，都是開店作生意。不過，網路商店並沒有實際店面，只是模擬現實生活方式，讓使用者在網頁選購商品。

kamal-arnold
Download Presentation

第 15 章 建立網路商店

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

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

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

  3. 15-1-1 什麼是網路商店-說明 • 網路商店是在Internet開設的虛擬店面，它的目的和一般實體商店相同，都是開店作生意。不過，網路商店並沒有實際店面，只是模擬現實生活方式，讓使用者在網頁選購商品。 • 網路商店是模擬現實生活的賣場，讓消費者在虛擬商店推著虛擬購物車，輕鬆在商品目錄採購所需的商品。

  4. 15-1-1 什麼是網路商店-商品目錄（Catalog） • 網路商店沒有實際賣場架位，也不會將商品實際上架，它提供的是商品目錄，讓消費者瀏覽商品分類或快速查詢商品，並且提供產品詳細資料來模擬賣場架上的商品。 • 當然網路商店並不能將商品真的放上網頁，取而代之的是顯示銷售商品的圖片，並且提供快速的商品查詢功能，擁有商品分類目錄和關鍵字搜尋功能，可以讓消費者快速瀏覽或找到所需的商品。

  5. 15-1-1 什麼是網路商店-購物車（Shopping Cart） • 購物車的英文為Shopping Cart，有些國內網站稱為購物袋，也就是實體賣場或超級市場採購時，方便儲存選購商品的哪輛推車，通常我們是推著購物車逛著賣場，看到有意購買的商品，就將它放入購物車，在採購完成後才去結帳櫃台結帳。 • 同樣的採購流程轉換到Web舞台，網路商店依然保留現實生活中的哪輛車，可以讓消費者在網路商店將選購商品丟入車中，只是並非將商品拿起來放入購物車，而是將商品資料和數量記錄下來，並且提供功能隨時可以檢示選購商品的清單，這個功能稱為網路商店的購物車。

  6. 15-1-2 網路上的付錢方式-SET電子交易1 • 在談到網路SET（Secure Electronic Transactions）電子交易前，我們必須看看現實生活是如何使用信用卡刷卡付帳。首先信用卡特約商店需要與收單銀行簽約，才能擁有刷卡機和簽單，開始接受顧客的信用卡付帳。 • 在信用卡實際交易過程中，授權階段是最重要的部分，它可以保證特約商店收到錢。轉換到網路舞台的信用卡交易，最大的差別是無法真的將信用卡刷過刷卡機以取得授權，此時的方法是使用SET。SET是網路上進行交易授權格式，這和銀行間金融業跨行交易的標準ISO8583格式並不相同。

  7. 15-1-2 網路上的付錢方式-SET電子交易2 • 整個網路的授權過程比較複雜，如下圖所示：

  8. 15-1-2 網路上的付錢方式-SSL（Secure Socket Layer）交易方式 • SSL電子交易缺乏消費者認證，所以，網路商店需要使消費者加入會員來作把關。不過，只需擁有別人信用卡資料，就可以在網路上進行消費，雖然傳送信用卡的資料有加密保護，但是比起SET機制的複雜認證，其交易風險就大的多。 • 因為SSL只是將網頁加密傳送來保護信用卡資料不被竊取，Web伺服器需要指定加密保護的目錄來使用SSL，不同於SET機制需要開發相關程式進行線上交易，SSL相對來說，在實作上就簡單的多。

  9. 15-2 網路商店的信用卡檢查-信用卡的基礎 • 信用卡的卡號並不是流水號碼，而是暗藏玄機，它是採用特殊規則和演算法產生的一組號碼。事實上，從卡號組合就可以判斷信用卡種類，數學公式可以檢查卡號是否為合法卡號。信用卡的相關資料，如下所示： • 信用卡種類：卡號前四碼可以判斷是Visa、Master Card、Discovery或American Express等不同種類的信用卡。 • 信用卡卡號：數學公式可以檢查16碼卡號是否為合法卡號。 • 有效期限：信用卡上有發卡銀行授予的有效期限，即GOOD THRU字串後的日期，一張有效的信用卡其刷卡日期不能超過卡上的日期。

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

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

  12. 15-3-1 AdRotator控制項的網頁廣告-說明 • ASP.NET的AdRotator控制項是一個橫幅廣告管理元件，屬於System.Web.UI.WebControls名稱空間。AdRotator控制項使用亂數隨機選擇顯示的廣告圖片，每一張圖片都是圖片超連結可以連接目的網址。

  13. 15-3-1 AdRotator控制項的網頁廣告-XML文件的設定檔 • AdRotator控制項是使用XML文件來記錄顯示圖片和超連結等相關資訊，其內容如下所示： <?xml version="1.0" encoding="Big5"?> <Advertisements> <Ad> <ImageUrl>images/banner1.gif</ImageUrl> <NavigateUrl>http://www.hinet.net</NavigateUrl> <AlternateText>中華電信</AlternateText> <Keyword>ISP</Keyword> <Impressions>5</Impressions> <Caption>中華電信</Caption> </Ad> …………………… </Advertisements>

  14. 15-3-1 AdRotator控制項的網頁廣告-標籤 • 在ASP.NET程式可以新增AdRotator控制項來顯示網頁廣告，如下所示： <asp:AdRotator Id="banner" Runat="server" KeywordFilter="ISP" AdvertisementFile="Ch15-3-1.xml" OnAdCreated="AdCreated_Event" BorderWidth="2"/>

  15. 15-3-1 AdRotator控制項的網頁廣告-事件處理程序 • AdRotator控制項提供AdCreated事件，可以在標籤使用OnAdCreated屬性指定事件處理程序，傳入參數是AdCreatedEventArgs物件。例如：AdCreated_Event()程序，如下所示： Sub AdCreated_Event(Sender As Object, _ E As AdCreatedEventArgs) msg.Text = "連結網址: " & E.NavigateUrl title.Text = E.AdProperties("Caption") End Sub

  16. 15-3-2 資料庫監控的網路廣告-說明 • AdRotator控制項是使用亂數隨機選擇顯示的廣告圖片，並沒有辦法記錄顯示廣告圖片的次數，或是有多少位使用者曾按下圖片超連結，和限制廣告圖片的顯示期限。 • 在本節的ASP.NET程式範例是使用資料表儲存廣告圖片資料，提供欄位記錄圖片顯示和按下次數，屬於資料庫監控的廣告圖片管理。

  17. 15-3-2 資料庫監控的網路廣告-Banners資料表 • Access資料庫【Banners.mdb】擁有Banners資料表，可以儲存廣告圖片的相關資訊，如下表所示：

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

  19. 15-4-1 網路商店的檔案清單與架構 • 在網路商店主目錄「Ch15」下，擁有3個子目錄App_Data、App_Code和images，其說明如右表所示：

  20. 15-4-2 網路商店的資料庫-Publishers資料表 • 在網路商店產品目錄可以使用出版商來進行分類，也就是Publishers資料表，其欄位如下表所示：

  21. 15-4-2 網路商店的資料庫-Orders資料表 • 在Products.mdb資料庫的Orders資料表儲存訂單資料，其欄位如下表所示：

  22. 15-4-2 網路商店的資料庫-OrderItems資料表 • 在Products.mdb資料庫的OrderItems資料表儲存訂單的商品項目，其欄位如下表所示：

  23. 15-4-3 網路商店的主版頁面-主選單 • 網路商店的主選單是使用SiteMapDataSource和Menu控制項所建立，如下所示： <asp:SiteMapDataSource Id="menu" Runat="server" ShowStartingNode="False"/> <asp:Menu Id="site" Runat="server" DataSourceID="menu" Width="130" StaticMenuItemStyle-ForeColor="#6B696B" StaticHoverStyle-ForeColor="white" StaticHoverStyle-BackColor="black"/>

  24. 15-4-3 網路商店的主版頁面-圖書目錄 • 網路商店圖書目錄可以使用分類、種類和關鍵字方式來搜尋圖書資料，如下圖所示：

  25. 15-4-3 網路商店的主版頁面-事件處理程序 Sub SearchClick(Sender As Object, E As EventArgs) Response.Redirect("Products.aspx?Filter=" & _ search.Text) End Sub Sub PublisherClick(Sender As Object, _ E As EventArgs) Response.Redirect("Products.aspx?Publisher=" & _ dropList2.SelectedItem.Value & "&Name=" & _ dropList2.SelectedItem.Text) End Sub Sub TypeClick(Sender As Object, E As EventArgs) Response.Redirect("Products.aspx?Type=" & _ dropList1.SelectedItem.Text) End Sub

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

  27. 15-5-1 顯示產品目錄 • 產品目錄ASP.NET程式Products.asp是套用BookStore.master主版頁面，使用GridView控制項來顯示圖書資料，如下圖所示：

  28. 15-5-2 產品的詳細資料 • 產品詳細資料的ASP.NET程式是ProductDetails.aspx，它是套用BookStore.master主版頁面，使用DetailsView控制項顯示圖書的詳細資料，如右圖所示：

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

  30. 15-6 網路商店的購物車 • 網路商店的購物車是使用匿名個人化的Profile物件來儲存購物車內容。在web.config檔案啟用Web應用程式的匿名個人化和新增Profile物件的Cart屬性，如下所示： <system.web> <roleManager enabled="true"/> <authentication mode="Forms"/> <anonymousIdentification enabled="true"/> <profile> <properties> <add name="Cart" allowAnonymous="true" serializeAs="Binary" type="ShoppingCart"/> </properties> </profile> </system.web>

  31. 15-6-1 ShoppingCart與CartItem類別宣告 • 購物車清單是儲存在Profile物件的Cart屬性，其資料型態ShoppingCart類別宣告是位在「App_Code」目錄的Visual Basic類別檔案。在此目錄的程式碼檔案在執行時會自動進行編譯。 • ShoppingCart類別使用Hashtable集合物件儲存購物車的商品清單，每一個商品是一個CartItem物件。對於儲存在Profile物件的類別來說，類別需要使用<Serializable()>進行宣告，如下所示： <Serializable()> _ Public Class ShoppingCart ……… End Class

  32. 15-6-2 將選購的商品存入購物車-說明 • 在ASP.NET程式ProductDetails.aspx顯示產品詳細資料時，DetailsView控制項上方提供TextBox和Button控制項，可以輸入購買數量來將產品加入購物車，如下圖所示：

  33. 15-6-2 將選購的商品存入購物車-AddCart()事件處理程序 Sub AddCart(Sender As Object, E As EventArgs) Dim name, price As String Dim label As Label Dim quantity As Integer If Profile.Cart Is Nothing Then Profile.Cart = New ShoppingCart() End If label = ProductDetail.FindControl("itemName") name = label.Text ' 書名 label = ProductDetail.FindControl("itemPrice") price = label.Text ' 書價 If itemQuantity.Text <> "" Then ' 數量 quantity = CInt(itemQuantity.Text) Else quantity = 1 ' 預設值為1 End If Profile.Cart.AddItem(no, name, CDec(price), quantity) Response.Redirect("ShoppingCart.aspx") End Sub

  34. 15-6-3 檢視購物車的內容-說明 • 當消費者將選購商品加入購物車後，網路商店提供功能可以檢視購物車內容，也就是執行ShoppingCart.aspx的ASP.NET程式。不只如此，在主選單選【檢視購物車】也一樣可以檢視購物車內容，如下圖所示：

  35. 15-6-3 檢視購物車的內容-建立資料繫結 • ASP.NET程式是使用GridView控制項，以表格方式顯示購物車內容，其資料來源是ShoppingCart物件，也就是Profile物件的Cart屬性。 • 程序BindShoppingCart()可以建立GridView控制項CartGrid的資料繫結，如下所示： Sub BindShoppingCart() If Profile.Cart IsNot Nothing Then If Profile.Cart.Count <> 0 Then View.Visible = True CartGrid.DataSource = Profile.Cart.CartItems CartGrid.DataBind() Else ……… End Sub

  36. 15-6-4 刪除購物車的商品數量-說明 • 在購物車顯示的選購商品，如果不想購買，只需按前方的【刪除】鈕，就可以刪除選購商品，如下圖所示：

  37. 15-6-4 刪除購物車的商品數量- RemoveItem()事件處理程序 • 按F5474書號前的【刪除】鈕，就可以刪除此項目，也就是執行RemoveItem()事件處理程序，如下所示： Sub RemoveItem(Sender As Object, _ E As EventArgs) Dim no As String = _ CartGrid.SelectedDataKey.Value Profile.Cart.RemoveItem(no) BindShoppingCart() End Sub

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

  39. 15-7-1 會員管理-登入網站1 • 當在購物車按【結帳】鈕，如果尚未登入，就會轉址至Login.aspx的登入網站表單，如下圖所示：

  40. 15-7-1 會員管理-登入網站2 • 至於為什麼會轉址至Login.aspx，因為CheckOut.aspx程式的Page_Load()程序有檢查使用者是否已經登入網站，如下所示： If Not User.Identity.IsAuthenticated Then Response.Redirect("Login.aspx") End If

  41. 15-7-1 會員管理-合併匿名使用者的Profile物件 • 當使用者登入網站再次檢視購物車內容時，其內容是合併匿名使用者的Profile物件所取得的商品項目。 • 簡單的說，匿名使用者和會員都擁有自己專屬的Profile物件，當登入後，我們需要將匿名使用者的Profile物件複製給登入會員。

  42. 15-7-2 訂單處理-產生訂單網頁 • 當消費者在購物車上方按下【結帳】鈕後，表示準備下訂單後，也就是執行CheckOut.aspx程式產生訂單網頁，如下圖所示：

  43. 15-7-2 訂單處理-事件處理程序CheckOut() • 在CheckOut()事件處理程序首先執行SQL指令在Orders資料表新增一筆訂單記錄，然後在OrderItems資料表新增商品項目的記錄資料，如下所示： Dim enum1 As IEnumerator = Profile.Cart.CartEnums Do While enum1.MoveNext() strSQL = "INSERT INTO OrderItems (OrderNo, " & _ "ItemID, ItemName, ItemPrice, ItemQuantity) " strSQL &= "VALUES ('" & lblNo.Text & "','" strSQL &= enum1.Current.Key & "','" strSQL &= enum1.Current.Value.Title & "'," strSQL &= enum1.Current.Value.Price & "," strSQL &= enum1.Current.Value.Quantity & ")" objCmd = New OleDbCommand(strSQL, objCon) objCmd.ExecuteNonQuery() Loop

More Related