Hiện đại hóa ứng dụng WPF Desktop sang ASP.NET Core MVC với Amazon Q Developer

Tác giả: Sylvester Creado
Ngày phát hành: 13 FEB 2026
Chuyên mục: .NET, Amazon Q Developer

Giới thiệu

Một khách hàng về hình ảnh y tế gần đây đã liên hệ với nhóm của chúng tôi với nhu cầu hiện đại hóa các ứng dụng desktop Windows Presentation Foundation (WPF) Framework cũ của họ thành các ứng dụng web ASP.NET Core MVC. Họ muốn sử dụng phương pháp tiếp cận dựa trên tác nhân (agentic approach) để tăng tốc quá trình hiện đại hóa, nhằm đạt được tốc độ nhanh hơn tới 4 lần mà các khách hàng khác đã đạt được với Amazon Q Developer. Họ đã có sự chấp thuận của tổ chức để chỉ sử dụng Amazon Q Developer Pro nhưng không có ủy quyền của tổ chức để sử dụng Kiro (môi trường phát triển tích hợp dựa trên tác nhân AI của AWS) hoặc bất kỳ công cụ nào khác cho quá trình hiện đại hóa của họ.

Việc chuyển đổi các ứng dụng desktop WPF Framework sang ASP.NET MVC Core là phức tạp, nhưng Amazon Q Developer tự động hóa quy trình bằng cách xác định các phụ thuộc và thay đổi cần thiết dành riêng cho Windows, đề xuất các bản cập nhật và sửa đổi mã để cho phép triển khai trên Linux trên AWS, đồng thời giảm chi phí và tiếp cận các lợi ích của .NET hiện đại.

Hướng dẫn chi tiết

Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách Amazon Q Developer đơn giản hóa việc hiện đại hóa các ứng dụng cũ. Tôi sẽ sử dụng một bộ mẫu WPF được xây dựng trên .NET Framework 4.7.2 để minh họa cách tác nhân AI chuyển đổi một ứng dụng desktop truyền thống thành một ứng dụng web ASP.NET Core MVC đa nền tảng.

Các điểm chính:

  • Kịch bản thực tế: Chúng tôi sử dụng các mẫu desktop WPF hiện có để làm nổi bật khả năng của Amazon Q Developer trong việc xử lý mã cũ phức tạp.
  • Mục tiêu: Chuyển đổi một ứng dụng desktop chỉ dành cho Windows thành một ứng dụng web hiện đại, đa nền tảng.
  • Ngoài phạm vi: Bài viết này không đề cập đến việc chuyển đổi cơ sở dữ liệu hoặc Lớp truy cập dữ liệu (Data Access Layer).

Điều kiện tiên quyết

Trước khi bạn bắt đầu hiện đại hóa các ứng dụng WPF với Amazon Q Developer, hãy đảm bảo môi trường phát triển của bạn được cấu hình đúng cách. Đối với hướng dẫn này, bạn sẽ cần:

  1. Nền tảng phát triển: Vì chúng ta đang làm việc với các ứng dụng WPF ban đầu được xây dựng cho Windows, bạn sẽ cần một môi trường Windows để mở và làm việc với codebase hiện có.
  2. IDE và Tiện ích mở rộng: Visual Studio 2026 – Phiên bản mới nhất cung cấp khả năng tương thích tốt nhất với cả .NET Framework cũ và các dự án .NET 10 hiện đại.
  3. AWS Toolkit với Amazon Q: Cài đặt phiên bản mới nhất từ Visual Studio Marketplace để kích hoạt các khả năng hiện đại hóa được hỗ trợ bởi AI trực tiếp trong IDE của bạn.
  4. Cấu hình AWS: Cấu hình xác thực IAM Identity Center để cho phép truy cập an toàn vào các dịch vụ Amazon Q Developer.
  5. Đăng ký Amazon Q Developer Pro: Đảm bảo người dùng được kích hoạt và đăng ký Amazon Q Developer Pro để truy cập các tính năng hiện đại hóa nâng cao mà chúng ta sẽ sử dụng trong suốt hướng dẫn này.
  6. .NET 10: Cài đặt runtime .NET mới nhất để hỗ trợ framework ASP.NET Core MVC mục tiêu.

