CODEWITHSUNDEEP
angularjsionic-framework
NHTorres
NHTorres

Reputation: 1538

Upload image to server angularjs

I need to upload an image taken from my mobile device to my server. I found the angular-upload library to which makes reference. I need to do is to transform the image base 64, send it by post to my server because the server is where I will work with her. And the other, send from my server and work it from the application to run.

var server = URL_BASE+'addView/';

var trustAllHosts = true;

var ftOptions = new FileUploadOptions();
ftOptions.fileKey = 'file';
ftOptions.fileName = $scope.imagen.substr($scope.imagen.lastIndexOf('/') + 1);
ftOptions.mimeType = 'image/jpeg';
ftOptions.httpMethod = 'POST';

console.log(ftOptions);

$cordovaFileTransfer.upload(encodeURI(server), $scope.imagen, ftOptions, trustAllHosts)
.then(function(result) {
  console.log(result)
}, function(err) {
  // Error
  console.log(err);
}, function (progress) {

});

Upvotes: 1

Views: 9571

Answers (2)

aorfevre
aorfevre

Reputation: 5064

ionic file transfer

I'm personally using Cordova file transfer for upload & download content from a server.

Base64 encoding

Don't know where is your image stored and how you retrieve it, but, either you specify that the image is base64 encode into the HTML file delimiter OR You transform your image using a canvas See that post for more info : https://stackoverflow.com/a/20285053/3687474

Upvotes: 2

justMe
justMe

Reputation: 664

You haven't specified what you really need so: Here you have a factory

//Factory you register on your module
angular
    .module('myApp')
    .factory('sendBase64Image', sendBase64Image)

function sendBase64Image($http) {
    var urlBase; //url to be filled in

    var base64 = {};
    base64.sendBase = function (baseImg) {
        var request = $http({
            method: "post",
            url: urlBase,
            headers: {
                'Content-type': 'application/json'
            },
            data : baseImg 
        });
    }
    return base64;
}

You should then inject it via dependency injection to your controller and perform call to the server. If you want to do something with a response use success() method to handle promise response.

Upvotes: 2

Related Questions