如何上传文件与Phonegap和JqueryMobile？ [英] How to upload file with Phonegap and JqueryMobile?

问题描述

我正在使用JQM和PhoneGap构建Android移动应用。
我需要将文件（图像）上传到远程服务器（从galery或用相机拍照）。
基本上可以使用phonegap文件AP​​I，问题是服务器被写成支持简单的POST提交。

I'm building a mobile app for Android with JQM and PhoneGap. I need to upload a file (image) to remote server (from galery or take a picture with camera). Basically it can be done using phonegap file API, the problem is that the server was written to support simple POST submission.

我需要的是模拟在我的应用程序请求确切，它将从以下html表单发送。
此外，我需要获得服务器响应。

What I need is to "simulate" in my app request exact as it would sent from the following html form. In addition I need to get the server response.

<form name="myWebForm" ENCTYPE="multipart/form-data" action="http://www.myurl.com/api/uploadImage "method="post">
    <input type="file" name="image" />
    <input type="submit" value="Submit"/>       
</form>

我试图使用phonegap文件AP​​I，但是服务器端检索数据的结构不同于应该是。

I tried to use phonegap file API but the structure of the retrieved data on the server side is different than it should be.

我试图在我的应用程序中实现该表单，但选择文件按钮被禁用...

I tried to implement that form in my app but the "choose file" button was disabled...

如果不在服务器端做任何修改，如何实现？

How it can be achieved without making any changes on the server side?

推荐答案

文件。不支持。你需要这样做：

You can't use input file on Phonegap. It's not supported. You need make something like this:

    function onDeviceReady() {

        // Retrieve image file location from specified source
        navigator.camera.getPicture(uploadPhoto,
                                    function(message) { alert('get picture failed'); },
                                    { quality: 50, 
                                    destinationType: navigator.camera.DestinationType.FILE_URI,
                                    sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY }
                                    );

    }

    function uploadPhoto(imageURI) {
        var options = new FileUploadOptions();
        options.fileKey="file";
        options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1)+'.png';
        options.mimeType="text/plain";

        var params = new Object();

        options.params = params;

        var ft = new FileTransfer();
        ft.upload(imageURI, encodeURI("http://some.server.com/upload.php"), win, fail, options);
    }

    function win(r) {
        console.log("Code = " + r.responseCode);
        console.log("Response = " + r.response);
        console.log("Sent = " + r.bytesSent);
    }

    function fail(error) {
        alert("An error has occurred: Code = " + error.code);
        console.log("upload error source " + error.source);
        console.log("upload error target " + error.target);
    }

在getPicture方法中，您将选择您的文件源。查看更多资讯： http://docs.phonegap.com/en/2.1.0/ cordova_file_file.md.html＃FileTransfer

On getPicture method you will choose what's your file source. See more info: http://docs.phonegap.com/en/2.1.0/cordova_file_file.md.html#FileTransfer

编辑：

需要指定fileName扩展名，以及在text / plain格式上请求mimeType以便以文本格式发送图像。
至于params，如果你不需要他们为什么使用它们？

The fileName extension was needed specify as well as the mimeType is requested on 'text/plain' format to send image on text format. As for the params, if you don't need them why use them?

这篇关于如何上传文件与Phonegap和JqueryMobile？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！