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

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

以前用C#实现了从QQ天气网页提取天气信息显示,最近了解Flex,随便测试了一下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
=”Flex实现QQ网页提取天气信息
 width
=”110″
 styleName
=”myfont”
 id
=”t1″
/>

    

<
mx:Label 
x
=”75″
 y
=”129.5″
 text
=”Flex实现QQ网页提取天气信息
 width
=”110″
 styleName
=”myfont”
 id
=”t2″
/>

    

<
mx:Label 
x
=”75″
 y
=”151.5″
 text
=”Flex实现QQ网页提取天气信息
 width
=”110″
 styleName
=”myfont”
 id
=”t3″
/>

    

<
mx:Label 
x
=”75″
 y
=”175.5″
 text
=”Flex实现QQ网页提取天气信息
 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

 

 1 
//
 ActionScript file


 2 
import
 flash.events.Event;

 3 
import
 flash.events.SecurityErrorEvent;

 4 


 5 
import
 mx.collections.ArrayCollection;

 6 
import
 mx.controls.Alert;

 7 
import
 mx.utils.Base64Encoder;

 8 


 9 
private
 var loader:URLStream;

10 
private
 var htmldata:String;

11 
private
 var ifloaded:Boolean
=
false
;

12 
private
 var dataUrl:String
=

http://weather.qq.com/inc/ss*.htm

;

13 


14 
public
 function initApp():
void


15 
    var t:Date
=
new
 Date();

16 
    lbToday.text
=
t.fullYear
+



+
(t.month
+
1
)
+



+
t.date
+

 

+
t.hours
+

:

+
t.minutes
+

:

+
t.seconds;

17 
    loadUrl(

125

,parseCityInfo);

18 
}

19 
private
 function loadUrl(cityno:String,callback:Function):
void
{


20 
    loader
=
 
new
 URLStream();

21 
    loader.addEventListener(Event.COMPLETE, callback);

22 
    loader.addEventListener(

securityError

,onSecurityError );

23 
    var addr:String
=
dataUrl.replace(
/
\
*/
,cityno);

24 
    trace(

Loading

,addr);

25 
    var request:URLRequest 
=
 
new
 URLRequest(addr);

26 
    
//
var enc:Base64Encoder=new Base64Encoder();

27 
    
//
enc.encodeUTFBytes(addr);

28 
    
//
var request:URLRequest = new URLRequest(“
http://localhost/httpproxy/webservlet?data=
“+enc.toString());


29 
    
try
 {


30 
        loader.load(request);

31 
    } 
catch
 (error:Error) {


32 
        Alert.show(

不能连接服务器:

+
addr,

Tips

);

33 
    }

34 
}

35 
private
 function onSecurityError(event:SecurityErrorEvent):
void
{


36 
    Alert.show(

安全错误:

+
event.text,

Tips

);

37 
}

38 
private
 function parseCityInfo(event:Event):
void
 {


39 
    var sm:URLStream
=
event.target as URLStream;

40 
    htmldata
=
 sm.readMultiByte(sm.bytesAvailable, 

gb2312

); 

41 
    trace(

completeHandler: 

 
+
 htmldata );

42 
    
if
(
!
ifloaded){


43 
        var pattern:RegExp 
=
new
 RegExp(

value=\

(\\d{

1
,
3
})\

>([^<]*)</option>

,

g

);

44 
        var result:Object 
=
 pattern.exec(htmldata);

45 
        var data:ArrayCollection 
=
 
new
 ArrayCollection();

46 
        var item:Object;

47 
        
while
 (result 
!=
 
null
) {


48 
             trace(result[
1
],result[
2
]);

49 
             item
=
new
 Object();

50 
             item.label
=
result[
2
];

51 
             item.data
=
result[
1
];

52 
             data.addItem(item);

53 
             result 
=
 pattern.exec(htmldata);

54 
         }

55 
        cmbCity.dataProvider
=
data;

56 
        ifloaded
=
true
;

57 
    }

58 
    parseWeather();

59 
}

60 
private
 function parseWeather():
