asv*_*vid 5 android ios ios-simulator cordova ionic-framework
我正在使用Cordova和Ionic Framework开发适用于iOS和Android的移动应用程序。需要有“发送照片”和相关功能,我正在使用Cordova的FileTransfer来做到这一点。
它在iOS模拟器上完美运行,但在Android设备上抛出“错误代码= 1”。
我知道这意味着file_not_found或类似。
请注意,如果我从相机拍摄照片,或者从图库中选择一张,则会发生这种情况。
这是我的代码:
$scope.takePic = function() {
var options = {
quality: 50,
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: 0, // 0:Photo Library, 1=Camera, 2=Saved Photo Album
encodingType: 0 // 0=JPG 1=PNG
}
navigator.camera.getPicture(onSuccess, onFail, options);
}
var onSuccess = function(FILE_URI) {
window.resolveLocalFileSystemURL(FILE_URI, function(fileEntry) {
alert("full: " + JSON.stringify(fileEntry));
var realUrl = fileEntry.toURL();
$scope.picData = realUrl;
$scope.$apply();
console.log("real URL", realUrl);
});
};
var onFail = function(e) {
console.log("On fail " + e);
}
function win(r) {
console.log("Code = " + r.responseCode);
console.log("Response = " + r.response);
console.log("Sent = " + r.bytesSent);
Flash.success("Wys?ano");
var response = JSON.parse(r.response);
$scope.attachment_id = response.data;
$scope.$apply();
$http.post($rootScope.baseServerUrl + 'Members/changeAvatar', {attachment_id: response.data}).success( function (response){
console.log(response);
});
}
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);
}
$scope.send = function() {
Flash.warning('wysy?am');
var myImg = $scope.picData;
alert(myImg);
var options = new FileUploadOptions();
options.headers = {
Accept: "application/json",
Connection: "close"
}
options.fileKey="file";
options.fileName=$scope.picData.substr($scope.picData.lastIndexOf('/')+1);
options.mimeType="image/jpeg";
options.chunkedMode = false;
var ft = new FileTransfer();
ft.upload(myImg, encodeURI($rootScope.baseServerUrl + 'media/Attachments/add'), win, fail, options);
}
Run Code Online (Sandbox Code Playgroud)
$scope.takePic并send通过点击按钮来调用。有很多警报和控制台,因为我试图找出为什么它不起作用。
从android上的图库中选择一张图片后,我得到:
file:///storage/sdcard0/download/file-name.jpg
在iOS模拟器上:
文件:///Users//Library/Application%20Support/iPhone%20Simulator/7.1/Applications/B5FB2081-54E7-4335-8856-84C6499E6B07/tmp/cdv_photo_038.jpg
通过使用此路径,我可以<img src="{{picData}}">在两个平台上使用此作品来展示这张图片。
但是,如果我尝试在Android设备上发送该消息,则会收到错误代码=1。在iOS sim卡上,它发送,照片,得到正确的响应,更改化身...一切。
Cordova和插件File和FileTransfer都是最新的。
也许晚了,但我已经解决了。
在我的视图文件中我使用:
<input id="file" name="file" type="file" onchange="angular.element(this).scope().addFile(this)" class="upload" accept="image/*" capture="camera"/>
Run Code Online (Sandbox Code Playgroud)
因此,$scope.addFile()一旦您从画廊中获取文件,它就会从我的控制器中触发:
$scope.addFile = function(item){
function uploadComplete(evt) {
/* This event is raised when the server send back a response */
$scope.imgId = JSON.parse(evt.target.responseText).data;
$scope.$apply();
$http.post($rootScope.baseServerUrl + 'Members/changeAvatar', {attachment_id: $scope.imgId}).success( function (response){
console.log(response);
$scope.User.attachment_id = $scope.imgId;
$scope.$apply();
});
}
function uploadFailed(evt) {
alert("There was an error attempting to upload the file.")
};
var updateImage = function (element) {
$scope.$apply(function() {
$scope.theFile = element.files[0];
var formData = new FormData();
formData.append("file", $scope.theFile);
var xhr = new XMLHttpRequest()
xhr.addEventListener("load", uploadComplete, false)
xhr.addEventListener("error", uploadFailed, false)
xhr.open("POST", $scope.baseServerUrl + "media/Attachments/add")
xhr.setRequestHeader("Accept","application/json")
$scope.progressVisible = true
xhr.send(formData);
});
};
updateImage(item)
}
Run Code Online (Sandbox Code Playgroud)
适用于我测试过的所有 Android 设备,4.0 以上,不包括 4.4,因为input type="file" bug,适用于 iOS 模拟器和 8.1 系统的设备(也应该适用于较旧的设备,但我没有测试它)。
这不是一个完美的解决方案,因为您只能使用手机上已有的图片。我不知道如何通过我们的服务器身份验证方式使用 Cordova FileTransfer:即使我尝试添加所有需要的标头、令牌、任何内容,我总是收到“请登录”响应...
因此,尽管这个解决方案与我想要实现的目标相去甚远,但它确实有效。希望它对任何人都有帮助。
| 归档时间: |
|
| 查看次数: |
4468 次 |
| 最近记录: |