day08(商品详情页SKU联动+FreeMarker模版页面静态化)

1、模拟京东（8）课程回顾：1、前台系统的品牌展示品牌的修改或者添加时。将品牌信息保存到redis中品牌从redis获取（hash：idname）redis内存数据库（支持的最大的阀值：8Gkey-value：使用较少的key会定期清理、使用较少的key持久化到磁盘上。）windowredis启动redis服务数据没有了（没有持久化到磁盘上）开发环境：安装Linux上。redis单线程listfifo2、条件是筛选品牌筛选：需要判断是否已选了价格价格筛选：需要判断是否已选了品牌service实现类处理：条件信息封装SolrQuery对象中。1、brandIdsetFQ（“brandId:”+bar

2、ndId）2、price切割length=2100TO200else1600TO*展示已选条件map（key,value）fn:length（map）将已选过的条件隐藏empty3、ActiveMQ介绍和使用概念：消息队列（消息中间件MOM）。Apache的产品。使用最广泛（稳定）。通信方式：异步通信。JMS：Javamessageservicejms支持消息中间件供应商（ActiveMQ）,spring支持jms。ActiveMQjmsspring整合。jms发送消息方式：1、pointtopoint（点对点）生产者生产消息（queue1）消费者（queue1）监听容器取出消息（将消息消费处

3、理业务）2、p/s（消息的订阅与发布）：生产者生产消息-T可以被多个消费者消费名词1、jsmtemplate：发送消息到容器中2、生产者：生产消息3、消费者：需要监听mq容器。如果有自己的消息需要进行消费。ActiveMQ工作的原理本项目的使用场景p2p1、商品上架isShow2、service-product:生产者。将id发送mq3、将商品保存到solr中交给service-solr服务（消费者）去执行。课程计划：1、去商品详情页（单品页）2、sku的联动效果3、freemarker的介绍4、商品详情页的页面静态化1去商品详情页1.1分析1、点击图片时，根据商品的id查询数据2、查询的数据

4、：product（商品信息）3、查询的数据：sku（库存信息）1.2修改jsp页面的请求路径on.click=open(/product/detail?id=$product.idr)ns區仙函申心亦丄则Jrredihml先lolr.nH-；.db.prapHn贋炖弓.pEpertiH上、x2BrrHrM.ri.375lR/bwnnjcTs-*pgfcJiiac-ofifi-seirtce-cmsrdfloa亡curvewrappern1.3搭建cms工程1.3.1copy一些配置文件.pHnanlJLn:-jipDrl-ir:旳HjjaefSCvLIxispafT-hr-7|WtwifffJ

5、rl-pfKlHlFSfijrlin|ir岂baifiari-viVMM-bufvrpknrCD.-Li=-jls和*亡氓却/1柏辭pOi.*1?rc/mflini!avx.irc/mah/4耳mnfig廉applkad占Bpplir-Btiun1.3.2编辑web.xmlxmlns:xsi=fittp:/wiknk1-.w-J.org/L/Ul/XTilL3e/iejns-mstanaenxsi:schsmaLccat：ion=n，httpj/jHava.suncoisi/Dnal/ns/ja17aee?rrp:/Jaw-svn.jrraI/nb/J*vsee/weh-app2弓-兗占!-一

6、ing一ggixf丄件一一*CQntBKtConfigL匚ationcJ_asspath:spring-configjmlDEgspringframework.web.context-ContesctIioaderLisrener|1.4编写service接口、实现类1.4.1编写CmsService接口定义的方法：1、根据商品的id查询商品信息2、根据商品的id查询库存列表publicinterfaceCmsServicey1*3Title:selectProductByIdDescription:根据主键査询商品信息paramid3工巳七nrn3returnProductthrowspub

