站内搜索: 请输入搜索关键词

当前页面: 开发资料首页Javascript 专题Flash 和 ASP / PHP 以及 Javascript 的交互

Flash 和 ASP / PHP 以及 Javascript 的交互

摘要: Flash 和 ASP / PHP 以及 Javascript 的交互
<textarea readonly style="border:none;font-family:Courier New;line-height:150%;width:760px;overflow-y:visible">

唉,第一次写文章,真是很紧张,这是前几天在网上查资料和自己研究的结果,希望能对一些朋友有用。水平所限,肯定有错漏之处,烦劳高手指正,不胜感激!
下面就书归正传:

Flash 以Javascript 为中介和 ASP/PHP 交互

我们班有同学录,人气比较旺。前一段时间管理员托我写一个基于 HTML 的播放器放在班级留言上面,要求很简单,就是实现循环播放。于是就写了一个,比较容易,无非就是 Javascript 的操作和 ActiveX 控件的交互,查了查 MSDN 决定用 WMP 的 ActiveX 插件。写完后,播放效果总是不尽如人意,不知是我写的 Javascript 有问题还是 WMP 的 Javascript 接口有问题,在播放的时候有时不能循环。后来突然想到了 Flash 7.0 也是可以播放 mp3 的,于是开始了设计(没学过系统工程所以不标准,但愿不会贻笑大方):

目标:
1. 播放mp3,基本播放控制功能(暂停,继续,索引,音量控制等);
2. 当前曲目循环、列表曲目循环
实现:
1. 音乐列表从数据库中动态检索
2. 提供添加音乐 URL 的界面

这里,我的思路是:用户访问 ASP(PHP) 页面 => ASP(PHP) 请求数据库 => 返回数据集 => ASP(PHP) 将数据集写为 Javascript 变量 => Javascritp 通过 Flash 的接口函数写到 Flash 中的 DynamicText 变量中 => Flash 将列表显示
这样就出现了一个问题,文件列表的数量是不定的,怎么在 Flash 中处理,设置几个变量呢?我的解决办法是(也许不是很好的办法,但是却很简单,如果高手有更好的方法,请不吝赐教,谢谢了):在 Flash 中设置两个变量,一个是保存文件名 varSongname 另一个是保存 URL varUrl。在 Server 端就生成形如(本文中的英文引号被自动替换成了中文引号,请注意):


var strSongname = “Songname1,Songname2,Songname3“;


的客户端 Javascript 的变量定义/赋值语句,然后再使用 SetVariable() 语句将此变量传入 Flash 中,Flash 就将字符串 split() 成数组,然后,不用我教了吧?各就各位的显示出来吧

在这样的思路指导下,诞生了3个文件(sFMP的意思是simple Flash MP3 Player) 1 ) sFMP.swf - Flash 文件作为用户界面;2 ) sFMP.asp (.php) - 请求数据库将文件列表作为 Javascript 的变量写入返回的 HTML 文件;3 ) add.asp (.php) 添加 URL 的页面。下面就具体讲解每个文件的程序逻辑,和工作步骤:

sFMP.swf 的制作

由于用的是 Flash MX 2004 Professional 所以直接就借用了里面许多组件。(不过要慎重,因为一旦加入 ActionScript 2.0 和组件的支持,文件就会增肥,一般会变大60多KB,视使用组件多少而定。具体原因可能是要包含许多组建库的缘故吧?)下面是里面使用到的组件:

MediaPlayback 组件:
可以直接播放 MP3 很方便。其包括很多属性和方法、事件。Macromedia 里面有比较详细的说明。
InstanceName: _player
Action:

<table style="WIDTH: 670px; HEIGHT: 100px" cellSpacing=0 cellPadding=0 width=670 bgColor=#d3d3d3 border=0> <tr> <td> on (load) { // 可以插入一些播放器初始化代码
}
on (complete) { // 这个事件当一首音乐播放完毕时产生
// switching process
if (_root._cbLoopCur.selected == true) {
// 当选择了循环播放当前曲目
_root._player.play();
} else {
if (_root._cbLoopAll.selected == true) {
// 选择了循环播放全部列表曲目
var iIndexRead:Number = _root.SongsList.selectedIndex;
// 将列表中的选择高亮条下移一个
// 如果已经到末尾则重置
iIndexRead++;
if (iIndexRead > _root.SongsList.length - 1) {
// set current song index = 0
iIndexRead = 0;
}
// 更新 List 显示
_root.SongsList.selectedIndex = iIndexRead;
// 这里调用一个函数用来取得播放列表当前选择的 URL
// 并用setMedia()和play()方法使播放器播放曲目
// 由于比较简单所以略掉了
}
}
}
on (change) { // 正在播放音乐时候
}
on (progress) { // 正在下载音乐文件的时候
}
</td></tr></table>

