Network response not sending ‘allow-origin’ header

I’m having this error on my web application when I try to update a database object:

Access to XMLHttpRequest at ‘http://localhost:3001’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

These are the network requests: Preflight request ; PUT request ;

I’m using Slim for the server routing, Vue for the client routing and axios for the db connection.

The allow origin header seems to be missing from the response but I have the server set for sending it:

$app->add(function ($req, $res, $next) {
    $response = $next($req, $res);
    return $response
        ->withHeader('Access-Control-Allow-Origin', '*')
        ->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Allow, Origin, Authorization, Access-Control-Allow-Origin')
        ->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH, OPTIONS');
});

Which works with objects of different status(a table value). I suspect it’s not using that response for objects of this specific status, but it uses the same form and methods. I don’t see why it would use a different response.

Update

The table I’m trying to update(document) serves as foreign key to another table(amendment) in the db. I’ve discovered that if I unlink the amendment from the document the update works. Maybe the CORS error is a false positive?

Answer

It was a false positive after all. An array inside the entity i was trying to send to the database seemed to be the problem. After deleting it from the request the update worked perfectly.

Advertisement

Answer