Magento 2.1 Payment Methods – Redirect After Place Order Issue

magento-2.1payment-methods

I developed a Magento CE 2.0 payment module.It's procedures are:

  1. Select the payment method and choose the bank.
  2. Place order.
  3. After place order successful, customer will redirect to payment gateway
    page.
  4. Gateway page will back to magento page after customer done payment.
  5. If the paymen process is success, customer will be redirected to order success
    page.

I wrote it first time in Magento CE 2.0.7 and everything worked perfectly. However, when I was using it for magento CE 2.1.0, the module couldn't run redirect action after place order successful.

I put my redirect url in method.js file by overriding afterPlaceOrder of default.js from Magento Checkout module as below:

/**
* After place order callback
*/
afterPlaceOrder: function () {
    $.mage.redirect(window.checkoutConfig.payment.ideal.redirectUrl);
},

After investiged some things I reconize some issue such as:

  • In Magento CE 2.0.7, the success page order requrest run first, then the gateway payment redirect request run. Everything worked fine.

  • In Magento CE 2.1.0, it happened opposite. The gateway payment redirect request run first. Then the success page order requrest run, and it replaced the first one. As a result, the gateway payment redirect request was aborted, it go straight to order success page without redirect to payment gateway page.

Apache log request:

(Magento CE 2.0.7)
127.0.0.1 - - [22/Jul/2016:11:59:09 +0700] "POST /rest/default/V1/carts/mine/payment-information HTTP/1.1" 200 349 "http://192.168.200.62/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:59:17 +0700] "GET /checkout/onepage/success/ HTTP/1.1" 200 7443 "http://192.168.200.62/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:59:17 +0700] "GET /customer/section/load/?sections=cart%2Cmessages&update_section_id=true&_=1469163514364 HTTP/1.1" 200 788 "http://192.168.200.62/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:59:17 +0700] "GET /ideal/ideal/redirect?_secure=true&bank_id=1234 HTTP/1.1" 302 732 "http://192.168.200.62/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"

(Magento CE 2.1.0)
127.0.0.1 - - [22/Jul/2016:11:54:58 +0700] "POST /magento210/rest/default/V1/carts/mine/payment-information HTTP/1.1" 200 379 "http://localhost/magento210/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:55:07 +0700] "GET /magento210/ideal/ideal/redirect/?_secure=true&bank_id=0771 HTTP/1.1" 302 802 "http://localhost/magento210/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:55:07 +0700] "GET /magento210/checkout/onepage/success/ HTTP/1.1" 200 7648 "http://localhost/magento210/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"
127.0.0.1 - - [22/Jul/2016:11:55:07 +0700] "GET /magento210/customer/section/load/?sections=cart%2Clast-ordered-items%2Cmessages&update_section_id=true&_=1469163137422 HTTP/1.1" 200 1161 "http://localhost/magento210/checkout/" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0"

The redirect request is aborted on firefox developer tool screen:
enter image description here

I also check the /view/frontend/web/js/view/default.js from Magento Checkout module core. It is much different between two version CE 2.0.7 and CE 2.1.0.

Now, I'm getting stuck at this problem and haven't found a solution for it. Please give me some advise if I made something wrong!

Best Answer

You should use redirectAfterPlaceOrder: false in defaults, then the afterPlaceOrder function redirection will start working. Refer this sample code

 define(
    [
        'jquery',
        'Magento_Checkout/js/view/payment/default',
        'mage/url',
        'Magento_Checkout/js/action/place-order'
    ],
    function ($,Component,url,placeOrderAction) {
        'use strict';

        return Component.extend({
            defaults: {
                redirectAfterPlaceOrder: false
            },

            afterPlaceOrder: function (data, event) {
                 window.location.replace(url.build('yourmodule/namespace/controller'));

            }

        });
    }
); 
Related Topic