Flex实现QQ网页提取天气信息

1、预备知识

Flex是Adobe提供的基于Flash环境的RIA展现技术，主要采用MXML+Action Script来编写程序、界面，然后通过编译器编译成flash格式的SWF文件发布到网站上。

实现该功能需要安装Flex SDK，可以从Adobe网站上面下载，或者安装Flex Builder plugin+Eclipse来开发。

同时需要具备简单的正则表达式知识。

 

2、界面布局、代码实现

文件：QQWeather.mxml

 

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="213" height="234" creationComplete="initApp()" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#F6FBFC, #3FEEDC]"> <mx:Style> .myfont{font-size:12pt;font-family:'宋体';} </mx:Style> <mx:Script source="QQWeather.as"></mx:Script> <mx:Label x="10" y="53" text="选择城市:" styleName="myfont"/> <mx:ComboBox id="cmbCity" x="66" y="49" width="133" rowCount="6" change="changeHandler(event);" styleName="myfont"></mx:ComboBox> <mx:Image x="10" y="10" source="@Embed('../title.gif')" width="189" /> <mx:Image x="10" y="106" source="@Embed('../tem1.png')" width="57" height="13"/> <mx:Image x="10" y="132" source="@Embed('../tem2.png')" width="57" height="13"/> <mx:Image x="10" y="178" source="@Embed('../tem3.png')" width="57" height="13"/> <mx:Image x="10" y="154" source="@Embed('../tem5.png')" width="57" height="13"/> <mx:Label x="75" y="103.5" text="" width="110" styleName="myfont" id="t1"/> <mx:Label x="75" y="129.5" text="" width="110" styleName="myfont" id="t2"/> <mx:Label x="75" y="151.5" text="" width="110" styleName="myfont" id="t3"/> <mx:Label x="75" y="175.5" text="" width="110" styleName="myfont" id="t4"/> <mx:Label x="34" y="202" text="Label" width="169" styleName="myfont" textAlign="right" id="lbToday"/> <mx:Label x="10" y="80" width="193" id="t0" styleName="myfont" fontWeight="normal"/> </mx:Application>

 

后台脚本：QQWeather.as

 

// ActionScript file import flash.events.Event; import flash.events.SecurityErrorEvent; import mx.collections.ArrayCollection; import mx.controls.Alert; import mx.utils.Base64Encoder; private var loader:URLStream; private var htmldata:String; private var ifloaded:Boolean=false; private var dataUrl:String="http://weather.qq.com/inc/ss*.htm"; public function initApp():void { var t:Date=new Date(); lbToday.text=t.fullYear + "-" + (t.month + 1) + "-" + t.date + " " + t.hours + ":" + t.minutes + ":" + t.seconds; loadUrl("125", parseCityInfo); } private function loadUrl(cityno:String, callback:Function):void { loader=new URLStream(); loader.addEventListener(Event.COMPLETE, callback); loader.addEventListener("securityError", onSecurityError); var addr:String=dataUrl.replace(//*/, cityno); trace("Loading", addr); var request:URLRequest=new URLRequest(addr); //var enc:Base64Encoder=new Base64Encoder(); //enc.encodeUTFBytes(addr); //var request:URLRequest = new URLRequest("http://localhost/httpproxy/webservlet?data="+enc.toString()); try { loader.load(request); } catch (error:Error) { Alert.show("不能连接服务器：" + addr, "Tips"); } } private function onSecurityError(event:SecurityErrorEvent):void { Alert.show("安全错误：" + event.text, "Tips"); } private function parseCityInfo(event:Event):void { var sm:URLStream=event.target as URLStream; htmldata=sm.readMultiByte(sm.bytesAvailable, "gb2312"); trace("completeHandler: " + htmldata); if (!ifloaded) { var pattern:RegExp=new RegExp("value=/"(//d{1,3})/">([^<]*)</option>", "g"); var result:Object=pattern.exec(htmldata); var data:ArrayCollection=new ArrayCollection(); var item:Object; while (result != null) { trace(result[1], result[2]); item=new Object(); item.label=result[2]; item.data=result[1]; data.addItem(item); result=pattern.exec(htmldata); } cmbCity.dataProvider=data; ifloaded=true; } parseWeather(); } private function parseWeather():void { //分析天气信息 var item:Object=cmbCity.selectedItem; var pattern:RegExp=new RegExp("align=/"center/">([^<]*)</td>", "g"); var result:Object=pattern.exec(htmldata); var data:Array=new Array(); while (result != null) { data.push(trimString(result[1])); trace(result[1]); result=pattern.exec(htmldata); } t0.text=item.label + ": " + data[0]; t1.text=data[1]; t2.text=data[2]; t3.text=data[3]; t4.text=data[4]; } private function changeHandler(event:Event):void { var item:Object=ComboBox(event.target).selectedItem; trace(item.data); loadUrl(item.data, parseCityInfo); } private function trimString(s:String):String { return s.replace(/(^/s*)|(/s*$)/g, ""); }

 

3、注意事项

根据flash的sandbox安全模型要求，A域名下的flash文件只能从A域名中获取服务端数据，如果需要从B域名中提取数据，需要B域名配置一个crossdomain.xml的文件，允许A从B

下载数据，但是我们不可能有这样的公关能力要求腾讯在http://weather.qq.com/下面放一个xml文件，允许其他网站访问，因此只能另辟蹊径：

方案1：A域名下自己实现一个代理，从B域名网页下载数据返回，这样就回避了sandbox的安全性错误，Line 26-28注释的代码就是我用java Servlet实现的一个代理。

方案2：建立代理服务器，例如squid或者Apache代理

方案3：采用adobe提供的开源软件bladeDS,该软件采用J2EE War方式发布，可以提供RPC、HTTP Proxy的代理功能

方案4：采用Adobe的企业级解决方案Adobe LiveCycle ES ，这个东西试用版就2.5G，真是庞然大物，受不了了，没见过这样的软件，一个Oracle数据库也就几百M而已，想不通。