List 组件:
用来显示从数据库中检索的文件列表。
InstanceName: SongsList
Action:

<table style="WIDTH: 670px; HEIGHT: 100px" height=100 cellSpacing=0 cellPadding=0 width=670 bgColor=#d3d3d3 border=0> <tr> <td> on (change) {
// player control
// get list item data
var str:String = this.getItemAt(this.selectedIndex).data;
if (str.length>0 && str != undefined) {
// open the URL
_root._player.setMedia(str, "MP3");
if (_root._player.contentPath.length>0) {
_root._player.play();
}
}
}
/*
从列表中读出当前选择的文件,取得其的 data (假设已经从数据库中读出所需资料,label 显示文件名
data 则储存的是文件的 URL)
由于将 MediaPlayback 组件设为 Autostart = false 所以需要运行 play() 方法使其开始播放
如果 Autostart = true 则一旦设置了 contentPath 属性,就立即载入并播放
*/ </td></tr></table>


Checkbox 组件:
有两个,分别用来选择是单曲循环还是列表循环。
InstanceName: _cbLoopCur 、_cbLoopAll
Action:
两者是互斥关系,选择一个就取消另一个,两个都不选就是播放选择曲目一遍,代码简单,略。

Dynamic Text 框:
有两个,虽然不是组件,但却是和 Javascript 等实现交互的关键。
Variable: varSongname 、varUrl
两个变量分别是保存外界传入的文件名和 URL 。

<table style="WIDTH: 670px; HEIGHT: 101px" height=101 cellSpacing=0 cellPadding=0 width=670 bgColor=#ffffcc border=0> <tr> <td>Tips:
在 Javascript 中,Flash 专门提供了很多接口函数,这里用到的就是设置 Flash 中变量的 SetVariable(variable_name,value) 函数;Flash 中,也提供了一个和 Javascript 交互的 ActionScript 函数 fscommand() 。</td></tr></table>


sFMP.asp(php) 文件程序逻辑:

这个的程序很简单,我就不废话,直接贴代码了,如果有不懂的,可以问我,电子邮件联络。

<table style="WIDTH: 668px; HEIGHT: 100px" height=100 cellSpacing=0 cellPadding=0 width=668 bgColor=#d3d3d3 border=0> <tr> <td>

<%
' 这是 sFMP.asp 的部分源代码,经过了一些修改,可能会包含一些错误,因为没有经过测试
' 有一些环境可能和你机器上面不同,请相应修改。
' 修改前的完整源代码是经过 Windows98 + PWS + Access 环境的测试的
' 所以使用之前请仔细检查有无拼写或其他明显错误,谢谢!

Option Explicit
Dim rsFiles, cnn, strSql, strCnn
' 使用 ADO 链接数据库,取得数据集,常规做法没什么好讲的
strCnn="Provider=Microsoft.Jet.OLEDB.4.0;Data Source="&Server.MapPath("songs.mdb")
Set cnn=Server.CreateObject("ADODB.Connection")
cnn.Open strCnn

strSql="SELECT * FROM songsInfo WHERE type='mp3' ORDER BY id DESC"
Set rsFiles=Server.CreateObject("ADODB.RecordSet")
rsFiles.CursorLocation=3
rsFiles.Open strSql,cnn,2,3

