我使用前台模板+AJAX的样例站

http://www.91mh.net/index.html

这是我们小组3个人前台:使用javascript 模板,后台输出JSON的第二个站,

第一个站的方案紧紧是实验品,所以不提了.

这个可以称之为尝试了.

采用前台模板后的结果就是后台超级的简单.由于javascript语法的强大方便,前台处理表现效率更高.

下面就是您看到的内容的全部后台数据输出代码,当然入口程序,数据库操作的封装类,JSON输出类等属于库级别的就不发了.

代码是php写的,可惜JE不支持php的高亮语法.

补充:关于搜索引擎支持的问题,见后面的帖子,91mh已经实施了我提出的方案.效果如何等等看吧!

$json=array();//输出JSON变量
switch ($Q['Q']){//$Q就是前台传递过来的所有参数合并
case 'loadbody':
	$gif='/style/imgs/logo.gif';//这个是logo的替换,是我们的业务逻辑要求的
	$json['URL']=$SITE['webroot'].'/index.html';//告诉前台取哪一个模板,$SITE是全局的站点目录对应变量
	$json['uinfo']=false;
	$json['logo']=$gif;
	$json['gonggao']='内部测试中.......FireFox下将获得最佳浏览效果.';
	//下面是取一些热点信息
	$sql="SELECT id,n_name,fenlei FROM flash ORDER BY mouse DESC limit 5";
	$DB->query($sql,$json['gx']);
	$sql="SELECT id,n_name,fenlei FROM news ORDER BY mouse DESC limit 5";
	$DB->query($sql,$json['gx']);
	//用户信息,从SESSION中取
	$json['uinfo']=$SESSION['uinfo'];
	$json['rd']=$json['gx'];
	$json['tb']=$json['gx'];
	$json['gg'][0]=array('title'=>'44','url'=>'#','image'=>'/style/imgs/loading.gif');
	$json['yq'][0]=array('title'=>'44','url'=>'#','image'=>'/style/imgs/loading.gif');
	break;
case 'xwnr'://新闻具体内容,根据变量的不同取不同的表里的数据,其实新闻这个词不合适,因为我们合并了新闻,文章,帖子等
	$fenlei=$F['fenlei'];
	$table=array(1=>'news',14=>'data_is',32=>'flash');
	$fields=array(
		'1'=>'id,n_name,laiyuan,nicheng,n_time,neirong',
		'14'=>'id,d_id,file,z_num,z_name,fenlei',
		'32'=>'id,n_name,fenlei,nicheng,uptime,u_id,jieshao,fileurl'
	);
	if($FENLEI[$fenlei]['toup'])
		$toup=$FENLEI[$fenlei]['toup'];
	else
		$toup=$fenlei;
	$table=$table[$toup];
	$fields=$fields[$toup];
	$id=$Q['id']+0;
	$where="WHERE id=$id";
	$sql="SELECT $fields FROM $table $where limit 1";
	if($DB->query($sql,$json,true)){
		$DB->click($table,$where);//计数器
		if ($table=='news'){//新闻分页,有些新闻是由分页信息的,好多站都有这个功能,可惜JE没有这个功能
			$json['page']=$DB->count('news_data',"WHERE news_id=$id");
		}
	}
	break;
case 'newspage'://提取分页新闻分页
	$news_id=$Q['id']+0;
	$page=$Q['PAGE']+0;
	$sql="SELECT neirong FROM news_data WHERE news_id=$news_id order by id limit $page,1";
	$DB->query($sql,$json,true);
	break;
case 'ftfs'://漫画浏览,由于我们的漫画是打过包(ftfs包,自己定义的格式,所以要特殊处理)
	$id=$F['id'];
	$sql="SELECT id,d_id,z_name,z_num,fenlei,file FROM data_is WHERE id=$id";
	$DB->query($sql,$json,true);
	break;
case 'mhxx'://漫画信息
	$id=$F['id']+0;
	$json['d_id']=$id;
	$json['fenlei']=$F['fenlei']+0;
	$sql="SELECT id,n_name,fenlei,uptime,gengxin,zuozhe,dir,jieshao,zt FROM data WHERE id=$id limit 1";
	$DB->query($sql,$json['data'],true);
	$sql="SELECT id,d_id,z_name,fenlei,file FROM data_is WHERE d_id=$id order by id desc";
	if($DB->query($sql,$json['liebiao']))
		$DB->click('data',"WHERE id=$id");
	break;
case 'dmxw'://新闻列表,根据变量的不同取不同的表里的数据,其实新闻这个词不合适,因为我们合并了新闻,文章,帖子等
	$Q['Page']=$Q['Page']+0;
	$fenlei=$F['fenlei']+0;
	if($FENLEI[$fenlei]['toup'])
		$toup=$FENLEI[$fenlei]['toup'];
	else
		$toup=$fenlei;
	$table=array(1=>'news',14=>'data',32=>'flash');
	$fields=array(
		1=>'id,n_name,fenlei,nicheng,n_time,u_id',
		14=>'id,n_name,fenlei,uptime,gengxin,dir,zt',
		32=>'id,n_name,fenlei,nicheng,uptime,u_id,fileurl'
	);
	$table=$table[$toup];
	$fields=$fields[$toup];
	if($FENLEI[$fenlei]['toup'])
		$where="WHERE fenlei=$fenlei";
	else
		$where='';
	if ($table=='data' and $F['abc']){//漫画字母索引搜索的特殊处理
		$abc=$DB->escape($F['abc']);
		if($where)
			$where+=" and abc=$abc";
		else
			$where="WHERE abc=$abc";
	}
	if (!$Q['CNT']) {
		$Q['CNT']=$DB->count($table,$where);
	}
	$json['lbpage']=array();//列表分页信息处理
	$json['lbpage']['rows']=10;
	$json['lbpage']['urlpar']="Q=$Q[Q]&fenlei=$fenlei";
	$json['lbpage']['cnt']=$Q['CNT'];
	$json['lbpage']['pages']=9;
	$json['lbpage']['no'] = $Q['Page'];
	$limit = pagelimit($json['lbpage']['rows'],$Q['CNT'],$Q['Page']);
	$sql="SELECT $fields FROM $table $where ORDER BY id DESC $limit";
	$json['title']=$FENLEI[$fenlei]['f_name'];
	$DB->query($sql,$json['liebiao']);
	break;
}
$E->pushJSON($json);//用共用库输出JSON数据

 后话.