Với các điều kiện tiên quyết này, bạn sẽ sẵn sàng theo dõi khi Amazon Q Developer biến ứng dụng desktop WPF của bạn thành một ứng dụng web hiện đại, đa nền tảng.

Thiết lập

Trong các bước này, bạn sẽ thiết lập môi trường của mình để sử dụng Amazon Q Developer trong Visual Studio IDE.

Bước 1: Thiết lập

Trong bước này, bạn sẽ tải xuống các ứng dụng mẫu và làm quen với chúng:

  1. Tải xuống WPF-Samples từ GitHub, chứa bộ ứng dụng mẫu WPF. Đảm bảo rằng bạn đang sử dụng nhánh netframework.
  2. Mở solution WPF Application Samples từ thư mục WPF-Samples-netframework\Sample Applications trong Visual Studio.
  3. Cuộn đến thư mục Sample Applications, nhấp chuột phải vào ứng dụng VideoViewerDemo và đặt làm dự án khởi động. Xác minh rằng đó là dự án .NET Framework 4.7.2 và nó được xây dựng thành công, như trong Hình 1.


Hình 1: Dự án WPF VideoViewerDemo trong .NET Framework 4.7.2

  1. Chạy ứng dụng bằng F5 hoặc Debug > Start Debugging để xem giao diện và hành vi của nó, sau đó dừng gỡ lỗi. Nó sẽ trông giống như Hình 2.

Bước 2: Thiết lập và Đăng nhập Amazon Q Developer từ Visual Studio

Tiếp theo, chúng ta sẽ đăng nhập vào Amazon Q Developer trong Visual Studio.

  1. Trong Visual Studio IDE, chọn Extensions->Getting Started.


Hình 3: Cài đặt tiện ích mở rộng Amazon Q Developer trên Visual Studio

  1. Trên bảng điều khiển Amazon Q Developer, đăng nhập vào Amazon Q Developer bằng thông tin đăng nhập IAM Identity Center của bạn. Sau khi hoàn tất đăng nhập, “Connected with IAM Identity Center” sẽ xuất hiện trên bảng điều khiển, như trong Hình 3 ở trên.
  2. Trong Visual Studio IDE, chọn View > Amazon Q Developer Chat, xem lại thỏa thuận và nếu bạn đồng ý, chọn Acknowledge trong cửa sổ trò chuyện Q. Bây giờ bạn đã sẵn sàng bắt đầu sử dụng Amazon Q Developer trong Visual Studio IDE.


Hình 4: Amazon Q Developer đã đăng nhập

Hiện đại hóa ứng dụng VideoViewerDemo

Bây giờ môi trường của bạn đã được cấu hình, bạn có thể thấy Amazon Q Developer hoạt động. Bạn sẽ nhắc Amazon Q Developer hiện đại hóa một ứng dụng WPF phức tạp thành một ứng dụng web ASP.NET Core MVC hiện đại.

Bước 3: Khởi tạo quá trình hiện đại hóa

Mở Amazon Q Developer trong Visual Studio và dán lời nhắc sau:

Convert the VideoViewerDemo application to ASP.NET Core MVC Web Application using .NET 10 and add to the current solution. Create an upload button to upload the video files to the wwwroot/media folder.

Lời nhắc duy nhất này hướng dẫn Amazon Q Developer xử lý nhiều tác vụ phức tạp: chuyển đổi UI WPF sang Razor views, di chuyển logic code-behind sang các bộ điều khiển MVC, cập nhật cấu trúc dự án cho .NET 10 và thêm chức năng mới dành riêng cho web. Quá trình chuyển đổi này sẽ không mất quá 10-15 phút.

Bước 4: Xem xét và Phê duyệt các hành động của Amazon Q Developer

Khi Amazon Q Developer thực hiện quá trình hiện đại hóa, nó sẽ yêu cầu sự chấp thuận của bạn ở các giai đoạn chính:

  • Tạo cấu trúc thư mục ứng dụng
  • Tạo dự án ASP.NET Core MVC mới
  • Tạo hệ thống phân cấp thư mục Views
  • Xây dựng ứng dụng để xác minh việc biên dịch

