2013-07-22 2 views
1

오픈 소스 ASP.NET MVC (nopcommerce) 또는 nopcommerce.com이 ASP.NET MVC 및 면도기보기에서 개발되었으며 데스크톱과 예를 들어 모바일 버전은 index.cshtml과 Index.Mobile.cshtml이 있지만 모바일보기에 대한 경험이 없습니다.Visual Studio 2012에서 ASP.NET MVC 모바일 페이지를 보는 방법

Chrome 및 IE와 같은 브라우저에서 모바일 페이지를 보는 방법에 대한 실마증을 털어 놓았습니다. .

+0

Safari를 사용하면'Develop> User Agent> iPhone' 등으로 사용자 정의 사용자 에이전트 문자열을 지정할 수 있습니다. – Jasen

답변

1
MVC에서

해당 링크에

를 예를 들어 display-modes

를 선언 할 것

당신은 당신이 내 /APP_Start/DisplayModeConfig.cs 예를 들어

처럼 거의 아무것도 테스트하여 당신이 좋아하는 모든 모드를 설정할 수 있음을 얻었다되면

public class DisplayModeConfig 
{ 
    public static void RegisterDisplayModes(DisplayModeProvider provider) 
    { 
     // INFO: Allows to name views/partials/masters like viewname.iphone.cshtml, and MVC will choose this automatically 

     // INFO: Lets remove the default "Mobile" mode, since it's pretty useless 
     var mobileDefault = DisplayModeProvider.Instance.Modes.First(m => m.DisplayModeId == "Mobile"); 
     if (mobileDefault != null) 
     { 
      DisplayModeProvider.Instance.Modes.Remove(mobileDefault); 
     } 

     // INFO: Now add one that actually works 
     provider.Modes.Insert(0, 
      new DefaultDisplayMode("Mobile") 
      { 
       ContextCondition = (context => (!string.IsNullOrEmpty(context.GetOverriddenUserAgent()) && Regex.IsMatch(context.GetOverriddenUserAgent(), @"mobile|android|kindle|silk|midp", RegexOptions.IgnoreCase | RegexOptions.CultureInvariant))) 
      }); 


     // INFO: Order from least to most important (since we insert at position 0) 
     provider.Modes.Insert(1, 
      new DefaultDisplayMode("Win8") 
      { 
       ContextCondition = (context => (!string.IsNullOrEmpty(context.GetOverriddenUserAgent()) && context.GetOverriddenUserAgent().IndexOf("Windows NT 6.2", StringComparison.OrdinalIgnoreCase) >= 0)) 
      }); 
    } 
} 

@ Request.Browser. * 같은 @ Request.Browser.IsMobileDevice, @ Request.Browser.Version, .. 잘 작동하지만, 그 도우미를 사용하기 전에 테스트 할 것입니다. .

+1

그건 그렇고, 할 수 있기 때문에 디스플레이 모드에 미치지 마라. 간단한 CSS/JS 기능을 사용하려면 기능 감지 기능을 고수하십시오. DisplayMode는 전체 페이지 또는 다소 큰 페이지 부분을 전환해야하는 경우에만 사용해야합니다. 예를 들어 Chrome 용 멋진 슬라이더가있는 부분 뷰와 JS, CSS 및 HTML이 완전히 다른 IE 용 호환 뷰가 있습니다. 응답 성있는 디자인과 @ media-queries 디자인을 조정하기 위해 – Robert

1

사이트에 의해 수행 방법 이동 감지 당신이해야 할 수도 있습니다에 따라 :

  • 팅겨 "사용자 에이전트"문자열은 브라우저에서 오는. 이를위한 많은 도구/플러그인이 있습니다.
  • 일부 쿠키를 설정하십시오.
  • 사이트에서 직접 지원되는 모바일보기 사용 (예 : http://www.xbox.com의 하단에 링크가 있음)을 확인하십시오. 그들은 WP라는 모드, 당신이 index.cshtml (일반 모드)했을 해당 모드에 액세스 할 수와 index.wp.cshtml (탐지 모드)를 선언 위에
관련 문제