Hbuilder开发app实战-识岁03-文件上传
Posted liguangsunls
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Hbuilder开发app实战-识岁03-文件上传相关的知识,希望对你有一定的参考价值。
前言
做app不得不谈的问题就是文件上传。用hbuilder开发app让上传变的非常easy。
Uploader
Uploader模块管理网络上传任务,用于从本地上传各种文件到server,并支持跨域訪问操作。
通过plus.uploader可获取上传管理对象。
Uploader上传使用HTTP的POST方式提交数据,数据格式符合Multipart/form-data规范。即rfc1867(Form-based File Upload in html)协议。
很多其它内容:Uploader
代码
qiao.h.upload = function(options){ if(!options) return; var url = options.url; var filepath = options.filepath; var datas = options.datas || []; var success = options.success; var fail = options.fail; if(url && filepath){ var task = plus.uploader.createUpload(url, { method: "POST", blocksize: 204800, priority: 100 }, function(t, status){ if(status == 200){ if(success) success(t); }else{ if(fail) fail(status); } } ); task.addFile(filepath, {key: ‘file‘}); if(datas && datas.length){ for(var i=0; i<datas.length; i++){ var data = datas[i]; task.addData(data.key, data.value); } } task.start(); } };
对uploader的上传做了封装,
能够看到其核心是一个createUpload方法,创建一个Uploader对象,
创建这个对象的时候,会写好成功和失败的回调函数。
创建成功后为这个upload对象加入数据。包含要上传的文件和其它数据,
最后运行start方法開始上传。
识岁
在本zpp中。当用户选择相片或者拍照生成相片后。仅仅要点击“開始识别”button,就会运行上传操作,
代码例如以下:
// uploadImg var url,tsrc; function uploadImg(){ var src = $(‘#faceImg‘).attr(‘src‘); if(src){ beginw(); if(tsrc && tsrc == src && url){ facepp(); }else{ tsrc = src; var token = qiao.qiniu.uptoken(src); var filename = qiao.qiniu.file; qiao.h.upload({ url: ‘http://upload.qiniu.com/‘, filepath: src, datas: [ {key: ‘key‘, value : filename}, {key: ‘token‘, value : token} ], success: function(){ url = qiao.qiniu.url(); facepp(); }, fail: function(s){ showRes(‘上传文件失败:‘ + s); } }); } }else{ showRes(‘请先选择要识别的照片!‘); } }
为了防止每次点击都上传照片。所以做了一个推断。假设app中的照片src没有变化就不上传了。
否则则用封装好的qiao.h.upload进行上传。
假设上传失败则给与提示。上传成功则进行图片识别。
很多其它教程:
Hbuilder开发App实战1-识岁:http://uikoo9.com/book/detail/5
很多其它学习笔记:http://uikoo9.com/book
以上是关于Hbuilder开发app实战-识岁03-文件上传的主要内容,如果未能解决你的问题,请参考以下文章
Hbuilder开发app实战-识岁06-face++的js实现完结
HBuilder开发App教程03-定制图标,启动页以及打包