架構可擴充的電子商務 web 應用程式

函式
SQL Database
Web Apps

解決方案構想 Solution Idea

如果您想要瞭解如何使用詳細資訊、實行詳細資料、定價指引或程式碼範例來擴充本文，請讓我們知道 GitHub 意見反應！If you'd like to see us expand this article with more information, implementation details, pricing guidance, or code examples, let us know with GitHub Feedback!

架構Architecture

架構圖表會 下載此架構的SVG 。Architecture Diagram Download an SVG of this architecture.

資料流程Data Flow

  1. 使用者會在瀏覽器中存取 web 應用程式並登入。User accesses the web app in browser and signs in.
  2. 瀏覽器會從 Azure 內容傳遞網路提取靜態資源，例如影像。Browser pulls static resources such as images from Azure Content Delivery Network.
  3. 使用者搜尋產品和查詢 SQL database。User searches for products and queries SQL database.
  4. 網站從資料庫提取產品目錄。Web site pulls product catalog from database.
  5. Web 應用程式會從 Blob 儲存體提取產品映射。Web app pulls product images from Blob Storage.
  6. 頁面輸出會在 Azure Cache for Redis 中快取，以獲得更好的效能。Page output is cached in Azure Cache for Redis for better performance.
  7. 使用者提交訂單和訂單會放置在佇列中。User submits order and order is placed in the queue.
  8. Azure Functions 處理訂單付款。Azure Functions processes order payment.
  9. Azure Functions 會在 SQL database 中付款給協力廠商和記錄付款。Azure Functions makes payment to third party and records payment in SQL database.

元件Components

  • Web Apps： App Service Web 應用程式會在單一區域中執行，可供 Web 和行動瀏覽器存取Web Apps: An App Service Web App runs in a single region, accessible to web and mobile browsers
  • Azure SQL Database：雲端中的受控、智慧型 SQLAzure SQL Database: Managed, intelligent SQL in the cloud
  • Azure Functions：使用無伺服器程式碼處理事件Azure Functions: Process events with serverless code
  • Application Insights：偵測、分級和診斷 web 應用程式和服務中的問題Application Insights: Detect, triage, and diagnose issues in your web apps and services

後續步驟Next steps