A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true #399

New Issue

2016-09-19T07:33:48Z

padiyan commented

2016-09-19 07:33:48 +00:00

(Migrated from github.com)

Response to preflight request doesn't pass access control check: A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:3001' is therefore not allowed access. The credentials mode of an XMLHttpRequest is controlled by the withCredentials attribute.

Can anyone help me how to setup the header ?

Response to preflight request doesn't pass access control check: A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:3001' is therefore not allowed access. The credentials mode of an XMLHttpRequest is controlled by the withCredentials attribute. Can anyone help me how to setup the header ?

👍 12

wladimiravila commented

2016-10-05 21:11:48 +00:00

(Migrated from github.com)

hello @padiyan I have the same problem, are You solved?

padiyan commented

2016-10-05 22:20:11 +00:00

(Migrated from github.com)

Nope, I started using "ng2-uploader" https://github.com/jkuri/ng2-uploader

wladimiravila commented

2016-10-08 21:13:10 +00:00

(Migrated from github.com)

I solve this problem extending the class FileUploader, this code is a cody from other post

class MyUploader extends FileUploader {
onAfterAddingFile(file: any) {
file.withCredentials = false;
}
}

and in my html

            <input type="file" ng2FileSelect [uploader]="uploader" />
                <button type="button" class="btn btn-success btn-s"
                    (click)="uploader.authToken=authToken ; uploader.uploadAll()" [disabled]="!uploader.getNotUploadedItems().length">
                <span class="glyphicon glyphicon-upload"></span> Upload all
            </button>

I solve this problem extending the class FileUploader, this code is a cody from other post class MyUploader extends FileUploader { onAfterAddingFile(file: any) { file.withCredentials = false; } } and in my html ``` <input type="file" ng2FileSelect [uploader]="uploader" /> <button type="button" class="btn btn-success btn-s" (click)="uploader.authToken=authToken ; uploader.uploadAll()" [disabled]="!uploader.getNotUploadedItems().length"> <span class="glyphicon glyphicon-upload"></span> Upload all </button> ```

👍 6

xiaolei commented

2016-10-24 06:53:34 +00:00

(Migrated from github.com)

@wladimiravila 's idea works. Instead of extending the class FileUploader, I register the onAfterAddingFile event as following:
this.uploader.onAfterAddingFile = (file)=> { file.withCredentials = false; };

@wladimiravila 's idea works. Instead of extending the class FileUploader, I register the onAfterAddingFile event as following: ` this.uploader.onAfterAddingFile = (file)=> { file.withCredentials = false; }; `

👍 34 ❤️ 20 🎉 17

innergap commented

2016-11-09 17:45:31 +00:00

(Migrated from github.com)

Thank you @xiaolei You saved me!

dessalines commented

2016-12-02 05:02:28 +00:00

(Migrated from github.com)

I tried @xiaolei 's fix, but I still got the error message: Response for preflight has invalid HTTP status code 404.

With my server, I just had to add a dummy OPTIONS for that endpoint, just to pass the pre-flight:
options("/test", (req, res) -> "OKAY");

I tried @xiaolei 's fix, but I still got the error message: `Response for preflight has invalid HTTP status code 404`. With my server, I just had to add a dummy OPTIONS for that endpoint, just to pass the pre-flight: `options("/test", (req, res) -> "OKAY");`

👎 2

lexyfeito commented

2017-07-27 15:31:12 +00:00

(Migrated from github.com)

@xiaolei thank you!!!!!!!

justindiaw commented

2017-10-27 20:45:26 +00:00

(Migrated from github.com)

@xiaolei Your answer saved my day!

SpaceCorp-Us commented

2017-10-29 19:56:55 +00:00

(Migrated from github.com)

If it works with POSTMAN, it should work on here, very disappointing code ~ SC

I placed this in my component :

ngOnInit() {
     this.uploader.onAfterAddingFile = (file: any) => { file.withCredentials = false; };
}

and it works in display but doesn't upload anything, I get this output for each file :

SB-UpLoader2 > [ ]
SB-UpLoader2 > POST /uploads 200 2.638 ms - 94

Seem to be passing an Empty array to the API Server.

Any ideas would be appreciated : )

If it works with POSTMAN, it should work on here, very disappointing code ~ SC I placed this in my component : ``` ngOnInit() { this.uploader.onAfterAddingFile = (file: any) => { file.withCredentials = false; }; } ``` and it works in display but doesn't upload anything, I get this output for each file : ``` SB-UpLoader2 > [ ] SB-UpLoader2 > POST /uploads 200 2.638 ms - 94 ``` Seem to be passing an Empty array to the API Server. Any ideas would be appreciated : )

👍 1

hesampour commented

2017-11-12 15:47:36 +00:00

(Migrated from github.com)

thank xiaolei . it worked for me. I hope this problem will be fixed by creator so other people not to have the same problem. this was an annoying problem for me. really thank xiaolei

paldheeraj25 commented

2017-12-11 07:25:50 +00:00

(Migrated from github.com)

Thanks @xiaolei , You saved the day thanks a lot!!!

sutkovoy commented

2018-01-21 14:42:54 +00:00

(Migrated from github.com)

@xiaolei, thank you!

romanoffs commented

2018-02-16 17:14:50 +00:00

(Migrated from github.com)

Thank you @xiaolei

tusharcode commented

2018-08-15 10:28:01 +00:00

(Migrated from github.com)

Thank You @xiaolei

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: dc/ng2-file-upload#399