cordova結合wavemaker手機圖片上傳實現

1.增加cordova插件

* cordova plugin add org.apache.cordova.camera

*?cordova plugin add org.apache.cordova.file

*?cordova plugin add org.apache.cordova.file-transfer

2.在cordova的config.xml配置文件中增加如下屬性

<access origin="*" />

<gap:plugin name="org.apache.cordova.file" />

<gap:plugin name="org.apache.cordova.file-transfer" />

<gap:plugin name="org.apache.cordova.camera" />

3.修改wavemaker構建出的phonegap項目中的index.html文件

<script type="text/javascript" src="phonegap.js"></script>改成如下

<script type="text/javascript" src="cordova.js"></script>

4.修改wavemakerr構建出的phonegap項目中的lib\build\Gzipped下wm_phonegap_misc.js文件

1）if(window["PhoneGap"])改成

if(window["PhoneGap"] || window["cordova"])

2）destinationType:Camera.DestinationType.DATA_URL改成

destinationType:Camera.DestinationType.FILE_URI

3）d.callback({dataValue:“data:image/jpeg;base64,”+_43}改成

d.callback({dataValue:_43}修改成FILE_URI是因為插件file-transfer上傳時需要FILE_URI

?

5,直接利用wavemaker創建一個PhoneGapCall service，operation選擇capture_picture；創建一個Button，點擊時調用這個service，將得到的圖片顯示出來；再創建一個button，點擊上傳，wavemaker的腳本如下：

?

phoneGapBrowsePictureSuccess: function(inSender, inDeprecated) {

this.tempPicture.setSource(inSender.getValue("dataValue"));

? ? ? ? this.uploadFileURL.setValue("dataValue",inSender.getValue("dataValue"));

},

phoneGapBrowsePictureError: function(inSender, inError) {

app.alert(inError);

},

?

uploadBtnClick: function(inSender) {

var fileURL=this.uploadFileURL.getValue("dataValue");

? ? ? ? app.alert(fileURL);

? ? ? ? var uri = encodeURI("http://192.168.88.126:8400/FileServer/servlet/PhoneGapFileServlet");

? ? ? ??

? ? ? ? var options = new FileUploadOptions();

? ? ? ??

? ? ? ? options.fileKey="file";

? ? ? ? options.fileName=fileURL.substr(fileURL.lastIndexOf('/')+1);

? ? ? ? options.mimeType="image/jpeg";

? ? ? ??

? ? ? ? var params = {};

? ? ? ? //params.file = fileURL; ? ? ?

?

? ? ? ? options.params = params;

?

? ? ? ? var headers={'headerParam':'headerValue'};

?

? ? ? ? options.headers = headers;

? ? ? ??

? ? ? ? var ft = new FileTransfer();

? ? ? ?

? ? ? ? ft.upload(fileURL, uri, this.win, this.fail, options);

},

? ? ?win: function(r) {

? ? ? ? app.alert("Code = " + r.responseCode);

? ? ? ? console.log("Code = " + r.responseCode);

? ? ? ? console.log("Response = " + r.response);

? ? ? ? console.log("Sent = " + r.bytesSent);

? ? },

?

? ? fail: function(error) {

? ? ? ? console.log(error);

? ? ? ? app.alert("An error has occurred: Code = " + error.code);

? ? ? ? console.log("upload error source " + error.source);

? ? ? ? console.log("upload error target " + error.target);

?

? ? },

?

6，Servlet寫法如下

package com.yonghong;

import java.io.File;

import java.io.FileOutputStream;

import java.io.IOException;

import java.io.InputStream;

import java.io.OutputStream;

import java.util.List;

?

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

?

import org.apache.commons.fileupload.DiskFileUpload;

import org.apache.commons.fileupload.FileItem;

import org.apache.commons.fileupload.FileUploadException;

import org.apache.commons.fileupload.disk.DiskFileItemFactory;

import org.apache.commons.fileupload.servlet.ServletFileUp