客人可以看到Gallery UI
以及其他客人的照片。他還在應用程式角落看到了二維碼。
客人掃描二維碼,將他重定向到Photo Collector UI
,他可以在那裡上傳照片和願望。
Photo Collector UI
將資料傳送到Photo Collector Service
。
Photo Collector Service
將訪客照片上傳到 blob 儲存。
Photo Collector Service
將客人資料加入資料庫。
Photo Collector Service
將事件發佈到佇列。
Gallery Service
接收事件並處理它。
Gallery Service
向Gallery UI
推送有關圖庫中新照片的通知,然後Gallery UI
將新的訪客照片加入圖庫集合。
描述:
後端服務:
使用者介面應用程式:
Azure 服務:
您可以使用 Docker 在電腦上本機執行該專案。請按照以下步驟在本機上運行應用程式:
在我們開始之前,您應該在您的電腦上產生LensUp的dev-certs
。要使用 Docker 透過 HTTPS 託管 ASP.NET Core 映像,需要執行此操作。因此,使用以下命令產生證書:
dotnet dev-certs https -ep " %USERPROFILE%.aspnethttpslens-up.pfx " -p localCertPassword
dotnet dev-certs https --trust
將%USERPROFILE%
替換為您的電腦名稱。範例"C:UsersDell Precision 7520.aspnethttpslens-up.pfx"
出於本地開發目的,我們將使用密碼localCertPassword
。不要更改此設置,因為docker-compose.yml
檔案中使用了相同的密碼。
上述指令應產生lens-up.pfx
證書,並將其放置在如下螢幕截圖所示的目錄中。
這是必要的步驟,因為 docker-compose 引用了該憑證!
在您的電腦上安裝docker desktop
(如果您已經安裝,請跳過) 。
運行您的docker desktop
應用程式。
在docker-compose.yml
檔案所在的主專案目錄 ( lens-up
) 中,執行指令docker-compose build
。這將建立 7 個必要的 LensUp 映像。第一次建造可能需要幾分鐘(最多 10 分鐘)。完成這些步驟後,您應該在 Docker 桌面應用程式中看到新映像。
在建置命令之後,執行docker-compose up
來啟動整個基礎架構。您應該在 Docker Desktop 中看到 7 個與 LensUp 相關的容器已啟動。
現在整個應用程式正在您的電腦上運行。您可以使用以下地址:
後端服務:
LensUp.BackOfficeService.API
swagger - https://localhost:8085/swagger/index.htmlLensUp.GalleryService.API
swagger - https://localhost:8083/swagger/index.htmlLensUp.GalleryService.WebhookTriggerSimulator
- http://localhost:8086/LensUp.PhotoCollectorService.API
swagger - https://localhost:8081/swagger/index.html使用者介面應用程式:
LensUp.GalleryService.UI
- http://localhost:5001/
LensUp.PhotoCollectorService.UI
- http://localhost:5002/
在 LensUp.PhotoCollectorService.UI 上,您將看到錯誤頁面,因為您需要導覽至與尚未建立的特定圖庫關聯的視圖。
如何創建您的第一個畫廊並享受 LensUp 的樂趣?
前往LensUp.BackOfficeService.API
- https://localhost:8085/swagger/index.html
使用Create
端點來建立您的圖庫。端點在建立後傳回圖庫標識符(1) 。
在使用圖庫之前,我們需要啟動它。在這種情況下,請使用Activate
端點並在請求正文中傳遞galleryId
和endDate
。請記住, endDate
經過驗證,並且必須大於當前時間。否則,您的圖庫將被視為已過期。啟動後端點返回圖庫enterCode
(1) 。
透過您的畫廊enterCode
您可以使用LensUp.GalleryService.UI
開啟您的畫廊 - http://localhost:5001/
使用enterCode
登入您的畫廊。
現在您可以掃描圖庫二維碼並將照片上傳到其中。該程式碼重定向到用於將照片新增至圖庫的表單。您可以使用瀏覽器工具掃描二維碼,或者如果它不起作用,您可以訪問http://localhost:5002/upload-photo/{enterCode}
。
QR 碼會將您重新導向到新增照片和願望表。現在您可以將資料上傳到圖庫。
成功填寫表格後,我們應該會看到成功通知,並且照片應該會出現在圖庫中。