I am trying to make a HTTP request using $resource, that will send the same information this postman request does.
Here is the request I need to replicate:
Postman request:
Postman Headers:
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>File Upload</title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then unment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="lib\ionic\js\angular-file.js"></script>
<script src="lib\ionic\js\angular-resource.js"></script>
</head>
<body ng-app="starter" ng-controller="FileController">
<input type="file" ng-model="model.image" change="upload(model)"/>
</body>
</html>
controllers.js
angular.module('starter.controllers',[])
.controller('FileController', function ($scope, $resource) {
var Files = $resource('/', null, {
post: {
method:'POST'
}
});
angular.extend($scope, {
model: { image: null },
upload: function(model) {
console.log("File chosen");
console.log(model);
Files.prototype.$post.call({},model.image, function(self, headers) {
// Handle server response
console.log("DONE");
});
}
});
});
Headers from my request: i . stack . imgur . /4inXR.jpg
I am trying to make a HTTP request using $resource, that will send the same information this postman request does.
Here is the request I need to replicate:
Postman request:
Postman Headers:
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>File Upload</title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then unment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="lib\ionic\js\angular-file.js"></script>
<script src="lib\ionic\js\angular-resource.js"></script>
</head>
<body ng-app="starter" ng-controller="FileController">
<input type="file" ng-model="model.image" change="upload(model)"/>
</body>
</html>
controllers.js
angular.module('starter.controllers',[])
.controller('FileController', function ($scope, $resource) {
var Files = $resource('http://api.artistappz./api/v1/cover/x-app-id/3865f620590f40d493ec8d900b4c24d3/', null, {
post: {
method:'POST'
}
});
angular.extend($scope, {
model: { image: null },
upload: function(model) {
console.log("File chosen");
console.log(model);
Files.prototype.$post.call({},model.image, function(self, headers) {
// Handle server response
console.log("DONE");
});
}
});
});
Headers from my request: i . stack . imgur . /4inXR.jpg
Share Improve this question edited Mar 19, 2019 at 1:27 Dale K 27.5k15 gold badges58 silver badges83 bronze badges asked Nov 19, 2014 at 14:14 Dejan SkorupanDejan Skorupan 352 silver badges4 bronze badges 2- can you post your solution? – dudemonkey Commented Oct 14, 2015 at 15:54
- 1 I used the sollution posted by qwetty, it worked perfectly :) – Dejan Skorupan Commented Oct 15, 2015 at 17:42
1 Answer
Reset to default 5In one of my project I use this angular module https://github./danialfarid/angular-file-upload. It works for me very well, also there is demo site.