Cordova XMLHttpRequest PHP上传

我正在使用Cordova,并尝试通过PHP脚本将音频文​​件上传到我的服务器。 </ p>

我正在处理这个例子</ p>

  https://cordova.apache.org/blog/2017/10/18/  from-filetransfer-to-xhr2.html 
</ code> </ pre>

示例代码建议将读入的文件对象作为blob传递。 </ p>

  reader.onloadend = function(){
//基于FileReader“result”创建一个blob,我们要求将其作为ArrayBuffer
var blob =检索 new Blob([new Uint8Array(this.result)],{type:“image / png”});
var oReq = new XMLHttpRequest();
oReq.open(“POST”,“http://mysweeturl.com / upload_handler“,true);
oReq.onload = function(oEvent){
// all done!
};
//将blob传递给XHR的send方法
oReq.send(blob);
};
</ code> </ pre>

我修改了代码,将其作为数据对象附加,因为没有创建文件</ p>

   window.resolveLocalFileSystemURL(fileSystem,function(dir){

dir.getFile(fileName,{create:true},function(fileEntry){

fileEntry.file(function(file){

var reader = new FileReader();

reader.onloadend = function(){

var data = new FormData();

var oReq = new XMLHttpRequest();
oReq.open(“POST”,“ http://mywebsite.com/up.php“,true);

var blob = new Blob([new Uint8Array(this.result)],{type:”audio / mpeg“ };;
data.append('fileToUpload',blob);

oReq.onload = function(oEvent){
// all done!

};
//将blob传递给XHR send method
oReq.send(data);

};

//将文件读取为ArrayBuffer
reader.readAsArrayBuffer(文件);

}

...
</ code> </ pre>

我的php </ p>

  $ target_dir = $ _SERVER ['DOCUMENT_ROOT']。  “/ uploads /”; 
$ target_file = $ target_dir。 basename($ _ FILES [“fileToUpload”] [“name”]);

if(move_uploaded_file($ _ FILES [“fileToUpload”] [“tmp_name”],$ target_file)){
// echo“uploaded”;

} else {
// echo“error”;
}
</ code> </ pre>


  • 我确认我有读/写权限。< / li>
  • 我已经确认我可以使用标准的html表单和上面的php脚本上传测试音频文件。 </ li>
  • 我检查了我的vhost错误日志和Apache系统日志,但没有看到任何错误。 我可以看到POST正在进行但没有错误消息。 </ li>
  • 我已经确认Cordova获取的文件对象是准确的并且确实存在。 </ li>
  • 我尝试了几种不同的mime类型,但没有任何效果</ li>
    </ ul>

    任何帮助都将不胜感激。 </ p>

    谢谢</ p>
    </ div>

展开原文

原文

I am working with Cordova, and am trying to upload an audio file to my server through a PHP script.

I am working off of this example

https://cordova.apache.org/blog/2017/10/18/from-filetransfer-to-xhr2.html

The example code suggests to pass the read-in file object as a blob.

reader.onloadend = function() {
// Create a blob based on the FileReader "result", which we asked to be retrieved as an ArrayBuffer
var blob = new Blob([new Uint8Array(this.result)], { type: "image/png" });
var oReq = new XMLHttpRequest();
oReq.open("POST", "http://mysweeturl.com/upload_handler", true);
oReq.onload = function (oEvent) {
// all done!
};
// Pass the blob in to XHR's send method
oReq.send(blob);
};

I have modified the code to attach it as a data object as the file isn't being created

window.resolveLocalFileSystemURL(fileSystem, function (dir) {

dir.getFile(fileName, {create: true}, function (fileEntry) {

fileEntry.file(function (file) {

var reader = new FileReader();

reader.onloadend = function() {

var data = new FormData();

var oReq = new XMLHttpRequest();
oReq.open("POST", "http://mywebsite.com/up.php", true);

var blob = new Blob([new Uint8Array(this.result)], { type: "audio/mpeg" });
data.append('fileToUpload', blob );

oReq.onload = function (oEvent) {
// all done!

};
// Pass the blob in to XHR's send method
oReq.send(data);

};

// Read the file as an ArrayBuffer
reader.readAsArrayBuffer(file);

}

...

My php

$target_dir = $_SERVER['DOCUMENT_ROOT'] . "/uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);

if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
//echo "uploaded";
} else {
//echo "error";
}
  • I have confirmed I have read/write privileges.
  • I have confirmed I can upload the test audio file using a standard html form and the above php script.
  • I have checked my vhost error logs and Apache system logs and have not seen any errors. I can see the POST being made but no error messages.
  • I have confirmed the file object obtained by Cordova is accurate and does exist.
  • I have tried several different mime types with no effect

Any help would be much appreciated.

Thanks

1个回答



试试这个。</ p>

 &lt;?php 
print_r($ _ FILES) ;
$ new_image_name =“YEAH.jpg”;
move_uploaded_file($ _ FILES [“file”] [“tmp_name”],“/ var / www / TEST /”。$ new_image_name);
n?&gt;
</ code> </ pre>

js code </ p>

 &lt; script type =“text / javascript”charset =“utf-8”&gt;  

//等待PhoneGap加载
document.addEventListener(“deviceready”,onDeviceReady,false);

// // PhoneGap准备就绪
函数onDeviceReady(){
console.log(“设备就绪”) );
//在这里做很酷的事情......
}

函数getImage(){
//从指定的源中检索图像文件位置
navigator.camera.getPicture(uploadPhoto,function(message){

alert('get picture failed');
},{
quality:50,
destinationType:navigator.camera.DestinationType.FILE_URI,
sourceType:navigator.camera.PictureSourceType.PHOTOLIBRARY
}
);

}

功能uploadPhoto (imageURI){
var options = new FileUploadOptions();
options.fileKey =“file”;
options.fileName = imageURI.substr(imageURI.lastIndexOf('/')+ 1);
options。 mimeType =“image / jpeg”;

var params = new Object();
params.value1 =“test”;
params.value2 =“param”;

options.params = params;

options.chunkedMode = false;

var ft = new FileTransfer();
ft.upload(imageURI,“http://some.server.com/TEST/upload.php”,win,fail, 选项);
}

函数win(r){
console.log(“Code =”+ r.responseCode.toString()+“
”);
console.log(“Response =” + r.response.toString()+“
”);
console.log(“Sent =”+ r.bytesSent.toString()+“
”);
alert(“Code Slayer !!! “);
}

函数失败(错误){
alert(”发生错误:代码=“+ error.code);
}

&lt; / script&gt;
</ code > </ pre>
</ div>

展开原文

原文

try this.

<?php
   print_r($_FILES);
   $new_image_name = "YEAH.jpg";
   move_uploaded_file($_FILES["file"]["tmp_name"], "/var/www/TEST/".$new_image_name);
?>

js code

<script type="text/javascript" charset="utf-8">

// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);

// PhoneGap is ready
function onDeviceReady() {
    console.log("device ready");
    // Do cool things here...
}

function getImage() {
    // 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);
    options.mimeType="image/jpeg";

    var params = new Object();
    params.value1 = "test";
    params.value2 = "param";

    options.params = params;
    options.chunkedMode = false;

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

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

function fail(error) {
    alert("An error has occurred: Code = " + error.code);
}

</script>

dscss8996
dscss8996 谢谢你的帖子。 但是,您发布的解决方案已经过折旧,不再受cordova或phonegap的支持(现在已经有一段时间了)。 此示例也是用于获取图像并使用navigator.camera.getPicture而不是通过我提到的文件对象(如当前版本支持)
一年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问