Upload file to Dropbox with angularjs - angularjs

I'm trying to upload file to Dropbox with following code. File is successfully uploaded to Dropbox but size gone 0 bytes.
I'm now planning to upload microsoft word and pdf file.
$scope.uploadHtmlFile = function($files) {
var data = $files;
$http({
method: 'PUT',
url: 'https://api-content.dropbox.com/1/files_put/dropbox/' + $files[0].name + '?access_token=TOKEN',
data: data
}).success(function(data, status, headers, config) {
console.log(data);
console.log('file uploaded successfully');
}).error(function(data, status, headers, config) {
console.log('error : ' + data);
console.log('erro file uploaded successfully');
});
}

$files is an array object, and file will be referred using $files[0].
$scope.uploadHtmlFile = function($files) {
var data = $files[0];
$http({
method: 'PUT',
url: 'https://api-content.dropbox.com/1/files_put/dropbox/' + $files[0].name + '?access_token=TOKEN',
data: data
}).success(function(data, status, headers, config) {
console.log(data);
console.log('file uploaded successfully');
}).error(function(data, status, headers, config) {
console.log('error : ' + data);
console.log('erro file uploaded successfully');
});
}

Related

downloading an excel file from Node.js back-end using angular.js front-end

I am trying to download an excel file from a node.js server.
when I open the requested file on the server side it is just ok, but when I am opening the downloaded file on the client side it is corrupted (the file format or file extension is not valid).
my server side code:
var file = fs.readFileSync(path.join(__dirname, '../../') + tempFile, 'binary');
res.setHeader('Content-Type', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
res.setHeader('Content-Disposition', "attachment; filename=" + "out.xlsx")
res.end(file, 'binary');
my angular-service:
$http({
method: 'POST',
url: API_URL + 'api/biApp/common/getXls',
data:options,
headers:{'Accept': "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"},
responseType: "arraybuffer"
}).success(function (data, status, headers, config) {
var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
saveAs(blob, "excel.xlsx");
//I have tried also:
// var objectUrl = URL.createObjectURL(blob);
// window.open(objectUrl);
}).error(function (data, status, headers, config) {
//error handling...
});
what am I doing wrong?

How to Download binary file in angular js using http

I want to downlaod exe file using $http, it shows me when I console the data, but I am unable to download it.
$http({
url: url,
method: "GET",
headers: {
'Content-type': 'application/json'
}
}).success(function (data, status, headers, config) {
console.log(data);
window.open(objectUrl);
}).error(function (data, status, headers, config) {
//upload failed
});
Any help would be appreciated.
you can Use response type like responseType: "arraybuffer"
$http({
url: url,
method: "GET",
headers: {
'Content-type': 'application/json'
},
responseType: "arraybuffer"
}).success(function (data, status, headers, config) {
console.log(data);
var file = new Blob([data], { type: 'application/binary' });
var fileURL = URL.createObjectURL(file);
window.open(fileURL);
var link=document.createElement('a');
link.href=fileURL;
link.download="testing.exe";
link.click();
window.open(objectUrl);
}).error(function (data, status, headers, config) {
//upload failed
});
and use Blob and pass type "application/binary" and create a link to download it.
Given code will help you to download exe file as well as to check
browser compatibility.
var ieEDGE = navigator.userAgent.match(/Edge/g);
var ie = navigator.userAgent.match(/.NET/g); // IE 11+
var oldIE = navigator.userAgent.match(/MSIE/g);
var blob = new window.Blob([data.data], { type: 'application/x-msdownload' });
if (ie || oldIE || ieEDGE) {
var fileName="filename"+'.exe';
window.navigator.msSaveBlob(blob, fileName);
}
else {
var file = new Blob([ data.data ], {
type : 'application/x-msdownload'
});
var fileURL = URL.createObjectURL(file);
var a = document.createElement('a');
a.href = fileURL;
a.target = '_blank';
a.download = "filename"+'.exe';
document.body.appendChild(a);
a.click();
}
//Successfully Downloaded

Create couchdb doc using AngularJs

var post_data ={ "task_list": $scope.task_list,"uri": $scope.uri }
$http({method: 'POST',url: 'http://127.0.0.1:5984/tasklist/'+$scope.task_list, data: post_data})
.success(function(data, status, headers, config) {
console.log("POST SUCCESS")
alert("Successfully added");
})
.error(function(data, status, headers, config) {
console.log("POST ERROR", data)
})
}
} );
When I compile the above code it shows an error of
127.0.0.1:5984/tasklist/text:1 POST http://127.0.0.1:5984/tasklist/text 400 (Bad Request)
admin.html:63 POST ERROR Object {error: "bad_request", reason: "Referer header required."}
Why does it show this? Any remedy for this?
Hey you need include headers in the post data. Since your post url expecting Referer.
var post_data = {
method: 'POST',
url: 'http://127.0.0.1:5984/tasklist/'+$scope.task_list,
headers: {
'Content-Type': 'json',
'Referer': 'http://www.example.com/app/index.html' //include headers
},
data: { "task_list": $scope.task_list,"uri": $scope.uri }
}
$http(post_data).success(function(data, status, headers, config) {
console.log("POST SUCCESS")
alert("Successfully added");
})
.error(function(data, status, headers, config) {
console.log("POST ERROR", data)
});

Angularjs request encoding issue

As part of the service response there is some content received in local language. The response from the server looks fine, but the moment it's received through
angular.js $http, the content in local language is distorted.
I've tried both the methods given below, but no luck. Can someone help please?
Method 1:
appService.config(function($httpProvider) {
$httpProvider.defaults.headers.get = { 'Content-Type' : 'application/json;charset=utf-8' };
});
$http.get(url).success(function(data, status, headers, config) {
console.log('data: ' + data);
}).error(function(data, status, headers, config) {
console.log('data: ' + data);
});
Method 2:
$http.get(url,{ transformRequest: angular.identity,
headers: {'Content-Type': 'application/json;charset=utf-8'}}
).success(function(data, status, headers, config) {
console.log('data: ' + data);
}).error(function(data, status, headers, config) {
console.log('data: ' + data);
});
Angular response content looks something like this �����

How can I use POST in $http to send an object to the server?

I am using the following:
var url = '/api/Test/Mark';
$http('POST', url, $scope.content.answers)
.success(function (data, status, headers, config) {
$scope.content = data.text;
})
.error(function (data, status, headers, config) {
alert("Error: No data returned from " + url);
});
This gives me an error when I try to call it:
TypeError: Cannot use 'in' operator to search for '3' in POST
at isArrayLike (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:183:81)
at forEach (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:225:16)
at http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:329:7
at forEach (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:227:18)
at extend (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:327:3)
at $http (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:6256:7)
at Scope.$scope.markQuestion (http://127.0.0.1:81/Content/app/questions/controllers/content.js:39:13)
at elementFns (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:8564:19)
at http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:15511:13
at Scope.$get.Scope.$eval (http://127.0.0.1:81/Scripts/angular-v1.2.0-rc.2.js:10034:28)
Can someone give me advice on what I may be doing wrong? Note $scope.content.answers is an array of data.
You are doing wrong with $http
Try This
var url = '/api/Test/Mark';
$http({
method: 'POST',
url: url
data: $scope.content.answers // this should be a object e.g { a : 'one', b: 'Two' }
})
.success(function (data, status, headers, config) {
$scope.content = data.text;
})
.error(function (data, status, headers, config) {
alert("Error: No data returned from " + url);
});

Resources