void
{


61 
    
//
分析天气信息


62 
    var item:Object
=
cmbCity.selectedItem;

63 
    var pattern:RegExp 
=
new
 RegExp(

align=\

center\

>([^<]*)</td>

,

g

);

64 
    var result:Object 
=
 pattern.exec(htmldata);

65 
    var data:Array
=
new
 Array();

66 
    
while
 (result 
!=
 
null
) {


67 
        data.push(trimString(result[
1
]));

68 
        trace(result[
1
]);

69 
        result 
=
 pattern.exec(htmldata);

70 
    }

71 
    t0.text
=
item.label
+

:  

+
data[
0
];

72 
    t1.text
=
data[
1
];

73 
    t2.text
=
data[
2
];

74 
    t3.text
=
data[
3
];

75 
    t4.text
=
data[
4
];

76 
}

77 
private
 function changeHandler(event:Event):
void
{


78 
    var item:Object
=
ComboBox(event.target).selectedItem;

79 
    trace(item.data);

80 
    loadUrl(item.data,parseCityInfo);

81 
}

82 
private
 function trimString(s:String):String{


83 
    
return
 s.replace(
/
(
^
\s
*
)
|
(\s
*
$)
/
g, 
“”
);

84 
}

 

 

用mxmlc命令编译之后,运行效果如下:

 

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

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而已,想不通。

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/111004.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 谷歌学术403异常处理「建议收藏」

    谷歌学术403异常处理「建议收藏」谷歌学术403异常处理解决方法解决方法百度了几个方法,下面的可以解决问题:首先要在Chrome上安装Ghelper插件在Ghelper上进行注册下载地址:地址下载之后安装方式:1.打开你的Chrome浏览器的更多工具>扩展程序页面.或者直接在网址输入:chrome://extensions/2.这个页面点击“添加已解压的扩展程序”,如果没有,在右边有一个“开发者模式”开关,要打开.3。选择本次下载包里的ghelper_source目录4.或者将下载包中的CRX文件

    2022年10月11日
    3
  • DropDownList的常用属性和事件「建议收藏」

    DropDownList的常用属性和事件「建议收藏」SelectedItem属性设置或获取下拉菜单的选中项,该属性的类型为System.Web.UI.WebControls.ListItem.所有列表控件(ListControl)中的项都是该类型,它

    2022年7月2日
    28
  • Linux的查找命令

    Linux的查找命令

    2021年9月17日
    47
  • 实例分割综述(单阶段/两阶段/实时分割算法汇总)

    实例分割综述(单阶段/两阶段/实时分割算法汇总)点击上方“3D视觉工坊”,选择“星标”干货第一时间送达简介目标检测或定位是数字图像从粗到细的一个渐进过程。它不仅提供了图像对象的类,还提供了已分类图像中对象的位置。位置以边框或中心的形式…

    2022年8月23日
    10
  • vue父子组件传值props_vue子组件调用父组件的方法并传参

    vue父子组件传值props_vue子组件调用父组件的方法并传参vue页面结构在做项目的时候常常有这样的一个情况,这个页面的数据(比如:id号)要带到另一个页面去查询某个数据的详情等,传统的做法不是在url上加参数,cookie或者是现在H5的“sessionStorage”和“localStorage”上赋值,这是页面之间传递的方法。随着Angularjs,React,Vue的流行组件式的开发方式成为另一种不错的解决方案。最近就有一些小伙伴问我,vue组件之间是如何传递参数的?其实vue是有三种方式可以组件之间传递数据(props,组件通信,slot)..

    2025年6月24日
    3
  • MySQL数据库mycat读写分离[通俗易懂]

    MySQL数据库mycat读写分离[通俗易懂]mycat读写分离Mycat的读写分离是建立在Mysq的主从复制的基础上的修改配置文件schema.xml<?xmlversion=”1.0″?><mycat:schemaxmlns:mycat=“http://io.mycat/”><schemaname=”TESTDB”checkSQLschema=”true”sqlMaxLimit=”100″dataNode=”dn1″>

    2022年10月13日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号