本文整理自网络,侵删。
主要内容:版权声明
头像上传和编辑的原理
独立头像上传及编辑模块
一、版权声明
由于此模块核心均来自于Discuz NT,根据相关规定:"禁止在 Discuz! / UCenter 的整体或任何部分基础上以发展任何派生版本、修改版本或第三方版本用于重新分发。"
因此在开始下面的内容之前声明如下:
本程序仅为个人学习研究,不以营利为目的,如若侵犯他人利益,请发送邮件KenshinCui@hotmail.com联系作者,本人获得通知后立即删除相关内容,其他第三方下载者或使用者在使用时注意其内容版权归北京康盛新创科技有限责任公司 所有。
二、头像上传和编辑的原理
在Discuz中头像上传和编辑主要通过flash来完成,它处理了包括文件上传和裁切的主要核心工作,但是我们这里没有.fla源文件,只有.swf文件,所以要弄清其原理就必须跟踪相关的接口调用。
在此之前我们首先需要了解在Discuz中flash的页面代码是通过document.write动态生成的,其中的输出的字符串是通过调用AC_FL_RunContent()这个js方法(这个方法在common.js中)。它主要是生成相关falsh的html布局代码,结构大致如下:
代码如下:
<object width="540" height="253" id="mycamera" name="mycamera" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" >
<param name="scale" value="exactfit" />
<param name="movie" value="/images/common/camera.swf?nt=1&inajax=1&appid=67111770b37d9fc06c56e691c013b685&input=Jv5BQ48IKF4=&ucapi=http%3a%2f%2fkenshincui-pc%3a305%2ftools%2fajax.aspx" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<param name="swLiveConnect" value="true" />
<param name="allowScriptAccess" value="always" />
</object>
在上面的代码中最重要的就是movie参数,它定义了头像名称、裁切上传api路径以及flash所在路径等。
有了这些信息之后我们只需要了解相关接口调用接口,这时我们可以打开fiddler进行跟踪:
<object width="540" height="253" id="mycamera" name="mycamera" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" >
<param name="scale" value="exactfit" />
<param name="movie" value="/images/common/camera.swf?nt=1&inajax=1&appid=67111770b37d9fc06c56e691c013b685&input=Jv5BQ48IKF4=&ucapi=http%3a%2f%2fkenshincui-pc%3a305%2ftools%2fajax.aspx" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<param name="swLiveConnect" value="true" />
<param name="allowScriptAccess" value="always" />
</object>
在上面的代码中最重要的就是movie参数,它定义了头像名称、裁切上传api路径以及flash所在路径等。
有了这些信息之后我们只需要了解相关接口调用接口,这时我们可以打开fiddler进行跟踪:
在首次到达头像修改界面的时候访问了/images/common/camera.swf?nt=1&inajax=1&appid=1036681732c9187901d4693bf1ab8416&input=DCdSBXIA4rY=&ucapi=http%3a%2f%2f192.168.1.92%3a312%2ftools%2fajax.aspx
这就是上面我们说的movie参数的值,由于像input(后面我们会发现它就是头像图片的名称)等信息需要是动态设定的,所以Discuz设计的时候采用动态生成js的方法。
接着我们上传一张照片:
从跟踪可以看到访问路径/tools/ajax.aspx?m=user&inajax=1&a=uploadavatar&appid=1036681732c9187901d4693bf1ab8416&input=DCdSBXIA4rY%3D&agent=null&avatartype=null,它是主要负责处理照片上传的,其中的a参数告诉ajax.aspx执行何种操作(事实上后面我们会发现a为uploadavatar则执行上传操作),input参数同上面一样,是头像图片的名称。
相关阅读 >>
使用discuz!后台备份和恢复discuz!站点数据库的方法教程
更多相关阅读请进入《Discuz论坛》频道 >>
相关推荐
评论
管理员已关闭评论功能...
- 欢迎访问木庄网络博客
- 可复制:代码框内的文字。
- 方法:Ctrl+C。