我正在开发离线聊天应用程序,用户可以在其中上传照片作为其消息的一部分.我正在寻找一种将图像上传到我的webhost服务器的方式,以便稍后通过URL检索.
问题是我无法让它上传到我的网络服务器.
我正在使用这两个插件:
> org.apache.cordova.file-transfer
> cordova插件相机
当我在xcode模拟器中运行应用程序并从设备照片库中选择一个图片时,控制台给我以下消息:
文件传输完成响应码200
> void SendDelegateMessage(NSInvocation *):等待10秒后,委托(webView:runJavaScriptAlertPanelWithMessage:initiateByFrame :)无法返回.主运行循环模式:kcfRunLoopDefaultMode>
>成功:“”
这是我目前使用的代码:
app.controller('HomeController',function($rootScope,$scope,$cordovaCamera,$ionicActionSheet,$cordovaFileTransfer){ ...
// open PhotoLibrary
$scope.openPhotoLibrary = function() {
var options = {
quality: 100,destinationType: Camera.DestinationType.FILE_URI,sourceType: Camera.PictureSourceType.PHOTOLIBRARY,allowEdit: true,encodingType: Camera.EncodingType.JPEG,popoverOptions: CameraPopoverOptions,savetoPhotoAlbum: false
};
$cordovaCamera.getPicture(options).then(function(imageData) {
//console.log(imageData);
//console.log(options);
var url = "http://mydomein.com/upload.PHP";
//target path may be local or url
var targetPath = imageData;
var filename = targetPath.split("/").pop();
var options = {
fileKey: "file",fileName: filename,chunkedMode: false,mimeType: "image/jpg"
};
$cordovaFileTransfer.upload(url,targetPath,options).then(function(result) {
console.log("SUCCESS: " + JSON.stringify(result.response));
alert("success");
alert(JSON.stringify(result.response));
},function(err) {
console.log("ERROR: " + JSON.stringify(err));
alert(JSON.stringify(err));
},function (progress) {
// constant progress updates
$timeout(function () {
$scope.downloadProgress = (progress.loaded / progress.total) * 100;
})
});
},function(err) {
// error
console.log(err);
});
}
这是我的upload.PHP文件:
<?PHP // move_uploaded_file($_FILES["file"]["tmp_name"],$cwd . '/files/images/'); move_uploaded_file($_FILES["file"]["tmp_name"],"/files/images"); ?>
解决方法
经过一些挖掘,很多的尝试,我终于得到它的工作.
这是我想出的代码:
// open PhotoLibrary
$scope.openPhotoLibrary = function() {
var options = {
quality: 50,savetoPhotoAlbum: false
};
$cordovaCamera.getPicture(options).then(function(imageData) {
//console.log(imageData);
//console.log(options);
var image = document.getElementById('tempImage');
image.src = imageData;
var server = "http://yourdomain.com/upload.PHP",filePath = imageData;
var date = new Date();
var options = {
fileKey: "file",fileName: imageData.substr(imageData.lastIndexOf('/') + 1),mimeType: "image/jpg"
};
$cordovaFileTransfer.upload(server,filePath,options).then(function(result) {
console.log("SUCCESS: " + JSON.stringify(result.response));
console.log('Result_' + result.response[0] + '_ending');
alert("success");
alert(JSON.stringify(result.response));
},function(err) {
console.log("ERROR: " + JSON.stringify(err));
//alert(JSON.stringify(err));
},function (progress) {
// constant progress updates
});
},function(err) {
// error
console.log(err);
});
}
而在域上服务器上的upload.PHP中的代码:
<?PHP
// if you want to find the root path of a folder use the line of code below:
//echo $_SERVER['DOCUMENT_ROOT']
if ($_FILES["file"]["error"] > 0){
echo "Error Code: " . $_FILES["file"]["error"] . "<br />";
}
else
{
echo "Uploaded file: " . $_FILES["file"]["name"] . "<br />";
echo "Type: " . $_FILES["file"]["type"] . "<br />";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kilobytes<br />";
if (file_exists("/files/".$_FILES["file"]["name"]))
{
echo $_FILES["file"]["name"] . " already exists. No joke-- this error is almost <i><b>impossible</b></i> to get. Try again,I bet 1 million dollars it won't ever happen again.";
}
else
{
move_uploaded_file($_FILES["file"]["tmp_name"],"/var/www/vhosts/yourdomain.com/subdomains/domainname/httpdocs/foldername/images/".$_FILES["file"]["name"]);
echo "Done";
}
}
?>