Chọn Run cho mỗi lời nhắc để cho phép Amazon Q Developer tiếp tục. Cách tiếp cận tương tác này đảm bảo bạn duy trì quyền kiểm soát trong khi AI xử lý phần lớn công việc.

Bước 5: Xem lại Tóm tắt chuyển đổi

Sau khi hoàn tất, Amazon Q Developer cung cấp một bản tóm tắt chi tiết về quá trình chuyển đổi, bao gồm:

  • Các tệp đã tạo và sửa đổi
  • Các phụ thuộc đã cập nhật
  • Các thành phần UI đã chuyển đổi
  • Các tính năng mới được thêm vào (chẳng hạn như chức năng tải lên video)

Bước 6: Tải lại Solution

Amazon Q Developer tự động thêm dự án ASP.NET Core MVC mới vào solution hiện có của bạn và nhắc bạn tải lại. Chọn Reload để làm mới Visual Studio với ứng dụng web đã được hiện đại hóa hiện đã được tích hợp cùng với dự án WPF gốc của bạn.

WPF Video Viewer Demo đã được chuyển đổi thành công thành ứng dụng ASP.NET Core MVC chạy trên .NET 10.

Tóm tắt chuyển đổi

Các thành phần cốt lõi được tạo:

  • VideoModel.cs → Chứa các mô hình siêu dữ liệu video và logic dịch vụ để xử lý tệp
  • VideoController.cs → Xử lý các yêu cầu HTTP, truyền phát video và tải lên tệp
  • Index.cshtml → Giao diện web với trình phát video HTML5 và các điều khiển tùy chỉnh

Các tính năng đã chuyển đổi thành công:

✅ Thư viện video với bản xem trước hình thu nhỏ
✅ Trình phát video HTML5 với các điều khiển tùy chỉnh
✅ Lựa chọn video từ thanh bên
✅ Chức năng tải lên tệp
✅ Hỗ trợ nhiều định dạng video
✅ Thiết kế web đáp ứng bằng Bootstrap
✅ Các điều khiển video tùy chỉnh (phát/tạm dừng, tiến độ, âm lượng, toàn màn hình)

Các thay đổi chuyển đổi kiến trúc:

  • Desktop → Web: Chuyển đổi từ ứng dụng desktop WPF sang ứng dụng web
  • MediaElement → HTML5 Video: Sử dụng phần tử video tiêu chuẩn web với các điều khiển tùy chỉnh
  • File System → Web Streaming: Máy chủ truyền phát các tệp video với hỗ trợ yêu cầu phạm vi
  • Data Binding → JavaScript: Tương tác phía máy khách thông qua JavaScript thay vì liên kết dữ liệu WPF

Các tính năng chính:

  • Thư viện video: Thanh bên trái hiển thị tất cả các video có sẵn với hình thu nhỏ
  • Trình phát HTML5: Trình phát video web hiện đại với lớp phủ điều khiển tùy chỉnh
  • Tải lên tệp: Chức năng tải lên video dựa trên web
  • Truyền phát: Truyền phát video hiệu quả với hỗ trợ yêu cầu phạm vi
  • Thiết kế đáp ứng: Hoạt động trên trình duyệt desktop và di động
  • Hỗ trợ định dạng: Các định dạng MP4, WebM, OGG, WMV, AVI, MOV

Lưu ý: Bạn sẽ cần tải lên video trước khi có thể xem video trong thanh bên. Đảm bảo các tệp media nằm trong thư mục wwwroot/media. Nếu có bất kỳ tệp .wmv nào, vui lòng xóa vì .wmv không còn được hỗ trợ để truyền phát video.

Chạy ứng dụng

Bây giờ hãy khởi chạy ứng dụng đã được hiện đại hóa để xác minh quá trình chuyển đổi.

## To Run:
cd "<your-path>\WPF-Samples-netframework\Sample Applications\VideoViewerMvcDemo\VideoViewerMvcDemo"
dotnet run

Ứng dụng được xây dựng thành công và cung cấp trải nghiệm xem video dựa trên web hiện đại với khả năng tải lên, duy trì chức năng cốt lõi của trình xem video WPF gốc trong khi bổ sung các cải tiến dành riêng cho web.

