ITOO--导入图片（MongoDB）

初次做ITOO这个项目，我的任务是实现导入图片（MongoDB）功能，咱们先来熟悉一下它的界面吧。

我们的目的是点击添加文件，上传，提示上传成功！

这是上传成功的界面：

 

可是刚一开始接手，总要弄清这代码是怎么运行的，相关代码在哪里找？他们之间是如何传值的？

于是，调试。。。

我们来看看后台代码吧：

1.点击上传，首先进入MongodbHelpController：

<span style="font-size:18px;">            //上传文件            publicvoid Upload()            {                try                {                    //设置一次只上传一个文件，值为File                    //设置上传多个文件，值为Filedata；                    HttpPostedFileBase file = (HttpPostedFileBase)Request.Files["Filedata"];                    //获取文件                    int nFileLen =file.ContentLength;                     MongoGridFSSettings fsSetting = newMongoGridFSSettings() { Root =fileTable };                    MongoGridFS fs = newMongoGridFS(DB, fsSetting);                     byte[] myData = newByte[nFileLen];                   file.InputStream.Read(myData, 0, nFileLen);                    //调用Write、WriteByte、WriteLine函数时需要手动设置上传时间                    //通过Metadata添加附加信息                    MongoGridFSCreateOptions option = newMongoGridFSCreateOptions();                    option.UploadDate = DateTime.Now;                     //创建文件，文件并存储数据                    using (MongoGridFSStream gfs =fs.Create(file.FileName, option))                    {                        gfs.Write(myData, 0,nFileLen);                        gfs.Close();                    }                }                catch (Exception e)                {                    Response.Write(0);                }                Response.End();            }</span>

2.然后获取前台页面action值，根据获取的action，采取对文件的操作：

<span style="font-size:18px;">            publicvoid ProcessRequest()            {                Init();//initialize themongo                //获取前台页面的action值                string action =Request.Form["action"];                switch (action)                {                    case"LIST": GetFileList(); break; //获取文件列表                    case"UPLOAD": Upload(); break; //上传文件                    case"DELETE": Delete(); break;//删除文件                    case"DOWNLOAD": DownFile(); break; //下载文件                }            }</span>

这里是上传，所以action值为UPLOAD。

这个上传和我们以前所做的东西不太一样，这个是用了一个叫MongoDB的插件uploadify实现的，在ITOO中代码这样表示：

Cshtml中：

<span style="font-size:18px;">//引用mongo批量上传的插件    <linkhref="../Scripts/uploadify-v3.1/uploadify.css"rel="stylesheet">    <scriptsrc="../../Scripts/uploadify-v3.1/jquery.uploadify-3.1.min.js"></script><scriptsrc="../Content/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script></span>

 核心代码：

<span style="font-size:18px;">           //上传文件到Mongo           $("#file_upload").uploadify({               'auto': false,  //是否自动上传               'buttonText': '添加文件',  //按钮显示文本               'successTimeout': 99999,  //成功等待时间               'swf': '../../Scripts/uploadify-v3.1/uploadify.swf',  //uploadify路径               'uploader': '/MongodbHelp/ProcessRequest',  //定义服务器端上传数据处理脚本文件swf的路径               'multi': true,  //允许选择多个文件               'fileSizeLimit': '1600MB',   //文件最大的大小               'queueSizeLimit': 10,  //一次最多可选择的文件数量               'progressData': 'speed',  //上传文件显示的样式，进度条               'onSelectError': function (file, errorCode,errorMsg) {  //出错提示                   switch (errorCode) {                       case -100:                           alert("上传的文件数量已经超出系统限制的" + jQuery('#file_upload').uploadify('settings', 'queueSizeLimit') + "个文件！");                           break;                       case -110:                           alert("文件[" +file.name + "]大小超出系统限制的" + jQuery('#file_upload').uploadify('settings', 'fileSizeLimit') + "大小！");                           break;                       case -120:                           alert("文件[" +file.name + "]大小异常！");                           break;                       case -130:                           alert("文件[" +file.name + "]类型不正确！");                           break;                   }               },               'onQueueComplete': function (queueData) {  //所有文件被处理完成时触发该事件                   getFiles();                   alert("文件上传成功！");                              return;               },                        },            });            //上传按钮           $("#upload").click(function () {                $("#file_upload").uploadify('settings', 'formData', { 'action': 'UPLOAD' });//先传递动态值               $("#file_upload").uploadify('upload', '*');//后上传           });</span>

这是一些基本代码，在实现过程中遇到的问题：点击上传按钮没反应。

找师姐上网查了好多，终于在一片简短的博客中找到了问题所在，原来是因为浏览器没有安装Flash插件，找到这个问题，我们把代码加到了

<span style="font-size:18px;">$("#file_upload").uploadify下，具体如下：</span>

<span style="font-size:18px;">'onFallback':function(){ //Flash无法加载错误  alert("您未安装FLASH控件，无法上传！请安装FLASH控件后再试。"); </span>

这样在以后上线后，如果遇到同样的问题就不会点不动了。

拓展：

关于uploadify，它是一种上传MongoDB的插件，是封装好的，他里面有一些属性，具体请参见uploadify参数设置，事件，方法，函数详解

总结：

刚开始对ITOO的框架学习了一些，之前师哥讲过这样一节课，第二遍学习轻松多了，对这些东西了解之后，开始做分配的任务轻松了很多，调试代码很快就能找到问题，不懂就问吧，每个人接受一个新东西之前都很迷茫，只要相信自己，慢慢就会领悟，加油吧！ITOO正在进行中。。。