ng2-file-upload access-control origin issue

Question

I have used this library for angular2 file upload https://github.com/valor-software/ng2-file-upload

Now I'm getting this error when I upload a file

XMLHttpRequest cannot load http://localhost:8080/files. Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:3000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

this solved the same issue of mine https://stackoverflow.com/a/47334113/5236174 , please check if it is an acceptable answer in your case. — Lahar Shah, Dec 11 '17 at 05:47

score 29 · Answer 1 · answered Nov 16 '17 at 16:01

29

Make withCredentials = false before uploading the item. You can put this code in ngOnInit/ constructor or ngOnChanges.

this.uploader.onBeforeUploadItem = (item) => {
  item.withCredentials = false;
}

answered Nov 16 '17 at 16:01

Lahar Shah

7,032
4
31
39

3

If I could upvote 100 times I would do that, This saved my frustration of google storage upload from past two days. – Vignesh Jan 17 '18 at 10:41
i've been looking for this solution for long time. thank you – ctrleffive Oct 04 '19 at 08:33

score 1 · Answer 2 · edited May 23 '17 at 10:31

1

Your server is responding with the following CORS Header

'Access-Control-Allow-Credentials' = true

This is a security that CORS provide, you are not allowed to do that. You cannot use Access-Control-Allow-Origin = * if you what to allow credentials. You will have to specify the exact domain. try Specifying

localhost:<portnumber>

For more information look at the following links

edited May 23 '17 at 10:31

Community

1
1

answered Feb 17 '17 at 11:37

Ankesh

4,847
4
38
76

i have added "Access-Control-Allow-Origin", "*" this one – Kokulan Feb 17 '17 at 12:15
you cannot use it, in your header `Access-Control-Allow-Credentials` is coming as `true` which doesn't not allow you to use , `Access-Control-Allow-Origin` as `*`. Specify an exact origin `localhost:3000` or some how set `Access-Control-Allow-Credentials` as false – Ankesh Feb 17 '17 at 13:16

score 0 · Answer 3 · edited Oct 14 '19 at 08:40

0

You can try this:

ngAfterViewInit() {
   this.uploader.onAfterAddingFile = (item => {
      item.withCredentials = false;
   });
}

edited Oct 14 '19 at 08:40

Dino

7,779
12
46
85

answered Oct 14 '19 at 07:43

El7or

334
1
5
18

ng2-file-upload access-control origin issue

3 Answers3

Linked