Javascript files_javascript 기술에서 .Net MVC Razor 구문을 사용하는 방법을 가르쳐줍니다.

모든 사람이 뷰에 javascript를 중첩해 본 적이 있을 것입니다. 현재 Razor 구문을 사용하여 일부 .NET 메서드를 직접 호출할 수 있습니다. 예를 들어 다음 코드는 Razor View에 중첩되어 있습니다.

<script>
 var currDate = '@DateTime.Now'; //直接调用.NET的方法
 
 console.log(currDate)
</script>

그러나 또 다른 상황은 독립적인 JS 파일에서 Razor를 사용하려는 경우 MVC가 JS 파일을 직접 해석하지 않고 Razor 보기에만 배치할 수 있기 때문에 위의 방법이 적합하지 않다는 것입니다. 하지만 여기서는 독립 실행형 JS 파일에서 Razor를 직접 사용할 수 있는 타사 라이브러리를 추천합니다

이러한 종류의 라이브러리 이름은 RazorJS입니다. 다음 주소에서 소스 코드를 다운로드할 수 있습니다.

https://bitbucket.org/djsolid/razorjs

또는 Nuget을 통해 직접 설치할 수도 있습니다.

PM> Install-Package RazorJS

그럼 먼저 이 클래스 라이브러리가 우리에게 무엇을 가져다 줄 수 있는지부터 이야기해 보겠습니다. 설치 후 JS 파일에서 직접 .NET 지원 방법을 모두 사용할 수 있습니다. 예를 들어 위 코드를 별도의 JS 파일에 직접 넣어 사용할 수 있습니다. 또한 JS 파일에서 .NET의 전체 네임스페이스를 참조할 수도 있습니다. File 개체를 호출하여 텍스트 파일의 내용을 읽으려면 System.IO 네임스페이스를 직접 참조할 수 있습니다.

@using System.IO;
 
var s = 'Hello at @DateTime.Now \n @File.ReadAllText(System.Web.Hosting.HostingEnvironment.MapPath("~/web.config"))';

실행 후 web.config 파일의 모든 내용을 JS에서 직접 가져올 수 있습니다. 꽤 괜찮아 보이네요, 하하. 그렇다면 그러한 라이브러리는 어떻게 작동합니까? 실제로 위의 효과를 얻기 위해 RazorEngine이라는 클래스 라이브러리를 사용합니다. RazorEngine은 매우 강력한 Razor 해석 엔진이며 이전에 일부 프로젝트에서 사용해 본 적이 있습니다. 이 엔진을 통해 Win 형식에서 Razor 구문을 직접 사용할 수도 있습니다. 하하, 그 이점에 대해 생각해 본 적이 있나요?

이 엔진을 사용하면 웹 환경과 완전히 독립적으로 MVC의 Razor를 사용할 수 있습니다. 이 기능을 사용하면 일부 이메일 템플릿과 같은 유연한 템플릿을 템플릿에서 직접 만들 수 있습니다. 다양한 .NET 메서드나 사용자 정의 개체를 사용하고 원하는 것을 동적으로 생성하세요. 좋습니다. 하지만 제가 이번에 소개하고 싶은 엔진은 이 엔진이 아닙니다. 여기서는 그냥 이야기하겠습니다.

다음으로 RazorJS를 사용하는 방법에 대해 이야기하겠습니다. Nuget을 통해 직접 설치하면 자동으로 web.config가 구성됩니다. 이것이 권장되는 설치 방법입니다. 그렇지 않으면 web.config에 직접 추가해야 합니다. 구성에는 여기에 자세히 설명되지 않은 여러 위치가 있으며 설치 후 비교할 수 있습니다. RazorJS를 사용하는 방법도 매우 간단합니다. 다음 구문을 사용하여 원하는 JS 파일을 참조하면 됩니다.

<p>
 @Html.RazorJSInline("~/Scripts/Example.js")
</p>

하지만 한 가지 주의할 점은 web.config에 RazorJS를 사용할 수 있도록 구성된 디렉토리가 있다는 것입니다. 즉, JS 파일을 이 방법을 사용하여 참조하기 전에 이 디렉토리에 배치해야 합니다.

<razorJSSettings handlerPath="~/razorjs.axd">
 <allowedPaths>
 <add path="~/Scripts" />
 </allowedPaths>
 </razorJSSettings>

마지막으로 말씀드리고 싶은 점은 한계입니다. 물론 좋은 점도 있지만 나쁜 점도 있습니다. RazorEngine을 사용하기 때문에 JS에서는 MVC의 HTML Helper 메서드, 즉 @Html로 시작하는 모든 메서드를 사용할 수 없습니다. 또 다른 문제는 JS에서 주석 코드를 인식할 수 없다는 것입니다. 즉, 주석에 .NET 메서드를 사용하면 여전히 실행됩니다. 그렇지 않으면 실행에 문제가 없습니다. JS가 중단되고 오류가 직접 보고되므로 쓸모없는 메소드를 주석 처리하는 것만으로는 충분하다고 생각하지 마십시오.

@Html 도우미를 실행할 수 없는 문제에 대해 여기에 또 다른 해결책을 제공하지만 소스 코드를 수정하고 싶은 친구는 시도해 볼 수 있습니다. 실제로 이를 수행하기 위해 다양한 맞춤형 방법을 사용할 수도 있으며 이는 더욱 유연하고 편리합니다. RazorJS 소스 코드를 다운로드한 후 직접 수정하고 DLL을 다시 컴파일할 수 있습니다. 또 다른 방법은 해당 소스 코드를 다른 프로젝트로 처리하여 자신의 프로젝트에 직접 추가하는 것입니다.

소스 코드에서 HtmlTemplateBase.cs 파일을 열고 여기에 자신만의 메서드를 추가한 다음 여기에 추가된 메서드를 JS에서 직접 호출할 수 있습니다. 예를 들어 소스 코드에서는 URL을 요청 클라이언트에서 사용할 수 있는 URL로 변환하는 캡슐화된 Href 메서드를 찾을 수 있습니다. 이 작성 방법에 따라 자체 메서드를 추가할 수 있습니다. 예를 들어 다음은 국제화를 위해 .NET 리소스 파일을 JS에서 직접 사용할 수 있도록 국제화된 리소스 파일을 동적으로 가져오는 메서드를 캡슐화하는 방법입니다.

public class HtmlTemplateBase : TemplateBase
 {
 //手工调用资源文件管理器
 private static ResourceManager resources = (ResourceManager)System.Type.GetType
  ("RazorJS.Resource").GetProperty("ResourceManager").GetValue(null, null);
 
 public HtmlTemplateBase()
 {
  Url = new UrlHelper(HttpContext.Current.Request.RequestContext);
 }
 public string Href(string originalUrl)
 {
  return Extensions.ResolveUrl(originalUrl);
 }
 
 public string GetLangText(string langKey)
 {
  根据key返回相关的语言
  return resources.GetString(langKey);
 }
 
 public UrlHelper Url { get; set; }
 }

그런 다음 JS에서 직접 호출하세요.

var s = '@GetLangText("CoderBlog")';
console.log(s);

실행 후 JS에서 CoderBlog 키의 내용을 직접 입력할 수 있습니다