7、licProductselectEroductByldLongid)3Ti七丄点：selectSkuListByProductIdSDesaription:根据商品id查询库存列表|param,productidreturn3returnListthrowspublicListselectSkuListByProductld(LongproductHcJgBSdubbo全旨揶羽捐-A1.4.2编写cms的实现类EielIo-L3_oFrodLuu七bfd1ec=tFrodviutByIdl匚口npid.)fFx-ociu.ct：|pjtodlu.c：七peodluLC：t-M-siipjpex

8、-b?d#E?xJ_nn.is匸氏口Vt匚日jzsturnprodlu-ctEon立旦疋旻虽富背Title:.se-l-ec：七吕託口工i.曰-tEiirmirodhJLC；七工du/口Descrp-ccjn:根拥;商品id査甸盜存列赛f/pHgpAitprocLud11cLPItLk.r11wsescn.xtic:aft.匕s匕acpoct.service.,czms-czms-So-zrv=c-#saXwcztSktilaftByFr口duct1tti&LloLkBtselectsJizuLibtBvProdluct-13(Lonapr&3uctla艺1y=iyawB3cu.Qij.ci)

9、jaleu.Quaxy_crAa-tdC1irteraa.i：-l1Dxoclu.ct:Id.E1_ToCpEod.xici七工已jZid-o-1Ictiq-slcuIM3a.ppait.-q_acb：ByEscampLci(sIctiQus.fv/for(SlcuLskti匸bku.B/ili?ECo_or.HI5t3.更新:查询库存大于0的SkuQueryquery=newS/ftjQtjer)-);/查询厘存大于8的|query.createCriteria().andProductldEquaLTo(productId).andStockGreaterThan&);1.5配置dubbo

10、服务配置服务提供方：cms配置服务消费方：portaldubbo;referenceid=pj：cxJLrc7：tE_rvi.c：mnintsrface=ncn.itejtBbabasportserics-proiLrct.Prcxfu-ctSi口rl=duhbo:/127.O.D.lD38Dnchec上duhbo:refer-enaei:.=-cJ.Qr5srTlc,&interfac&=-cn-itcast2?巻上?总宇日工亡方曰工矿卫忑口匸加匚占UorojrWEdiurl=Udubbo/127Q.0r1;2030check=fjlsedubbo;referenceid=searchSsr

