Mình muốn làm 2 bản giao diện cho web và mobile (Không responsive), mobile chạy giao diện mobile riêng, desktop chạy giao diện desktop riêng bằng netcore 5.0. Mình nên check trong controller user dùng pc hay mobile để trả về view tương ứng, hay phải 1 source nữa rồi thiết kế giao diện riêng cho mobile rồi chạy subdomain m.domain.com ạ ?
Hỏi cách thiết kế giao diện riêng cho mobile và desktop trong netcore 5.0
Cậu nên hoặc dùng responsive (nếu cậu muốn dùng chung source code), hoặc sử dụng 2 hệ thống front-end khác nhau để giải quyết.
Check trong controller sẽ không được khuyến khích, vì controller có nhiệm vụ điều hướng việc gọi các business logic hơn là phần luồng view. Mặt khác, việc viết if cho từng phần giao diện cũng khá là khổ 
Hope it helps!
5 Likes
Cảm ơn bạn La biblioteca. Mình không muốn responsive vì muốn giao diện desktop và mobile tách biệt ạ. Nếu sử dụng 2 hệ thống front-end thì cấu trúc url có thay đổi không ạ?
Ví dụ url trang chi tiết sản phẩm là domain.com/product/san-pham-a
Làm thế nào để cùng 1 url nhưng return về 2 view (1 cho desktop, 1 cho mobile) ạ?
Nếu chạy thêm subdomain m.mobile.com thì phải copy 1 source nữa ra rồi dựng giao diện cho mobile đúng ko ạ?
cái này còn tùy vào việc bạn thích cách nào nữa?
bạn cứ thử làm cả 2 cách, thấy thích cách nào thì làm cách đó thôi?
1 Like
Nếu chạy subdomain m .domain.com thì lại phải copy 2 source nhỉ, còn check trong controller thì chắc cũng ko phức tạp lắm vì chỉ check user dùng mobile hay desktop để trả về view tương ứng thôi ạ. Ý e hỏi là nên làm thế nào cho logic và tối ưu ấy ạ.
bạn đã nói rõ là bạn muốn có 2 ui độc lập, thì hiển nhiên là bạn phải tạo 2 resource (ui/view)
dùng subdomain hay tự detect device đều như vậy
đúng, chỉ cần if/else và chọn template để render thôi
logic này quá đơn giản, chưa cái gì cần phải tối ưu cả, chỉ if/else mà thôi
Trông như là 2 cách đều giống nhau => đúng là vậy, có chăng cấu hình subdomain và redirect qua subdomain nó hơi phức tạp hơn
Vậy chọn cách nào? Responsive
Nếu bạn vẫn cố tình chọn cách phức tạp bằng cách build 2 ui riêng thì kiểu gì nó cũng phức tạp
chưa kể là thiết bị lướt view thì vô vàn từ điện thoại, tablet, laptop
trong cái đống đó thì độ phân giải, dpi cũng khác nhau, có người thích fullscreen, có người thích cửa sổ…
với 2 ui bạn có thể cover tốt hết được không?
và bây giờ nếu bạn nói là bạn không muốn, không thích làm responsive vì muốn chuyên biệt các loại ui thì bạn nghĩ người phải vấn bạn thích điều đó hay không?
tóm lại là nói nhiều cũng không có ý nghĩ gì, bạn cứ thử trải nghiệm rồi tự rút ra bài học cho riêng mình, biết đâu bạn nhận ra gì đó hay ho về việc dev 2 ui song song rồi trở về đây chia sẻ lại cho mọi người
6 Likes
Cảm ơn bác đã tư vấn cho e ạ. E định làm web về shop thời trang, khách muốn làm giống giao diện shoppe mà shoppe lại cũng thiết kế 2 giao diện riêng UI/View cho desktop và mobile nên e thiết kế lại giao diện và dùng lại luôn của shopee nên ko làm responsive ạ.
chạy subdomain thì phải chạy 2 source, nên e nghĩ sẽ check controller user dùng mobile hay desktop để trả về view tương ứng (E thấy shopee hay 1 số trang thương mại điện tử họ cũng thiết kế riêng giao diện desktop và mobile tách biệt).
Bác cho e hỏi chút, e mới chuyển từ golang sang netcore nên chưa rành phần layout bên netcore lắm, sao trong video này hướng dẫn thiết kế giao diện riêng cho mobile và desktop của asp.net, Trong Share có _Layout.cshtml và _Layout.Mobile.cshtml, trong view Home có index.cshtml và index.mobile.cshtml e không thấy controller họ kiểm tra user là mobile hay desktop mà khi user view bằng desktop hay mobile nó vẫn trả về html tương ứng nhỉ.
asp .net mvc4 thì dùng được phương pháp trên, giờ netcore e không thấy hỗ trợ nữa ạ
không có cách nào trả lời được browser đang truy cập là mobile hay desktop
chỉ có thể tương đối, dựa vào UA (user agent) thôi
cứ search thôi .net core detect mobile device
6 Likes
E cảm ơn bác. E dùng thư viện https://github.com/wangkanai/Detection check thiết bị mobile hay desktop để trả về view tương ứng.
E code như vầy đúng chuẩn và tối ưu chưa bác, return view trong controller nên không phải copy 1 source thiết kế cho bản mobile:
using Microsoft.AspNetCore.Mvc;
using Wangkanai.Detection.Models;
using Wangkanai.Detection.Services;
namespace NetCore.Controllers
{
public partial class HomeController :
{
private readonly IDetectionService _detectionService;
public HomeController(IDetectionService detectionService)
{
_detectionService = detectionService;
}
public virtual IActionResult Index()
{
if (_detectionService.Device.Type == Device.Mobile)
{
return View("Mobile", null);
}
return View();
}
}
}
Mình check device rồi render view tương ứng.
4 Likes
Có cách nào tạo thêm 1 Folder theme tách biệt như nopcommerce không ạ, e thấy nopcommerce họ có thể tạo các theme độc lập, và có thể chọn theme nào là theme mặc định, mình có thể tạo folder theme riêng giống nopcommerce rồi check device rồi trả về theme tương ứng được không ạ?
Mình đã xử lý được vấn đề, tạo theme desktop và mobile ra 2 folder hoàn toàn độc lập, không check trong controller. Tạo theme cho desktop riêng 1 folder, Tạo theme cho mobile riêng 1 folder.
Sau đó chỉ check user dùng thiết bị gì thì mình return theme đó cho user, cách này hay hơn nhiều so với check trong controller rồi return view tương ứng cho user. Sau này muốn phát triển nhiều theme cũng ok không vấn đề gì 
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?