Skip to content

Commit dc0ef88

Browse files
danialfariddanialfarid
committed
allow sending file content as data $upload.http
1 parent 384bc59 commit dc0ef88

18 files changed

+500
-311
lines changed

‎bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "angularjs-file-upload",
33
"main": "angular-file-upload.min.js",
4-
"version": "1.1.11",
4+
"version": "1.2.0",
55
"homepage": "https://github.com/danialfarid/angular-file-upload",
66
"authors": [
77
"Danial Farid <danial.farid@gmail.com>"

‎demo/src/com/df/angularfileupload/FileUpload.java

Lines changed: 38 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -19,46 +19,57 @@ public class FileUpload extends HttpServlet {
1919
private static final long serialVersionUID = -8244073279641189889L;
2020

2121
@Override
22-
public void doPost(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
22+
protected void service(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
2323
try {
24-
ServletFileUpload upload = new ServletFileUpload();
24+
if (req.getHeader("Content-Type").startsWith("multipart/form-data")) {
25+
ServletFileUpload upload = new ServletFileUpload();
2526

26-
FileItemIterator iterator = upload.getItemIterator(req);
27+
FileItemIterator iterator = upload.getItemIterator(req);
2728

28-
StringBuilder sb = new StringBuilder("{\"result\": [");
29+
StringBuilder sb = new StringBuilder("{\"result\": [");
2930

30-
while (iterator.hasNext()) {
31-
sb.append("{");
32-
FileItemStream item = iterator.next();
33-
sb.append("\"fieldName\":\"").append(item.getFieldName()).append("\",");
34-
if (item.getName() != null) {
35-
sb.append("\"name\":\"").append(item.getName()).append("\",");
31+
while (iterator.hasNext()) {
32+
sb.append("{");
33+
FileItemStream item = iterator.next();
34+
sb.append("\"fieldName\":\"").append(item.getFieldName()).append("\",");
35+
if (item.getName() != null) {
36+
sb.append("\"name\":\"").append(item.getName()).append("\",");
37+
}
38+
if (item.getName() != null) {
39+
sb.append("\"size\":\"").append(size(item.openStream())).append("\"");
40+
} else {
41+
sb.append("\"value\":\"").append(read(item.openStream())).append("\"");
42+
}
43+
sb.append("}");
44+
if (iterator.hasNext()) {
45+
sb.append(",");
46+
}
3647
}
37-
if (item.getName() != null) {
38-
sb.append("\"size\":\"").append(fileSize(item.openStream())).append("\"");
39-
} else {
40-
sb.append("\"value\":\"").append(read(item.openStream())).append("\"");
48+
sb.append("]}");
49+
res.setContentType("application/json");
50+
PrintWriter printWriter = new PrintWriter(res.getOutputStream());
51+
try {
52+
printWriter.print(sb.toString());
53+
printWriter.flush();
54+
} finally {
55+
printWriter.close();
4156
}
42-
sb.append("}");
43-
if (iterator.hasNext()) {
44-
sb.append(",");
57+
} else {
58+
res.setContentType("application/json");
59+
PrintWriter printWriter = new PrintWriter(res.getOutputStream());
60+
try {
61+
printWriter.print("{\"result\":[{\"size\":" + size(req.getInputStream()) + "}]}");
62+
printWriter.flush();
63+
} finally {
64+
printWriter.close();
4565
}
4666
}
47-
sb.append("]}");
48-
res.setContentType("application/json");
49-
PrintWriter printWriter = new PrintWriter(res.getOutputStream());
50-
try {
51-
printWriter.print(sb.toString());
52-
printWriter.flush();
53-
} finally {
54-
printWriter.close();
55-
}
5667
} catch (Exception ex) {
5768
throw new ServletException(ex);
5869
}
5970
}
6071

61-
protected int fileSize(InputStream stream) {
72+
protected int size(InputStream stream) {
6273
int length = 0;
6374
try {
6475
byte[] buffer = new byte[2048];

‎demo/war/common.css

Lines changed: 7 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -3,50 +3,19 @@ body {
33
}
44

55
input[type="file"] {
6-
width: 7em;
76
width: 6.3em \0/IE9;
87
height: 1.5em;
98
margin: 5px;
109
}
1110

1211
input[multiple] {
13-
width: 7.5em;
1412
width: 6.2em \0/IE9;
1513
}
1614

17-
doesnotexist:-o-prefocus, input[type="file"] {
18-
width: 5.5em;
19-
}
20-
21-
doesnotexist:-o-prefocus, input[multiple] {
22-
width: 5em;
23-
}
24-
25-
@-moz-document url-prefix() {
26-
input[type="file"] {
27-
width: 5.7em;
28-
}
29-
30-
input[multiple] {
31-
width: 5.7em;
32-
}
33-
}
34-
35-
@media screen and (-webkit-min-device-pixel-ratio:0) {
36-
::i-block-chrome,input[multiple] {
37-
width: 6.7em;
38-
}
39-
}
40-
41-
html[data-useragent*='MSIE 10.0'] input[type="file"] {
42-
width: 7.5em;
43-
}
44-
4515
.sel-file {
4616
padding: 1px 5px;
4717
font-size: smaller;
4818
color: grey;
49-
5019
}
5120

5221
.response {
@@ -109,4 +78,11 @@ button {
10978
width: 18px;
11079
height: 18px;
11180
padding-right: 10px;
81+
}
82+
83+
.sub {
84+
font-size: smaller;
85+
color: #777;
86+
padding-top: 5px;
87+
padding-left: 30px;
11288
}

‎demo/war/index.html

Lines changed: 10 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
document.write('<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/' + (angularVersion || '1.2.0') + '/angular.js"><\/script>');
1212
</script>
1313
<script src="js/angular-file-upload.js"></script>
14+
<script src="js/upload.js"></script>
1415
<!-- <script src="http://cdn.jsdelivr.net/angular.file-upload/1.0.0/angular-file-upload.min.js"></script> -->
1516
</head>
1617

@@ -23,9 +24,14 @@ <h1>Angular file upload Demo</h1>
2324
<h3>
2425
Visit <a href="https://github.com/danialfarid/angular-file-upload">angular-file-upload</a> on github
2526
</h3>
26-
27-
<div>
28-
Model object to be sent to the server with the file: <input type="text" ng-model="myModel"> <br />
27+
<div class="upload-div">
28+
<label><input type="radio" name="howToSend" ng-model="howToSend" value="1" ng-init="howToSend = 1">model object to be sent as data to the server with the file: <input type="text" ng-model="myModel"></label> <br/>
29+
<label><input type="radio" name="howToSend" ng-model="howToSend" value="2" ng-disabled="!dropSupported">or send the file binary as data with a POST/PUT request instead of multipart/form-data upload. </label>
30+
<div class="sub">For <a href="https://github.com/danialfarid/angular-file-upload/issues/88">CouchDB</a>,
31+
<a href="https://github.com/danialfarid/angular-file-upload/issues/87">imgur</a>, etc.
32+
Only HTML5 FileReader browsers, cross browser support will be added around Feb 2014 when FileAPI FileReader support is available.
33+
</div><br/><br/>
34+
http method: <input type="radio" ng-model="httpMethod" ng-init="httpMethod = 'POST'" value="POST"/>post <input type="radio" ng-model="httpMethod" value='PUT'/>put<br/>
2935
choose a single file: <input type="file" ng-file-select="onFileSelect($files)">
3036
<br/>
3137
or multiple files: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="file" ng-file-select="onFileSelect($files)" multiple>
@@ -42,7 +48,7 @@ <h3>
4248
<br/>
4349
<div ng-show="selectedFiles != null">
4450
<div class="sel-file" ng-repeat="f in selectedFiles">
45-
<img ng-show="dataUrls[$index]" src="{{dataUrls[$index]}}">
51+
<img ng-show="dataUrls[$index]" ng-src="{{dataUrls[$index]}}">
4652
<button class="button" ng-click="start($index)" ng-show="progress[$index] < 0">Start</button>
4753
<span class="progress" ng-show="progress[$index] >= 0">
4854
<div style="width:{{progress[$index]}}%">{{progress[$index]}}%</div>
@@ -67,85 +73,5 @@ <h3>
6773
</ul>
6874
</div>
6975
</div>
70-
71-
<script type="text/javascript">
72-
angular.module('fileUpload', [ 'angularFileUpload' ]);
73-
74-
var MyCtrl = [ '$scope', '$http', '$timeout', '$upload', function($scope, $http, $timeout, $upload) {
75-
$scope.uploadRightAway = true;
76-
$scope.changeAngularVersion = function() {
77-
window.location.hash = $scope.angularVersion;
78-
window.location.reload(true);
79-
}
80-
$scope.hasUploader = function(index) {
81-
return $scope.upload[index] != null;
82-
};
83-
$scope.abort = function(index) {
84-
$scope.upload[index].abort();
85-
$scope.upload[index] = null;
86-
};
87-
$scope.angularVersion = window.location.hash.length > 1 ? window.location.hash.substring(1) : '1.2.0';
88-
$scope.onFileSelect = function($files) {
89-
$scope.selectedFiles = [];
90-
$scope.progress = [];
91-
if ($scope.upload && $scope.upload.length > 0) {
92-
for (var i = 0; i < $scope.upload.length; i++) {
93-
if ($scope.upload[i] != null) {
94-
$scope.upload[i].abort();
95-
}
96-
}
97-
}
98-
$scope.upload = [];
99-
$scope.uploadResult = [];
100-
$scope.selectedFiles = $files;
101-
$scope.dataUrls = [];
102-
for ( var i = 0; i < $files.length; i++) {
103-
var $file = $files[i];
104-
if (window.FileReader && $file.type.indexOf('image') > -1) {
105-
var fileReader = new FileReader();
106-
fileReader.readAsDataURL($files[i]);
107-
function setPreview(fileReader, index) {
108-
fileReader.onload = function(e) {
109-
$timeout(function() {
110-
$scope.dataUrls[index] = e.target.result;
111-
});
112-
}
113-
}
114-
setPreview(fileReader, i);
115-
}
116-
$scope.progress[i] = -1;
117-
if ($scope.uploadRightAway) {
118-
$scope.start(i);
119-
}
120-
}
121-
}
122-
123-
$scope.start = function(index) {
124-
$scope.progress[index] = 0;
125-
$scope.upload[index] = $upload.upload({
126-
url : 'upload',
127-
headers: {'myHeaderKey': 'myHeaderVal'},
128-
data : {
129-
myModel : $scope.myModel
130-
},
131-
/* formDataAppender: function(fd, key, val) {
132-
if (angular.isArray(val)) {
133-
angular.forEach(val, function(v) {
134-
fd.append(key, v);
135-
});
136-
} else {
137-
fd.append(key, val);
138-
}
139-
}, */
140-
file: $scope.selectedFiles[index],
141-
fileFormDataName: 'myFile'
142-
}).then(function(response) {
143-
$scope.uploadResult.push(response.data.result);
144-
}, null, function(evt) {
145-
$scope.progress[index] = parseInt(100.0 * evt.loaded / evt.total);
146-
});
147-
}
148-
} ];
149-
</script>
15076
</body>
15177
</html>

‎demo/war/js/FileAPI.flash.swf.new

36.1 KB
Binary file not shown.

‎demo/war/js/FileAPI.min.js.new

Lines changed: 3 additions & 0 deletions
Large diffs are not rendered by default.

‎demo/war/js/angular-file-upload-html5-shim.js

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
/**!
22
* AngularJS file upload shim for angular XHR HTML5 browsers
33
* @author Danial <danial.farid@gmail.com>
4-
* @version 1.1.11
4+
* @version 1.2.0
55
*/
66
if (window.XMLHttpRequest) {
7-
if (window.FormData) {
8-
// allow access to Angular XHR private field: https://github.com/angular/angular.js/issues/1934
9-
XMLHttpRequest = (function(origXHR) {
10-
return function() {
11-
var xhr = new origXHR();
12-
xhr.send = (function(orig) {
13-
return function() {
14-
if (arguments[0] instanceof FormData && arguments[0].__setXHR_) {
15-
var formData = arguments[0];
16-
formData.__setXHR_(xhr);
17-
}
18-
orig.apply(xhr, arguments);
19-
}
20-
})(xhr.send);
21-
return xhr;
22-
}
23-
})(XMLHttpRequest);
24-
}
7+
if (window.FormData) {
8+
// allow access to Angular XHR private field: https://github.com/angular/angular.js/issues/1934
9+
XMLHttpRequest = (function(origXHR) {
10+
return function() {
11+
var xhr = new origXHR();
12+
xhr.setRequestHeader = (function(orig) {
13+
return function(header, value) {
14+
if (header === '__setXHR_') {
15+
value(xhr);
16+
} else {
17+
orig.apply(xhr, arguments);
18+
}
19+
}
20+
})(xhr.setRequestHeader);
21+
return xhr;
22+
}
23+
})(XMLHttpRequest);
24+
}
2525
}

0 commit comments

Comments
 (0)