这个站我们是从零开始建设的,3个人用了30个工作日.分工是:

1个策划:规划站点的业务逻辑和内容,建立数据库,小偷

1个页面:css,html.还有这个同事不是全职的,这1个月她工作的时间满算也就只有10天

我:负责其他工作,因为是我们原发的技术方案,所以很多东西要重头写,

可笑的是我有10天都完全被所见即所得的问题缠绕,

其中2天的选型,选择了wymeditor,化了4天改造他符合我们的技术逻辑.

就发现了nicEditor,发现nE更适合,就有化了4天学习扩充(这个谈不上改造,因为她的技术和我们的可以完美结合)符合我们的技术逻辑.到现在基本完成.

 

我以前在公司的内部系统中用过TrimPath的JavaScript Template，开发效率和维护性都比普通的MVC要高一点，用户体验也不错，可以做到一个页面就是一个完整的应用。

但是前台模板用在公开的网站上做不到对搜索引擎友好，这就很大程度限制了它的用途。

我们的模板是自己原发的jCT ,这个领域还在研究当中,感兴趣可以看看.
搜索引擎问题也已经有了解决方案,见我前面的帖子,我们的站正在写相应的代码,首先是大家一定要坚信,搜索引擎一定有办法解决,只要我们愿意做.
AJAX的方案支持搜索引擎的问题

 

使用前台模板后，后台输出只有数据，而没有HTML标签，要想做到搜索引擎友好，后台需要针对xmlhttp请求和普通的html请求写不同的输出结果（纯数据和数据+HTML Tag），我认为这样代价太高，失去了开发效率的优势。

