rinukkusu rinukkusu - 4 months ago 25
Dart Question

CORS error when using HttpRequest.getString(url)

The whole application is built with

Angular 2
for
Dart
.

At one place I have a service with a really naive
HttpRequest.getString()
call with no special parameters or anything.

String response = await HttpRequest.getString(url);


On the server side there is a
Wordpress
installation with
WP-API
running.

It seems, that
Dart
is creating a new response header for the currently loaded hostname somehow, because I get this error:


XMLHttpRequest cannot load http://my-wordpress/wp-json/wp/v2/pages.

The 'Access-Control-Allow-Origin' header contains multiple values 'http://localhost:8080, *', but only one is allowed. Origin 'http://localhost:8080' is therefore not allowed access.





I don't get the same result with
Postman
, though:



enter image description here





From what I could read out of the source code,
Dart
itself concatenates duplicate headers into just one
, but I couldn't find any information on that extra CORS header.

Answer

I could fix it by commenting out Wordpress specific REST-API code. In the folder wp-includes there is a file called rest-api.php.

On line 376 upwards you see something like this:

header( 'Access-Control-Allow-Origin: ' . esc_url_raw( $origin ) );
header( 'Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE' );
header( 'Access-Control-Allow-Credentials: true' );

This seems to allow the host of the request to access the API. But since I'm already adding * as Origin, this will fail. So I just commented that code block out and everything works fine now.

Comments