nutz实现文件上传

目前需要实现一个文件上传的功能，由于后台使用了nutz这个框架，所有实现的文件上传跟spring mvc有所不同，只是文件的上传，并没有实现图片的预览，插件可以有图片预览的功能。

插件

前端使用了文件上传的插件，插件的地址是：（https://github.com/codler/jQuery-Ajax-Upload）
下载插件后放到项目目录下，在前端引入该插件。

效果图

Paste_Image.png

使用方法

1、首先在nutz配置upload.js，主要是用于加载文件的操作，具体可以查看nutz官网，
upload.js文件放在项目的resources目录下，主要配置临时文件的目录，临时文件的大小等。

var ioc = {
    tmpFilePool : {
        type : 'org.nutz.filepool.NutFilePool',
        // 临时文件目录，也可以配置大小，如： args : [ "D:/data/log"，1000]
        args : [ "D:/data/log"]   
    },
    uploadFileContext : {
        type : 'org.nutz.mvc.upload.UploadingContext',
        singleton : false,
        args : [ { refer : 'tmpFilePool' } ],
        fields : {
            // 是否忽略空文件, 默认为 false
            ignoreNull : true,
            // 单个文件最大尺寸(大约的值，单位为字节，即 1048576 为 1M)
            maxFileSize : 62914560,
            // 正则表达式匹配可以支持的文件名
            //nameFilter : '^(.+[.])(gif|jpg|png)$' 
        } 
    },
    myUpload : {
        type : 'org.nutz.mvc.upload.UploadAdaptor',
        singleton : false,
        args : [ { refer : 'uploadFileContext' } ] 
    }
}

2、后台实现文件的操作，tempFile可以获取文件的大小，文件的名字，可以对文件进行操作，answerId是前端form表单的其他参数，可以用来做一些额外的操作。@AdaptBy主要是说明接口是用于文件操作的，其中args的参数就是我们在upload.js中配置的。

@At("/upload")
@AdaptBy(type = UploadAdaptor.class, args = { "ioc:myUpload" })
@Ok("raw:json")
public String upload(@Param("uploads")TempFile tf,@Param("answerId")String answerId){
        Map map = new HashMap<>();
        if(tf == null || "".equals( tf ) || answerId == null || "".equals( answerId )){
            map.put( "result", "上传失败!" );
            return Json.toJson( map );
        }
        try {
            System.out.println(tf.getSubmittedFileName());
            System.out.println(tf.getSize());
            String[] postfix = tf.getSubmittedFileName().split("\\.");
            String path = "D:\\data\\temp\\";
            File temp = new File( path );
            if(!temp.exists()){
                temp.mkdirs();
            }
            tf.write( temp.getPath() + "\\" + answerId + "." + postfix[postfix.length - 1] );
            tf.delete();
            map.put( "result", "上传成功!" );
        }
        catch( Exception e ) {
            e.printStackTrace();
            map.put( "result", "上传失败!" );
        }
        return Json.toJson( map );
    }

3、前端的实现，前端使用了bootstarp和angularjs框架，form表单里就是要上传的文件。

注意事项

1、在前端进行ajax请求的时候记得加上dataType:'json'，这句话，主要是用于告诉前端接受的数据是json数据。
2、后台接口需要加上@Ok("raw:json")这句话，主要是用于后台返回json数据，在nutz官网中有说明。

![Uploading Paste_Image_154950.png . . .]

参考资料

1、nutz官网（http://www.nutzam.com/core/mvc/file_upload.html）