现在移动互联网的盛行,跨平台并兼容不同设备的HTML5越来越盛行,很多公司都在将自己过去的非HTML5网站应用渐进式的转化为HTML5应用,使得一套代码可以兼容不同的物理终端设备和浏览器,极大的提高了系统的可维护性和可扩展性。于此同时,HTML5提供了很多的新特性,比如新的架构元素、代替cookie的Web存储技术、WebSocket等,也使得网站应用能够更好适应新的商业环境和技术更新。
本系统的网站模块使用.NET技术堆栈中的ASP.NETMVC框架,此框架是微软公司推出的开源框架,相关源代码可以在Codeplex. 第二步,创建自定义缓存。由于HTML5FileView中都是静态的内容,很自然的需要构建相应的缓存用于提高性能。创建页面的缓存Key对象HTML5ViewCacheKey,实现GetHashCode方法,通过对Controller和View的名称进行简单的Hash组合运算等到缓存内容的Key,并实现Equals方法用于比较,简化的代码如下所示。
publicclassHTML5ViewCacheKey
{
publicstringControllerName{get;privateset;}
publicstringViewName{get;privateset;}
publicHTML5ViewCacheKey(stringcontrollerName,stringviewName)
{
this.ControllerName=controllerName??string.Empty;
this.ViewName=viewName??string.Empty;
}
publicoverrideintGetHashCode()
{
turnthis.ControllerName.ToLower().GetHashCode()^this.ViewName.ToLower().GetHashCode();
}
publicoverrideboolEquals(objectobj)
{
HTML5ViewCacheKeykey=objasHTML5ViewCacheKey;
if(null==key)
turnfalse;
turnkey.GetHashCode()==this.GetHashCode();
}
}
第三步,创建视图引擎HTML5ViewEngine。该类实现了IViewEngine接口,字典类viewEngineResults结合第二步中构建的缓存类用于缓存渲染后的视图。方法FindView首先解析路由信息获得控制器的名称,之后判断请求是否支持缓存,若不支持缓存,则直接通过InternalFindView方法获得视图。反之,判断请求视图是否在本地缓存中,若存在直接返回,若不存在则调用方法获取并缓存,写缓存时注意加锁。InternalFindView方法中,借助面向约定编程的思路到指定的路径中寻找到对应的文件HTML5,最终完成URL信息与文件的映射。
publicclassHTML5ViewEngine:IViewEngine
{
privateDictionaryHTML5ViewCacheKey,ViewEngineResultviewEngineResults=
newDictionaryHTML5ViewCacheKey,ViewEngineResult();
privatestaticobjectsyncHelper=newobject();
publicViewEngineResultFindPartialView(ControllerContextcontrollerContext,stringpartialViewName,booluseCache)
{
turnthis.FindView(controllerContext,partialViewName,null,useCache);
}
publicViewEngineResultFindView(ControllerContextcontrollerContext,stringviewName,stringmasterName,booluseCache)
{
stringcontrollerName=controllerContext.RouteData.GetRequidString(controller);
varkey=newHTML5ViewCacheKey(controllerName,viewName);
ViewEngineResultsult=null;
if(!useCache)//是否支持缓存
{
sult=InternalFindView(controllerContext,viewName,controllerName);
viewEngineResults[key]=sult;
turnsult;
}
if(viewEngineResults.TryGetValue(key,outsult))//视图是否已经在缓存中
{
turnsult;
}
lock(syncHelper)//锁定视图数据写入缓存过程
{
if(viewEngineResults.TryGetValue(key,outsult))
{
turnsult;
}
sult=InternalFindView(controllerContext,viewName,controllerName);
viewEngineResults[key]=sult;
turnsult;
}
}
privateViewEngineResultInternalFindView(ControllerContextcontrollerContext,stringviewName,stringcontrollerName)
{
string[]searchLocations=newstring[]{
string.Format(~/staticViews/{0}/{1}.html,controllerName.ToLower(),viewName.ToLower()),
string.Format(~/staticViews/Shad/{0}.html,viewName.ToLower())
};
stringfilename=controllerContext.HttpContext.Request.MapPath(searchLocations[0]);
if(File.Exists(filename))
{
turnnewViewEngineResult(newHTML5View(filename),this);
}
filename=string.Format(
\staticViews\shad\{0}.html,viewName.ToLower());if(File.Exists(filename))
{
turnnewViewEngineResult(newHTML5View(filename),this);
}
turnnewViewEngineResult(searchLocations);
}
publicvoidReleaseView(ControllerContextcontrollerContext,IViewview)
{
}
}
最后一步,将视图自定义的视图引擎添加到Global.asax文件的Application_Start方法中,完成该引擎的注册。同时注意需要将该引擎的优先级设为最高,使得系统优先使用该引擎对视图相关请求进行响应。
通过以上步骤,基本上将ASP.NETMVC框架,HTML5技术,移动互联网开发技术有机的整合到了一起。
Tip:本文由于是学习需要,主要参考了以下书目。
[1]蒋金楠.ASP.NETMVC4框架揭秘[M].上海:电子工业出版社,.-
[2]唐俊开.HTML5移动Web开发指南[M].上海:电子工业出版社,.52-54
原文