通过jquery / ajax仅使用图像路径上传图像

时间:2014-02-05 19:24:47

标签: jquery ajax cordova

正在使用Phonegap应用程序。其中一部分需要通过Ajax上传文本和图像文件。

独立测试了Ajax文件上传,当与input type = file一起使用时似乎有效。但我们可以只使用机器上的路径上传文件。

这个想法实际上是使用Phonegap API让用户从设备中获取/选择图像并返回其FILE URI。

 so can we use the file URI  to upload the file via ajax.

任何帮助表示感谢。

2 个答案:

答案 0 :(得分:0)

PhoneGap有一个FileTransfer API,可让您将文件上传到只有文件名的服务器。

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

此处的完整文档... http://docs.phonegap.com/en/3.3.0/cordova_file_file.md.html#FileTransfer

答案 1 :(得分:0)

选择了答案,因为它似乎提供了所需的信息。但是,为了便于获取信息,最终使用的是HTML 5文件API。代码如下:

                <label for="imagefile">
                    <img src="../../images/businessapp/no-image.png" title="choose image" id="buisnessimage" />
                </label>
                <input type="file" id="imagefile" style="display:none;" />

javascript / jquery如下:

$("#imagefile").change(function(){
    var reader = new FileReader();

    var file = $("#imagefile").prop('files')[0];

    reader.onload = function(e){
        var dataurl  = reader.result;
        $("#buisnessimage").prop('src', dataurl);
    }

    reader.readAsDataURL(file);
});

要上传,FormData的使用方法如下:

var form = new FormData();

form.append('name', $("#BusinessName").val());
form.append('Email', $("#Email").val());
form.append('address', $("#Address").val());
form.append('phone', $("#BusinessPhone").val());
form.append('city', $("#City").val());
form.append('state', $("#State").val());
form.append('website', $("#Website").val());
form.append('logo', $("#imagefile").prop('files')[0]);

AJAX选项如下:

url: <url>;
    type: "POST",
    data: form,
    dataType: 'json',
    contentType: false,
    processData: false,

希望它可以帮助某人:)