ASP.NET独立Discuz头像编辑模块分离打包

主要内容：版权声明：上传编辑头像原则；独立模块上传编辑头像I版权声明：由于本模块核心来自Discuz NT，根据相关规定：‘禁止在Discuz使用！/在ucenter的全部或任何部分的基础上，开发任何派生版本、修改版本或第三方版本以进行再分发。因此，在开始以下内容之前，声明如下：本节目仅供个人学习和研究，不牟利。如侵犯他人利益，请发邮件【emailprotected】联系作者，我会在接到通知后立即删除相关内容。其他第三方下载者或用户在使用时应注意其内容的版权。二、头像上传和编辑的原理在Discuz中，头像上传和编辑主要是通过flash完成的，处理的主要核心工作包括文件上传和剪切，但是我们没有。这里只有fla源文件。swf文件，所以要了解它的原理，我们必须跟踪相关的接口调用。在此之前，我们需要知道Discuz中flash的页面代码是由document.write动态生成的，输出字符串称为js方法AC_FL_RunContent()(这个方法在common.js中是通用的)。主要生成相关falsh的html布局代码，结构大致如下：复制的代码如下：对象宽度=' 540 '高度=' 253 ' id=' my camera ' name=' my camera ' id=' clsid 3360d 27 CDB 6 e-ae6d-11cf-96 b8-444553540000 ' param name。=' scale ' value=' exact fit '/param name=' movie ' value='/images/common/camera . swf？nt=1 inajax=1 ppid=67111770 b 37d 9 fc 06 c 56 e 691 c 013 b 685 input=jv5bq 48 ikf 4=ucapi=http://kenshincui-PC:305/tools/Ajax . aspx '/Param name=' quality ' value=' high '/Param name=' bgcolor ' value=' # ffffffff '/Param name=' wmode ' value=' transparent '/Param name=' menu ' value='有了这些信息，我们只需要知道相关的接口就可以调用接口了。这时我们可以打开提琴手进行追踪：。

刚到头像修改界面的时候访问过/images/common/camera.swf。nt=1 inajax=1 PID=1036681732 c 9187901d 4693 BF 1a b 8416 input=dcdsbxia4ry=ucapi=http://192 . 168 . 1 . 92:312/tools/Ajax . aspx这是上面提到的movie参数的值，因为它像input。然后我们上传一张照片：。

您可以从跟踪中看到访问路径/tools/ajax.aspx。m=userinajax=1a=uploadavataraid=1036681732 c 9187901d 4693 BF 1a b 8416 input=dcdsbxia 4ry=agent=nullavaartype=null，主要负责处理照片上传。a参数告诉ajax.aspx该怎么做(其实后面我们会发现a是uploadavatar，然后会执行上传操作)，输入的参数是头像图片的名称如上。然后我们切：。

从Fiddler中，我们可以看到请求路径是/tools/ajax.aspx？m=userinajax=1a=rectavatarapid=1036681732 c 9187901d 4693 BF 1a b 8416 input=dcdsbxia4ry=agent=nullavaartype=null，这意味着参数a已经变成了rectavatar，其他信息与之前的操作基本一致。经过分析，我们可以看出这一步对应的是切割和保存操作。通过以上分析，我们可以大致了解Discuz中整个头像上传编辑功能的原理。我们发现代码实现部分主要是ajax.aspx，所以可以打开这个页面进行修改，去掉与Discuz自己业务无关的东西，形成一个独立的小部件。3.独立的头像上传编辑模块经过以上分析，我们独立上传模块并不算太难。首先，我们可以将ajax.aspx从与特定业务相关的代码中分离出来，只保留上传和保存操作，并将其路径设计为可配置的。其次，我们可以将动态生成flash布局代码的方式改为静态，因为其他参数对我们来说并不重要，只是保存图片的名称。在这个过程中，我们可以将网络路径设置为处理后动态获取(它最初是在Discuz中安装后被设置为死的)。最后，我们可以将flash及其相关文件复制到项目中，其中包括在许多国家使用的locale.xml和除此之外的本地跨域文件crossdomain.xml。swf文件。好了，说了这么多，我们来看看如何使用我们的独立模块。首先，这个独立头像编辑模块的目录结构如下：。

使用时，只需将bin中的PhotoEditor.dll复制到网站的bin目录中即可；放十字架。把Js、Ajax.aspx、photoEdit.htm、js目录和images目录放在网站根目录下，然后在Web.config中添加如下配置：复制代码如下： addkey=' imagepath ' value=' images '/！-图片存储的相对路径-addkey=' tempfile path ' value=' images/upload '/！-上传临时文件路径-addkey=' image size '值=' all'/！-支持大、中、小三种图片尺寸。如果用三种，配置全是——当然图片路径，也就是生成的照片路径，可以根据情况修改。使用时只需在photoEdit.js中调用SetPhotoName()传递图片名称(可以通过后两个参数设置flash存储路径和Ajax.aspx地址):复制的代码如下： script type=' text/JavaScript ' language=' JavaScript ' SetPhotoName(' yukogura ')；/script另外，SetPhotoName()方法有两个可选参数，即flash文件的路径和用于上传和剪切的Ajax.aspx的路径。换句话说，这两条路径可以随意放置。我们来看看实际效果(通过‘拍照’上传和编辑照片的截图类似，不再是截图):上传一张照片：。

执行切割操作：

裁剪后生成三种图片：。

包下载