Sau khi quá trình chuyển đổi hoàn tất, bạn có thể xem ứng dụng của mình hoạt động bằng cách kiểm tra nó. Chỉ cần dán lời nhắc Run the VideoViewerMvcDemo application vào Amazon Q Developer để bắt đầu quá trình. Khi Amazon Q Developer Shell nhắc bạn, chọn Run để khởi chạy ứng dụng ASP.NET MVC của bạn.


Hình 5: Ứng dụng VideoViewerDemo MVC

Xem xét các chuyển đổi

Những chuyển đổi này đại diện cho các chuyển đổi cơ bản để hiện đại hóa các ứng dụng WPF của bạn bằng Amazon Q Developer. Để sử dụng các ứng dụng này trên web, hãy triển khai những điều sau:

  • UI – Giao diện và CSS
  • Bảo mật – Xác thực và Ủy quyền, Xác thực đầu vào, HTTPS
  • Quản lý dữ liệu – Tích hợp cơ sở dữ liệu, Lưu trữ tệp
  • Hiệu suất và Khả năng mở rộng – Bộ nhớ đệm, Cân bằng tải, CDN
  • Xử lý lỗi & Giám sát – Ghi nhật ký, Giám sát và Xử lý lỗi
  • Cấu hình & Triển khai – Quản lý cấu hình, Container hóa, CI/CD Pipelines

Amazon Q Developer có thể giúp thêm các chức năng này, tuy nhiên, bài đăng này tập trung vào việc chuyển đổi ứng dụng WPF sang ứng dụng Web trong khi vẫn giữ nguyên chức năng của ứng dụng WPF.

Kết luận

Amazon Q Developer tăng tốc quá trình hiện đại hóa các ứng dụng desktop WPF Windows của bạn sang ASP.NET Core MVC. Trong bài đăng này, chúng tôi đã trình bày cách sử dụng Amazon Q Developer để chuyển đổi một cách thông minh các ứng dụng WPF trên .NET Framework sang ASP.NET Core MVC, xử lý việc dịch phức tạp từ XAML sang Razor views, logic code-behind sang các bộ điều khiển MVC và cập nhật các phụ thuộc, tất cả trong khi vẫn giữ nguyên chức năng cốt lõi của ứng dụng của bạn. Amazon Q Developer đại diện cho một sự thay đổi cơ bản trong cách các tổ chức tiếp cận hiện đại hóa mã và nợ kỹ thuật.

Bằng cách tự động hóa các tác vụ chuyển đổi lặp đi lặp lại và áp dụng các phương pháp hay nhất một cách nhất quán, nó tăng tốc các sáng kiến hiện đại hóa đồng thời giúp các nhà phát triển dành nhiều thời gian hơn cho đổi mới và thúc đẩy giá trị kinh doanh thay vì tập trung vào việc tái cấu trúc và bảo trì thủ công. Sự chuyển đổi này cho phép nhóm của bạn giải quyết các danh mục ứng dụng cũ ở quy mô lớn, giảm rủi ro kỹ thuật và cung cấp các ứng dụng hiện đại, sẵn sàng cho đám mây nhanh hơn, và cuối cùng định vị tổ chức của bạn để phản ứng nhanh hơn với các nhu cầu kinh doanh và áp lực cạnh tranh đang thay đổi.

Tài nguyên bổ sung

  • Bước tiếp theo bạn có thể thêm chức năng để container hóa ứng dụng này và triển khai nó vào các container Amazon ECS hoặc Amazon EKS bằng cách sử dụng AWS Fargate.
  • Để tìm hiểu thêm về các tính năng và chi tiết giá của Amazon Q Developer, hãy truy cập trang sản phẩm Amazon Q Developer.

Về tác giả


Sylvester Creado
Sylvester Creado là Kiến trúc sư Giải pháp Chuyên gia của AWS, tập trung vào .NET, SQL Server và Container. Sylvester làm việc tại Los Angeles, chủ yếu hỗ trợ các khách hàng trong lĩnh vực Truyền thông, Giải trí, Trò chơi và Thể thao. Trước khi gia nhập AWS, Sylvester là kiến trúc sư chuyên về Microsoft stack trong hơn 20 năm.

Leave a comment