Flex上传图片等信息到数据库（二进制）,并下载显示图片

1.上传到SqlServer
功能为上传漫画至SqlServer,先上传非二进制图片信息(漫画编号,卷数,本卷图片编号),上传成功后根据返回的自增
主键再上传二进制图片.
采用FluorineFx调用RemoteObject操作数据库,上传图片则采用FileReference上传到UploadManHua.ashx

C#端远程服务类
ManHuaService.cs

using System;
using System.Collections.Generic;
using System.Text;
using System.Data;
using System.Data.SqlClient;
using FluorineFx;
using FluorineFx.AMF3;

namespace ServiceLibrary
{
    [RemotingService("man hua service"publicclass ManHuaService
    {
        [DataTableType("ServiceLibrary.ManHuaTuPian"///<summary>
//////</summary>
///<param name="ManHuaID">漫画编号</param>
///<param name="JuanShu">卷数</param>
///<param name="BenJuanTuPianXH">图片顺序号</param>
///<returns></returns>
public ManHuaTuPian GetOneManHuaTuPian(int ManHuaID, int JuanShu, int BenJuanTuPianXH)
        {
            SqlConnection con =new SqlConnection("server=.;uid=sa;pwd=;database=ManHuaLiuLan");
            con.Open();
            SqlCommand cmd =new SqlCommand("select * from ManHuaTuPian where ManHuaID="+ ManHuaID.ToString() +" and JuanShu="+ JuanShu.ToString() +" and BenJuanTuPianXH="+ BenJuanTuPianXH.ToString(), con);
            SqlDataAdapter dap =new SqlDataAdapter(cmd);
            DataTable tb =new DataTable();
            dap.Fill(tb);
            con.Close();
if (tb.Rows.Count >0)
            {
                ManHuaTuPian objManHua =new ManHuaTuPian();
                objManHua.ID =int.Parse(tb.Rows[0]["ID"].ToString());
                objManHua.ManHuaID =int.Parse(tb.Rows[0]["ManHuaID"].ToString());
                objManHua.JuanShu =int.Parse(tb.Rows[0]["JuanShu"].ToString());
                objManHua.BenJuanTuPianXH =int.Parse(tb.Rows[0]["BenJuanTuPianXH"byte[] bytes = (byte[])tb.Rows[0]["TuPian"];
                ByteArray imagebytes =new ByteArray();
                imagebytes.WriteBytes(bytes,0,bytes.Length);
                objManHua.TuPian =returnelse
returnnull///<summary>
//////</summary>
///<param name="ManHuaID">漫画编号</param>
///<param name="JuanShu">卷数</param>
///<param name="BenJuanTuPianXH">本卷图片序号</param>
///<returns>插入成功记录的自增主键</returns>
publicint InsertManHua(int ManHuaID,int JuanShu,int BenJuanTuPianXH)
        {
            SqlConnection con =new SqlConnection("server=.;uid=sa;pwd=;database=ManHuaLiuLan");
            con.Open();
            SqlCommand cmd =new SqlCommand();
            cmd.Connection = con;
            cmd.CommandText ="insert into ManHuaTuPian(ManHuaID,JuanShu,BenJuanTuPianXH) values(@ManHuaID,@JuanShu,@BenJuanTuPianXH)\r\nselect scope_identity()";
            SqlParameterCollection sqlParams = cmd.Parameters;
            sqlParams.Add("@ManHuaID", SqlDbType.Int);
            sqlParams.Add("@JuanShu", SqlDbType.Int);
            sqlParams.Add("@BenJuanTuPianXH", SqlDbType.Int);
            sqlParams[0].Value = ManHuaID;
            sqlParams[1].Value = JuanShu;
            sqlParams[2].Value =int identityID;
            identityID =int.Parse(cmd.ExecuteNonQuery().ToString());
            con.Close();
            con.Dispose();
return///<summary>
//////</summary>
///<param name="ID">漫画图片编号</param>
///<param name="imagebytes">二进制图片字节数组</param>
///<returns>成功返回true,失败返回false.</returns>
publicvoid UpdateManHuaTuPian(int ID, byte[] imagebytes)
        {
            SqlConnection con =new SqlConnection("server=.;uid=sa;pwd=;database=ManHuaLiuLan");
            con.Open();
            SqlCommand cmd =new SqlCommand("update ManHuaTuPian set TuPian=@TuPian where ID=@ID", con);
            cmd.Parameters.Add(new SqlParameter("@TuPian", imagebytes));
            cmd.Parameters.Add(new SqlParameter("@ID", ID));
            cmd.ExecuteNonQuery();
            con.Close();
            con.Dispose();
        }
    }

}

1.上传二进制和其它信息到数据库

上传界面
UploadManHua.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12">
<mx:RemoteObject id="ManHuaService" destination="fluorine" source="ServiceLibrary.ManHuaService">
<mx:method name="InsertManHua" result="InsertManHua_onResult(event)" fault="InsertManHua_onFault(event)">
</mx:method>
</mx:RemoteObject>
<mx:Script>
<![CDATA[
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
            private var fileRef:FileReference = new FileReference();
            private function insertManHua(evt:MouseEvent):void
            {
                ManHuaService.InsertManHua(int(txtManHuaID.text),int(txtJuanShu.text),int(txtBenJuanTuPianXH.text));
            }
            private function InsertManHua_onResult(evt:ResultEvent):void
            {
                var identityID:int = int(evt.result);
                lblIdentityID.text = identityID.toString();
            }
            private function InsertManHua_onFault(evt:FaultEvent):void
            {
                Alert.show("插入失败！");
            }
            private function pickfile():void{
                 var imageTypes:FileFilter = new FileFilter("图片 (*.jpg, *.jpeg)", "*.jpg;*.jpeg;");
                 var allTypes:Array = new Array(imageTypes);
                 fileRef.addEventListener(Event.SELECT, selectHandler);
                 fileRef.addEventListener(Event.COMPLETE, completeHandler);
                 fileRef.addEventListener(IOErrorEvent.IO_ERROR,ioerrorHandler);
                 fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);
                 fileRef.addEventListener("ioError", ioerrorHandler);
                 try{
                     var success:Boolean = fileRef.browse(allTypes);
                 }catch (error:Error){
                     trace("Unable to browse for files."+error.toString());
                 }
             }

             private function ioerrorHandler(event:Event):void{
                 trace("Unable to upload file."+event.toString());
             }
             private function progressHandler(event:ProgressEvent):void{
                 lblText.text = " 已上传 " + (event.bytesLoaded/1024).toFixed(2)+ " K，共 " + (event.bytesTotal/1024).toFixed(2) + " K";
                var proc: uint = event.bytesLoaded / event.bytesTotal * 100;
                lbProgress.setProgress(proc, 100);
                lbProgress.label= "当前进度: " + " " + proc + "%";

             }
             private function selectHandler(event:Event):void{
                txtPath.text = fileRef.name;
             }
             private function completeHandler(event:Event):void{
                 Alert.show("上传成功");
             }

             private function upload(evt:MouseEvent):void
             {
                 var request:URLRequest = new URLRequest("http://localhost:8012/UploadManHua.ashx");
                 var variables:URLVariables = new URLVariables();
                 variables.ID = int(lblIdentityID.text);
                 request.data = variables;
                try
                {
                    fileRef.upload(request);
                }
                catch (error:Error)
                {
                    trace("Unable to upload file."+error.toString());
                }
             }
]]>
</mx:Script>
<mx:Label x="44" y="10" text="漫画ID：" fontSize="12"/>
<mx:TextInput x="107" y="10" id="txtManHuaID" text="1"/>
<mx:Label x="58" y="40" text="卷数：" fontSize="12"/>
<mx:TextInput x="107" y="40" id="txtJuanShu" text="1"/>
<mx:Label x="10" y="70" text="本卷图片序号：" fontSize="12"/>
<mx:TextInput x="107" y="70" id="txtBenJuanTuPianXH"/>
<mx:Label x="58" y="138" text="图片：" fontSize="12"/>
<mx:TextInput x="107" y="134" id="txtPath"/>
<mx:Button x="275" y="134" label="浏览" fontSize="12" click="pickfile()"/>
<mx:Button x="335" y="134" label="上传" fontSize="12" click="upload(event)"/>
<mx:ProgressBar id="lbProgress" x="10" y="162" width="457" themeColor="#F20D7A" minimum="0" mode="manual" maximum="100" label="当前进度: 0%" styleName="myfont" fontWeight="normal"/>
<mx:Label id="lblText" x="10" y="198"/>
<mx:Button x="107" y="100" label="确认" fontSize="12" click="insertManHua(event)"/>
<mx:Label x="179.5" y="106" text="记录自增主键：" fontSize="12"/>
<mx:TextInput x="276.5" y="102" id="lblIdentityID" width="50.5"/>
</mx:Application>

用于上传C#的ashx,接收文件流,把文件流转换为字节数组byte[],传入ManHuaService进行上传到数据库中.
UploadManHua.ashx:

<%@ WebHandler Language="C#" Class="UploadManHua"%>

using System;
using System.Web;
using System.Data.SqlClient;
using System.IO;

publicclass UploadManHua : IHttpHandler {

privatestring uploadFolder ="UpLoad"publicvoid ProcessRequest (HttpContext context) {
        context.Response.ContentType ="text/plain"//上传文件至SqlServer
        HttpFileCollection files =if (files.Count >0string path = context.Server.MapPath(uploadFolder);
            HttpPostedFile file = files[0if (file !=null&& file.ContentLength >0//string savePath = path + "/" + context.Request.Form["fileName"];
//file.SaveAs(savePath);
= file.InputStream;
                Byte[] imagebytes =newbyte[fs.Length]; 
                BinaryReader br =new System.IO.BinaryReader(fs);
                imagebytes = br.ReadBytes(Convert.ToInt32(fs.Length));
string strID = context.Request.Params["ID"trynew ServiceLibrary.ManHuaService().UpdateManHuaTuPian(int.Parse(strID), imagebytes);               
                    context.Response.Write("成功"catch
                {
                    context.Response.Write("失败");
                }
            }
        }
else
        {
            context.Response.Write("参数错误");
            context.Response.End();
        }

    }

publicboolgetreturnfalse

2.读取SqlServer的二进制图片
C#端用FluorineFx.AMF3.ByteArray保存二进制对象,使用Flex端的ByteArray进行接收,并显示在图片中.图片使
用了网友的ByteArrayImage类(继承自mx.controls.Image).

C#端读取数据库记录,将读出的二进制由byte[]转换成ByteArray.

漫画图片实体类 ManHuaTuPian.cs

using System;
using System.Collections.Generic;
using System.Text;
using FluorineFx.AMF3;

namespacepublicclassprivateintprivateintprivateintprivateintprivatepublicintsetthis._ID =getreturnthispublicintsetthis._ManHuaID =getreturnthis._ManHuaID;
            }
        }

publicintsetthis._JuanShu =getreturnthis._JuanShu;
            }
        }

publicintsetthis._BenJuanTuPianXH =getreturnthis._BenJuanTuPianXH;
            }
        }

publicsetthis._TuPian =getreturnthis._TuPian;
            }
        }
    }
}

用于显示二进制图片的组件类 ByteArrayImage
ByteArrayImage.as

packageimportimportimport flash.system.LoaderContext;
importimportpublicclass ByteArrayImage extendsprivate var _loader:Loader =newpublic function Image():voidprotected function createChildren():void
        {
            addChild(_loader);
        }

public function loadBytes(bytes:ByteArray,context:LoaderContext=null):void
        {
            _loader.loadBytes(bytes, context);
            _loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onBytesLoaded);
        }

private function onBytesLoaded(e:Event):voidthis.width =this.height = e.target.height;
        }
    }
}

调用显示二进制图片,这里使用ByteArrayImage

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="*" xmlns:ns2="customComp.*">
<mx:RemoteObject id="ManHuaService" destination="fluorine" source="ServiceLibrary.ManHuaService">
<mx:method name="GetOneManHuaTuPian" result="GetOneManHuaTuPian_onResult(event)">
</mx:method>
</mx:RemoteObject>
<mx:Script>
<![CDATA[
            import mx.messaging.AbstractConsumer;
            import customComp.ByteArrayImage;
            import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
            internal function onClick(evt:MouseEvent):void{
                ManHuaService.GetOneManHuaTuPian(1,1,1);
            }
            internal function GetOneManHuaTuPian_onResult(evt:ResultEvent):void{
                var objManHuaTuPian:Object = evt.result;            
                var arrImage:ByteArray = new ByteArray();
                arrImage = objManHuaTuPian.TuPian;
                img.loadBytes(arrImage);                    
            }
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Button" click="onClick(event)"/>
<ns2:ByteArrayImage x="220" y="40" id="img"/>
</mx:Application>