11、vieg*int曰匚facs=cjiiteasS,haJ?jsportrservice,solr-SearcnSBrvic：i口1二心衍uhmu上=占ee/A1.6编写controller去商品详情页&ReqnestMapping(/product/detail1)publicStringdetail(Longid.Modelmodel)/商品信息Productproduct=cmsService.selectProductByld(id;model.acldAtLrihuLe(T,prjc1lcLt,tprodiicL);/库存信息Listskus=cmsService.selectSknL

12、lstByProductId(idmodel.addAttribute(T,sku.sT,Tskus);returnT,produ.c:tT,;1.7jsp页面回显颜色：亡丄ass=r,urwclass=“刮已id=waolorsfforEachitems=skusvar=oijrTivclass-anclic.-ncolarToRed(this*Sslcu.匚丄oridUimadata-img=src=/Inag&s/53fj34t2d2N0t371atj2002.Ing/&丄務沓三徉挣heightn25nwidths25sku.CQlor|.named-商品信息：|inigdata-ini

13、g=nlalt=*src=pic：width=*50nheight1.8颜色重复1.8.1bug182set需要重新equals和hashcode方法对Color(id)重写equals和hashcode方法。juctContifoller.java盾searchjsp凰productjspEdubbo-consumeif.xml0ColorJavaKsb.appendfaerialVersLonUID=ri!append(sezjfaZVezr-sioial/JD)*append(;/rat;urnsibatoString(;/TOC o 1-5 h zOverride/piibXzLuin

14、thm吕hCodte(J|/finalirrtprim=31;zzlntresul匸二1;暮result=prime*result十(id=null)?0:id.hashCode)ireturnresuit;&Overridepiiblicbooleanequals(Objectobj)if-tliJLsj)returntruG;If(obj=null)returnEalse;if(getClass!=cbjg巳tCIlassfreturnfalse;Colorother=(Color)obj;If(id=null)if(other亍日！=nullretnmfalse;)elseifI.!id

15、&qn曰丄s(DthEi;idi?曰七urnfalse;183将颜色信息放到set容器中（不能存放重复元素）*去商品详情頁*7ReqiieLMapping(T,/producL/cieLdll1)publicStringdstail(LongidfModelmodel)/商品言息Productproduct=cmsService.selecProductByld(id)；model.addAttribute(productT,tproduct);/库存言息Listskus=cmsService.selectSkuListByProductId(id);model.addAttribute(r,

16、ski_;sT,skus;/防止顿色重复，啟到met亭器中SPtcolors=newHaRh.Spt:();for(Sku.sku.:skua)colors.add(sku.getColor();returnT,productT,1.8.4jsp页面的颜色回显Cdivi：=prchoose-co丄ojtclas5=llchoose-co丄or一sJiduJ)p-chooseldiv匚_已35=叼七“选盘且匚百elass=Hddflic=flcoIors,ITtLref=njvcript:;Fcolo工.nameFimgdata-img=nlFsrc=/-Ltnags/S3fddo2N0b7丄&

17、rib匚002.*懐匚三Jolor.nams2sku的联动效果2.1选择颜色操作/進择跟邑權亦EuncitioncalorTinRadl(t.args-rcalorld)/2wsisasfii丽适定癥色耳空$(s,fealorsdiv11aremov&Class(select&d1*):/1袴迭务的JS色眶孔紅/Starget).attrCc?lass?itemselectedwj?$(targetaddclasstHselect-sdB,);n-iiffisafe.顾诙烦邑匸的尺毋vartitmL=!iH用于械尺旧慣息csforEachitens=H$(atusvaEskuifcolorId

18、S(5kui.calorldl/WU藤麵色下国尺咼亶別html=十!S+,/4腳ffitffl尺码虐邕5(,!#slzg51!).htFil(htmlf2.2选择尺码确定尺码后就确定了一条sku,确定了sku后就可以填充价格。/选择尺码操作|functionsizeToRed(targe七尸size)/2、切换丘码框将之前选定的尺码青空$(T，#三_1艺吃占divT,).rem口7匕匚丄耳占占(占匕丄etsbeci),/1、选择尺码后将尺码框变红S(targetJ.addClass(T,selectedJ;/3、确定丘码氐就已经确定了一条mkm那虫就可以填帝价格if(cld=1$sku.col

19、orId1&size=?sku.EizE)/填充忙格S(T,非hhq-prir：pT,J,htm(S-tku-rriA)进入详情页默认选择第一个颜色下的第一个尺码/页面初始化默认选择第一个颜色点击事件$(function-3(T,#81orsdiv:first11).trigger(click;r,gEtitriL二八；冊Ifl梧足同E整varflag-truej/畀去ifcolorld=!Ssku.colar：IdFfH*：谆&叵TBR!：ir(flag)htsnldivcl-asa-nz.traaLestTld-n5.sizeF*ca=liDk-nBizTcRedIthi-Sj15Ieku

20、T+!Cahr*f=rajavascript:;titls=H$ku.jjizoJSnIm.a1zaJa+1,flagEalBej英ifl开至5C#bbs-price-)hcml(5iskunpriceJJelaethtmli二B1+15ska.bies+a最终varcld;/送择颜色操作fLLnctic-ncolorToRed(t玄旳已JcolorIdL)cld=colorld;H2.切换额色框稱之前选定的颜色清空eitcolcrsdiv).removeclass(sslected1:H1、将选择的藪芭框变红(target).attr(clisariteirselected)；5二淞旺己二,

21、addclass(sel&ctsd);Hm_确.：运顾色后，加载潼颜色工的尺码varntmL=1；/用尸拼按尺码信启.varflsg=-rue;/开关-：zorEachitejnE=$(s：if(cclorld=szu.eu-orli；1)|/力口载该颜色=一的尺何二甩*if(flag)htinL-=1div匚1mss=:izwzne-bLe匚ted1*id=l+rwWumhrsf-avaGrJr:；-jrls=v：sku-?tf:只#：；-?s-bflag=false;/IZ-/填充价格?(itbbi-pi-ce；.htit.l(skii.rlwe*)slse-html-=+rahrsf-a

22、vs?crjp:；r.irls+skn.5iz-?：k-：.?=-se-r/c:zrZa匚上/4.拼接所有的尺码怡息$fis.zui；).html(htit.l:;3freemarker介绍3.1概念FreeMarker是一款模板引擎：即一种基于模板和要改变的数据，并用来生成输出文本（HTML网页、电子邮件、配置文件、源代码等）的通用工具。它不是面向最终用户的，而是一个Java类库，是一款程序员可以嵌入他们所开发产品的组件。FreeMarker是免费的，基于Apache许可证2.0版本发布。其模板编写为FreeMarkerTemplateLanguage（FTL、html、txt），属于简单、

23、专用的语言。需要准备数据在真实编程语言中来显示，比如数据库查询和业务运算，之后模板显示已经准备好的数据。在模板中，主要用于如何展现数据，而在模板之外注意于要展示什么数据。模板+数据输出（将数据展示在静态页）。3.2原理模板+数据模型=输出我们准备模板、准备数据，通过Freemarker提供的类将模板生成静态页，并再该静态页上填充我们准备好的数据。3.3语法jsp：遍历listemptyftl：遍历list$keyword!3.4demo入门程序publiccla.5sFrnDemoFilefile=newFile(pathname)1?ConfigurationconfigiiraLt-ioi

24、i二no-wconfiguration(;configurationsetDirectoryForTemplateLoading(file);门麴噸板Templatetemplareconfigur且匸iQngEt;!1巳mp丄已t巳fh巳丄JLo.htm丄T;/擁謝堀Listusers二newArrayListo();Usernserl=newUser();userlsetId(1;userlsetName(iufb);usersadid(user1;Useruser2newUser(7user2吕巳tld(2fuser2-setName;users曰已已(lls已工;2;MaprootMa

25、p二newHasKMpO();rootMapput(11usersMjrusers);/植板+埶拒一一一输出帰有删的魁writerout=nowFileWrixsr(pathnaLme+word.html./ummsfrootMapfout7/鱼过欖板.拒输站口rd.htm1迭-卜SystemrootMap,Longid;实现类：publicalassStaticiageServicsimp1implementsSta匸丄心卩占且与客工叮icQf汁*1不希JgriEErConfiguration.b郅么我f|呢耍注入匚2ssprijiggiSfreemarkez-fiiiF匸meiMm工k日匸

26、ConfigiL匸包工对8;套B5匚口nfiguitiatioiL3“freeMarkerCanEigurerj?凶4、ireeMarkerConfig-ur/WEE-INF/ftl/損板*/privateConfigurationconfigurarion;publicvoidsetFzssMarkeeConfigurer(FreeMarksrConfIgurertzssHarkerConigursr)(this.configuration=fre&MarkerConfigurer-geConfLgfurat:ion(;privateServletContext-servl&tCantext

27、;/注入mm工*丄包七|2匕!1匸9盍七縈取【页目氏|再买路轻mOverridepublicvoidsetServletContext:(ServletConrexthervletConteact)fthisservletContext-=ssrvietContext-fDescription:生圈&态帀的具解现root-Kapparamidseecm-it-csst;kiahmx工匸servicecmsstaricPages&rvicetindex(javaut.11Mapoverridepublicvoidirtdex(MaproctMap,Longid)/1.Configuration,

28、/淮卡r*oLiliiguathnam：j=,r7li_；nl/roducL/1-LJ+.j-LtiiiLM;/:Hi-nr/诀.-*冃4陥匸F=rvtContextSxir.greal!一servletContsxt.s-Realfpa-hnaiaa);F二丄三i_w二tiewFil=(r=_?a七上).；F1?parent?2-J.jstParantFile(;1(!paz-ii.F_e.exists/JIlfF?G/.74/prci-LCL/；?：:元IF衣丢诃汪pn-.Fr：.rr：-iir-in：i-C1-3irVnnir3r&f4.3将静态服务交给spring管理二FadcaeE叩

29、.33NaviAl商三senbobsspct-bgriporeri?:i.：oH-bdtjQGpMT-pojc|pAiAiIj.-rihj口门；匕babaspcft-partaJpa-eTTtjCiibabMpobabsspc*t-HH-vice-buw;圮常江f1babipEvt:-kh-otiblF.r.ntJO/b.1禪立r：/lTUirjdA*出cn-fcra-stbabMpoFt-SEriittjcm-sQpCrnsServiCBrrnjffVJ曲bEPBgrviEmpLjdivk禅思tKjmaifVfwourcei*LtccflfigJ$flPpicationCaniw.it-ni

30、HpfMr.吟羊phSon匚“dt-wanjii：”丁；4ipEcdtiDnCantK-jt-tfAnsacti罡dubbciprovid?fmnlJ$nedii-Kml西fidf.ifVll胃slatrpdQfe祕r口idfrieil|因dbprpp*ti曲Ic-Sprapertiep即rjdD&-conH9.xnil片spiirq-canRgjjiJprapeztyname-=11tsffbm曰nACoe-anid丹bisfits七口豆史*m耳HgmHscsnsr*lasjncnJ.匕CLiiS七jbabjport-jzgnzsss-agsSrtuCujEcoJd1-jsjtag-tZJ.

31、jtejl7VEe占nid=cferauJressagreLlsi;enerConcainerclaaB=oEgsprlngrrdnekor.JjeSjIlscene-TjCeTaulEKessageLlscenerContproEegrtynam&=pCMn&etionFicfiaryr&f=intf2eConn&2tiojiF&Cprapeirtyname-mejsageLJ.rt=n=-r*refwcmjCuJtojnMejjtfg=-ii5tener/1-窗歸一尉:TQE或區工亍仇日旳巳=JEUJJ：C_10nW&niE?T审曲已=pEdJLi：?CjnfACproEGftynama=

32、ppubSuhBcMlf!flvalu&=ptr-us!74.4.2自定义消息监听器GvearridBpubli0voidonMessage：(Messagem.c-ssage-1-/flmsaaag:ftAz11veMCrre-xtMe55i3.geactLvsMe-xtMeaaageitAct1vsMQTextMeaaage)nierisage;飙:WEtry(Stringid=act-iveMTexCM&99agegetText);E4aptringPObjectsraatMapnewHaabiHap-O);/驱眾堀商翩剣3、岸徉l*!5-颜邑伯口/阿腿案爵-：I一-二一-：IPr#：1

33、1|r-亠.：丿”rootMap.put(，npraducproduct;/屋存為需军Lists-kLLf=on=Eqrvii=e_sc-1c-ct-SkuLit.EyCiirciciLLUtLdJlriciStDukMDzrGiThNnZlDHCilILong-jpmjrMfijXojigfid)lixstMapput(skua,l!Fskus;/E：*|SeLcolors=jiswHa.sh已匸3H*forSkus-ku:kus)cclcis.addfsKu.gsGColox?roozMapput(colorsrcolor日?ataticPaijeSarvLce.indew(rtNaprLong,pars&Lc?ncr(id?Jicratch(EMCBptione)a.prinrSraekTrace();4.5更新service-product/solr中的ActiveMQ配置文件solr：5自走义消息监听需z处理从列中的消息beanz_d=austomMessa.geLlsten&rclass=ffcn.itcast.bbaspGbeanz_d=nd&fultressgeListenerContsinernclass=org.sprpropertyname=,fcon