' 如果取得数据集失败则停止执行,输出错误
If TypeName(rsFiles)="Nothing" Then
Response.Write("open RecordSet error
")
Response.End()
End If
%>


以上的 ASP 的代码,其实 sFMP.php 也很简单,链接数据库换成 mysql_connect / mysql_db_query / mysql_fetch_object 相应函数 Response.Write()换成echo 就可以了。由于我的 php 页面不是使用的 Javascript 和 Flash 交互的方式(而是下面将要讲的 Flash 和 ASP(PHP) 直接交互的方式),所以没有这方面的代码,不好意思了。

add.asp(php) 的程序逻辑:

这个就更简单了,需要一个表和一段ASP(PHP)代码就搞定了:

这是 HTML 表单,包含在add.asp(php)文件中,其 action 就是指向自己

<table style="WIDTH: 667px; HEIGHT: 100px" height=100 cellSpacing=0 cellPadding=0 width=667 bgColor=#d3d3d3 border=0> <tr> <td>

这是 ASP 代码段

<table height=100 cellSpacing=0 cellPadding=0 width=600 bgColor=#d3d3d3 border=0> <tr> <td>

<%
' 这是 add.asp 的部分源代码,经过了一些修改,可能会包含一些错误,因为没有经过测试
' 有一些环境可能和你机器上面不同,请相应修改。
' 修改前的完整源代码是经过 Windows98 + PWS + Access 环境的测试的
' 所以使用之前请仔细检查有无拼写或其他明显错误,谢谢!

Dim strOutput
Dim strNameOfSong:strNameOfSong = Trim(Request.Form("name"))
Dim strUrl:strUrl = Trim(Request.Form("url"))'Server.URLEncode()

If Len(strUrl) > 0 Then
' 其中可以添加对 URL 的合法性检查,这里略去
strCnn="Provider=Microsoft.Jet.OLEDB.4.0;Data Source="&Server.MapPath("songs.mdb")
Set cnn=Server.CreateObject("ADODB.Connection")
cnn.Open strCnn

strSql="INSERT INTO songsInfo (url, name) VALUES ('"&strUrl&"','"&strNameOfSong&"')"
If IsEmpty(cnn.Execute(strSql)) Then
strOutput = "添加数据失败,可能数据库出了点问题,请联系管理员,谢谢使用!"
Else
strOutput = "添加数据成功,您可以继续添加,谢谢使用!"
End If
End If

%>

</td></tr></table>
这是 php 代码片断
<table style="WIDTH: 598px; HEIGHT: 100px" height=100 cellSpacing=0 cellPadding=0 width=598 bgColor=#d3d3d3 border=0> <tr> <td><?php
// 这是 add.php 的部分源代码,经过了一些修改,可能会包含一些错误,因为没有经过测试
// 有一些环境可能和你机器上面不同,请相应修改。
// 修改前的完整源代码是经过 Windows98 + Apache2.0 + MySQL4.0 环境的测试的
// 所以使用之前请仔细检查有无拼写或其他明显错误,谢谢!

$strNameOfSong = trim($HTTP_POST_VARS['name']);
$strUrl = trim($HTTP_POST_VARS['url']);

if ( strlen($strUrl)>0) {
// executeSql() 是自定义函数,其作用是连接数据库,返回 mysql_db_query() 的 $result
$iResult = executeSql("INSERT INTO songsInfo (url, name) VALUES ('$strUrl','$strNameOfSong')");
if (!$iResult) {
$strOutput = "Appending failed. Maybe some errors occured. Please contact Admin. Thanks for your support!";
}else{
// successfully execute
$strOutput = "The file has successfully appended. You can append another file now. Thanks for your support!";
}
}
?></td></tr></table>
以上就是通过 Javascritpt 当中间媒介,和 ASP/PHP 交互的过程,有什么问题请告诉我,谢谢!

Flash 和 ASP / PHP 的直接交互

Flash 是可以直接作为客户端请求 ASP/PHP 页面的。但是我在实验的时候发现了一个在很多这方面相关文章没有提到的问题那就是当 ASP/PHP 页面返回变量的时候,如果是中文,那么在 Flash 中会变成乱码(不知道其他版本会不会有这个问题,但是 Flash 7.0是这样的)!当时就想到可能是 URL 编码的问题,可是一直没找到解决办法,最后突然想到了会不会是 Unicode 编码的问题?一查资料,果然发现,原来 Flash 7.0 对外部变量和文本的编码是 Unicode 的!而 ASP 3.0 的编码则不是,而是使用的本地编码,所以才会出现问题。(ASP 3.0 我没找到怎么改变编码方式,ASP.net 好像默认是 Unicode 的,也可以用 gb2312 编码)所以,既然没有办法统一为 Unicode 就只好全部统一为 gb2312 了。查了 Flash 的参考,找到一个属性是可以用来设置编码的,System.useCodepage=ture; 当将其为 true 时候,使用本地编码,反之就使用 Unicode 。还有一点要注意,就是这个属性只能在开头设置一次,如果不这样,那可能导致无法预料的后果(Flash 参考上面说的)。
在这里,我的思路是:Flash 请求 ASP/PHP 页面 => ASP/PHP 查询数据库,返回数据直接写到 Flash 变量里面 => Flash 显示列表

Flash 中使用 loadVariablesNum() 函数向 ASP/PHP 发送请求,ASP/PHP 可以根据不同请求方式(POST/GET)使用不同方法获取 Flash 中的变量(就是 DynamicText 中规定的),Reqeust.QueryString() Request.Form() / $HTTP_POST_VAR() $HTTP_GET_VAR()。
ASP/PHP 返回就更容易了,只用返回形如 varSongname=songname1,songname2,songname3&varUrl=url1,url2,url3 的字符串就可以了,这里有两点要注意:1. varSongname 和 varUrl 就是 Flash 中的 Variables ,名字要一样,不然 Flash 无法解析;2. 在输出这个字符串之前千万不要输出任何其他的字符(HTTP 头当然可以,因为它写到返回的 HTML 中),任何的都不要,包括 <head> 等HTML 标签也不要。

这样就有2个文件,sFMP.htm - 由于没有动态内容,可以直接用静态页面了;requestReciever.asp(php) - 接受请求查询数据库返回字符串,sFMP.htm 没有特别要求,把 .swf 文件嵌入里面就可以了,没有需要帖出来的地方。下面就把 requestReciever.asp(php)代码帖出来:

requestReciever.asp(php) 代码:
<table height=100 cellSpacing=0 cellPadding=0 width=600 bgColor=#d3d3d3 border=0> <tr> <td>

<%
Option Explicit
' 这是 add.asp 的部分源代码,经过了一些修改,可能会包含一些错误,因为没有经过测试
' 有一些环境可能和你机器上面不同,请相应修改。
' 修改前的完整源代码是经过 Windows98 + PWS + Access 环境的测试的
' 所以使用之前请仔细检查有无拼写或其他明显错误,谢谢!

Dim rsFiles, strDisp,cnn, strSql, strCnn
' create and open a connection object
strCnn="Provider=Microsoft.Jet.OLEDB.4.0;Data Source="&Server.MapPath("songs.mdb")
Set cnn=Server.CreateObject("ADODB.Connection")
cnn.Open strCnn
' execute a SQL to create a RecordSet object
strSql="SELECT * FROM songsInfo WHERE type='"&strAsk&"' ORDER BY id DESC"
Set rsFiles=Server.CreateObject("ADODB.RecordSet")
rsFiles.CursorLocation=3
rsFiles.Open strSql,cnn,2,3
' if fails the result will be a Nothing object
If TypeName(rsFiles)="Nothing" Then
Response.Write("open RecordSet error
")
Response.End()
End If
' walkthrough the recordset and
' prepare URL/POST variables strings
Dim strName, strUrl
If rsFiles.RecordCount > 0 Then
strName = rsFiles.Fields("name")
strUrl = rsFiles.Fields("url")
rsFiles.MoveNext
Do While NOT rsFiles.EOF
strName = strName & "," &rsFiles.Fields("name")
strUrl = strUrl & "," & rsFiles.Fields("url")
rsFiles.MoveNext
Loop
End If
'response to client
Response.Write("SongName=" & Server.URLEncode(strName) & "&URL=" & strUrl)
' close the connection
' release resource
Set rsFiles = Nothing
cnn.Close()
Set cnn = Nothing
%>

</td></tr></table>

下面是 requestReciever.php 的代码

<table height=100 cellSpacing=0 cellPadding=0 width=600 bgColor=#d3d3d3 border=0> <tr> <td>

<?php

$result = executeSql("SELECT * FROM songsInfo WHERE type='$strWhere' ORDER BY id DESC");
if (!$result) {
HandleErrors(__FILE__.':Open database error.
');
}else{
// walkthrough the recordset and
// prepare URL/POST variables strings
$oRows=@mysql_fetch_object($result);
$strName = $oRows->name;
$strUrl = $oRows->url;

// response to client
while ($oRows=@mysql_fetch_object($result)){
$strName .= ",".$oRows->name;
$strUrl .= ",".$oRows->url;
}
echo "SongName=".$strName ."&URL=".$strUrl
mysql_free_result($result);
}

// close the connection
// release resource
mysql_close($id_link);
?>

</td></tr></table>
好了,已经写了好几个小时了,真的累了,有问题找我,谢谢!