domain.com has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status

Viewed 1061

Handling preflight requests from React application to Symfony is getting too difficult now, I am trying to fix this for the last 8 hours, Here is the error that I am getting,

Access to XMLHttpRequest at 'https://mylocaldomain.com/validate-token' from origin 'http://myreactapplocal:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

I tried adding the code from this post in here in public/index.php and it worked, I am trying to implement the same in the listener as I do not want to edit the public/index.php and it's not working via the listener, below is my listener code



namespace App\EventListener;

use Symfony\Component\EventDispatcher\EventSubscriberInterface;
use Symfony\Component\DependencyInjection\ContainerInterface;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpKernel\Event\RequestEvent;
use Symfony\Component\HttpKernel\Event\ResponseEvent;
use Symfony\Component\HttpKernel\HttpKernel;
use Symfony\Component\HttpKernel\KernelEvents;

class CorsListener implements EventSubscriberInterface
{


    private $container;

    public function __construct(ContainerInterface $container)
    {
        $this->container = $container;
    }

    public static function getSubscribedEvents(): array
    {
        return [
            RequestEvent::class => 'onRequestEvent',
            ResponseEvent::class => 'onResponseEvent',
        ];
    }


    public function onRequestEvent(RequestEvent $event)
    {
        if (HttpKernel::MASTER_REQUEST != $event->getRequestType()) {
            return;
        }

        $request = $event->getRequest();
        $method  = $request->getRealMethod();
        if ('OPTIONS' === $method) {
            $response = new Response();
            $response->headers->set('Access-Control-Allow-Headers', 'X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization');
            $event->setResponse($response);
        }
    }

    public function onResponseEvent(ResponseEvent $event)
    {
        // Don't do anything if it's not the master request.
        if (!$event->isMasterRequest()) {
            return;
        }
        $response = $event->getResponse();
        $response->headers->set('Access-Control-Allow-Origin', '*');
        $response->headers->set('Access-Control-Allow-Methods', 'GET,POST,PUT,OPTIONS,PATCH,DELETE');
        $response->headers->set('Access-Control-Allow-Headers', 'Content-Type,Authorization');
    }
}

Any kind of help/lead to resolving this issue is appreciated!!

1 Answers

I also had this problem using angular and symfony

For me putting the folling code on index.php solved it

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: *");
header("Access-Control-Allow-Methods: *");
header("Allow: *");
$method = $_SERVER['REQUEST_METHOD'];
if ($method === "OPTIONS") {
    die();
}
Related