如果不采用前台模板，只是简单的Ajax应用，倒是很容易做到搜索引擎友好，只要根据不同类型请求加上统一的layout即可。

支持搜索引擎的方案我描述的不够详细,
我的描述中只是提到了方法,没有说细节.
如果细说的话:
1.后台判断是否是搜索引擎
这个分两步,首先默认就是搜索引擎,如果前台提交的参数中有一个特殊的参数(比如"_")的话就不是搜索引擎.
因为默认就是搜索引擎,所以默认是后台直接输出给搜索引擎的数据的.
由于前台如果是浏览器的话,就会执行js,这样表现就落入js之手,特殊的参数就可以实施了.进入 AJAX了.

关于给搜索引擎的数据不同的输出结果:(肯定是包在body里了)
这个应该很简单吧,简单的用html标签随便选几个,把数据包起来,然后把相应的<A>嵌进去,当然<A>的目的就是让搜索引擎爬取的.里面的参数自然是不包含特殊的参数,这样方便搜索引擎爬取.当然具体方法,静态呀什么的就是细节了.
因为提取数据这一步无论什么情况是必须有的,输出加上html标签,是让搜索引擎看的,又不需要样式的设计,只关心数据就行了.不需要样式的设计的输出说简单点用RSS工具改造一下就OK了.

为什么用特殊的参数?
索然xmlhttp请求的头可以判断,但是有时候通过iframe提交的就没有xmlhttp请求的头

我怎么看这个方法也不觉得成本高多少呀!都是必须的内容,只不过是组合了一下.

2.如果用户通过搜索引擎过来,如何友好的显示数据.
首先,这个还是会重复第一步,给搜索引擎的数据还是会输出.只是前台的JS执行的时候先empty body,然后按业务设计去请求后台,当然特殊的参数就挂上去了.如何把搜索引擎给的参数再反映出来是个问题,这个问题牵涉的方面太多,只有到具体的应用需求上才知道如何做.

很明显我这个方法不是针对简单的Ajax应用的而是针对纯AJAX无刷新的设计的.

如果只是把Ajax作为点缀式的使用这个方案自然就用不着了.

搜索引擎友好不仅仅是一个<a>的问题，整个页面的title，meta tag的description, keyword内容，不同的tag包含数据：h1~h6/strong/ul/li对搜索引擎来说都是不一样的。考虑到这些SEO的细节，和ajax输出一个HTML片断已经没有什么区别了。

咳:
和ajax输出一个HTML片断已经没有什么区别,这话也对,但是不够严谨.
后台对AJAX支持的输出,只有数据,没有任何样式的,就是JSON(XML)格式的纯数据输出,
只有对搜索引擎的输出才有HTML标签,但是仍然是没有任何样式的输出,没有任何样式输出的附加成本不高吧!
关键是没有任何样式,没有任何样式这个区别恐怕就是最大最关键的区别吧.

你说的都对,
我只是提出一个方法,这个方法当然可以采用你说的所有细节和技巧.并不冲突呀.

你说的样式是指什么？是指如下代码中使用id的div进行排版的这些tag吗？

<div id="content">
...
</div>
<div id="menu">
...
</div>

对.
对后台数据输出来说
真对SE的没有样式,有标签
真对AJAX的只有数据,无标签自然没有样式.标签样式由前台模板完成.
目的就是前后台彻底的分离.
后台代码空前简单.原来传统的后台做了太多前台的工作
复杂的都在前台运行.统一的平台javascript,和后台彻底无关.

这样下去,后台的工作就少了,用什么平台完全无关,我们可以用自己喜欢的任何平台.本地exe化完全可能.
前台的技术水平就要求高了.但是在统一的平台javascript的前提下,你所有的学习和技术可以说是长期保值的.
呵呵,开发流程上再也不是做后台的决定一切了.前台人员的话语权,收入都会不同的.因为写后台太容易了.

可是这个工作只不过是从原先后台的template里面移到前台的javascript template
为了搜索引擎还得多做一个混合了数据和少量html tag的工作，我认为代价太高就是指这部分。