API access from frontend app

Datasets BAG
#1

Hi all,

My dutch are not really well, and this question might have already been asked. So, my apologies if happened.
I am trying to use the BAG service from an Angular 4 application. When I try to request something, I am getting the error XMLHttpRequest cannot load https://bag.basisregistraties.overheid.nl/api/v1/nummeraanduidingen/0518200000701576. Request header field X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers in preflight response. Strangely, the service returns 204 status (No content).

I have tried anything I searched on the Internet. But someone suggested that this is server side issue. I have tried the service with the Postman and it’s working fine! Can you help me with that issue??

Thank you for your help in advance!

#2

Hi Imouzos,

It looks like your Angular application is adding some more headers in the request to https://bag.basisregistraties.overheid.nl/api/v1/nummeraanduidingen/0518200000701576.
The header X-XSRF-TOKEN is added, while that is not excepted. I guess you other backend for your Angular application requires this header.

For security reasons a browsers executions first an OPTIONS call to the backend to see if it is allowed, it also tells which headers it planned to send along with the actual request.
Some more details you can find in this post (it is in Dutch).

So the solution is to omit the X-XSRF-TOKEN in the request to https://bag.basisregistraties.overheid.nl/...

I hope this will help you.

Regards,
Cees

1 like
#3

Hi Cees,

Thank you for your help. Indeed, I fixed the issue by removing the header from the request.

Kind regards,
Loukas