No 'Access-Control-Allow-Origin' header is present on the requested resource - Mollie payment ajax

Question

I'm trying to create a mollie payment with the following 2 libraries:

• https://github.com/barryvdh/laravel-omnipay
• https://github.com/thephpleague/omnipay-mollie

When the client fills in the form and submits an ajax request will be made to a function in my laravel application.

In my Laravel function I'm trying to do the following:

$gateway = Omnipay\Omnipay::create('Mollie');

$gateway->setApiKey('test_gSDS4xNA96AfNmmdwB3fAA47zS84KN');

$params = [
    'amount' => $ticket_order['order_total'] + $ticket_order['organiser_booking_fee'],
    'description' => 'Kapelhoek wijkfeesten',
    'returnUrl' => URL::action('EventCheckoutController@fallback'),
];


$response = $gateway->purchase($params)->send();


if ($response->isSuccessful()) {
    // payment was successful: update database
    print_r($response); die;
} elseif ($response->isRedirect()) {
    // redirect to offsite payment gateway
    return $response->getRedirectResponse(); die;
} else {
    // payment failed: display message to customer
    echo $response->getMessage(); die;
}

But I'm getting this response:

XMLHttpRequest cannot load https://www.mollie.com/payscreen/select-method/PRMtm6qnWG. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://kapelhoektickets.dev' is therefore not allowed access.

How can I fix this?

Answer 1

The line return $response->getRedirectResponse() is doing a redirect to the payment URL where the consumer should be sent to. However, this redirect is not allowed in an AJAX call.

Instead, your script should print this payment URL with $response->getRedirectUrl() and your webpage should redirect the consumer with javascript.