magento / magento2

Prior to making any Submission(s), you must sign an Adobe Contributor License Agreement, available here at: https://opensource.adobe.com/cla.html. All Submissions you make to Adobe Inc. and its affiliates, assigns and subsidiaries (collectively “Adobe”) are subject to the terms of the Adobe Contributor License Agreement.
http://www.magento.com
Open Software License 3.0
11.53k stars 9.31k forks source link

Urgent Help Needed: Rokanthemes Checkout Page Issue after Magento2 Upgrade #38586

Closed mohudoomnaina2 closed 6 months ago

mohudoomnaina2 commented 6 months ago

Preconditions and environment

Steps to reproduce

  1. Add product to cart
  2. Go to checkout

Expected result

In the checkout process, payment details and shipping details should be visible to the customer.

Actual result

Hi Guys, Thanks in advance for helping to solve this issue. Currently, I have upgraded Magento from 2.3.5p1 to 2.4.6p4.

Now, all pages are working well except for the "checkout_index_index" page. I'm not sure why this particular checkout page is not accepting the customer session. It seems that the API URL is incorrect, causing a 404 error. I have attached the Error.

Please, can anyone help solve this issue? Once again, thank you for your assistance.

Error: In my browser console showing the below error,

1)POST "/V1/guest-carts/7546/payment-information?_=1712220653701" 404
2)GET "/V1/guest-carts/7546/estimate-shipping-methods" 404 
3)POST "V1/guest-carts/7546/payment-information?_=1712220653702" 404

Note: This error only occurs for logged-in users.

My Current Code:-
public_html/app/code/Rokanthemes/OpCheckout/view/frontend/layout/checkout_index_index.xml

    <?xml version="1.0"?>
    <!--
    /**
     * Copyright © 2016 Magento. All rights reserved.
     * See COPYING.txt for license details.
     */
    -->
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <body>
            <move element="logo" destination="toki_header"/>
        </body>
    </page>

public_html/app/code/Rokanthemes/OpCheckout/view/frontend/layout/opcheckout_layout.xml <?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="Rokanthemes_OpCheckout::css/opcheckout.css"/>
    </head>
    <body>
        <referenceContainer name="before.body.end">
            <block class="Magento\Framework\View\Element\Template" after="-" name="osc.login" template="Rokanthemes_OpCheckout::login.phtml"/>
        </referenceContainer>
        <referenceBlock name="checkout.root">
            <action method="setTemplate">
                <argument name="template" xsi:type="string">Rokanthemes_OpCheckout::opcheckout.phtml</argument>
            </action>
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="types" xsi:type="array">
                        <item name="form.input" xsi:type="array">
                            <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                            <item name="config" xsi:type="array">
                                <item name="provider" xsi:type="string">checkoutProvider</item>
                                <item name="deps" xsi:type="array">
                                    <item name="0" xsi:type="string">checkoutProvider</item>
                                </item>
                                <item name="template" xsi:type="string">ui/form/field</item>
                                <item name="elementTmpl" xsi:type="string">Rokanthemes_OpCheckout/form/element/input</item>
                            </item>
                        </item>
                    </item>
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/osc</item>
                            <item name="config" xsi:type="array">
                                <item name="template" xsi:type="string">Rokanthemes_OpCheckout/opcheckout</item>
                            </item>
                            <item name="children" xsi:type="array">
                                <item name="osc-before" xsi:type="array">
                                    <item name="sortOrder" xsi:type="string">0</item>
                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/osc-before</item>
                                    <item name="displayArea" xsi:type="string">osc-before</item>
                                </item>
                                <item name="progressBar" xsi:type="array">
                                    <item name="sortOrder" xsi:type="string">0</item>
                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/progress-bar</item>
                                    <item name="displayArea" xsi:type="string">progressBar</item>
                                    <item name="config" xsi:type="array">
                                        <item name="deps" xsi:type="array">
                                            <item name="0" xsi:type="string">checkout.steps.shipping-step.shippingAddress</item>
                                            <item name="1" xsi:type="string">checkout.steps.billing-step.payment</item>
                                        </item>
                                    </item>
                                </item>                             
                                <item name="steps" xsi:type="array">
                                    <item name="component" xsi:type="string">uiComponent</item>
                                    <item name="displayArea" xsi:type="string">steps</item>
                                    <item name="children" xsi:type="array">
                                        <item name="shipping-step" xsi:type="array">
                                            <item name="component" xsi:type="string">uiComponent</item>
                                            <item name="sortOrder" xsi:type="string">1</item>
                                            <item name="displayArea" xsi:type="string">shipping-step</item>
                                            <item name="children" xsi:type="array">
                                                <item name="step-config" xsi:type="array">
                                                    <item name="component" xsi:type="string">uiComponent</item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="shipping-rates-validation" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <!--Step configuration components-->
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                                <item name="shipping-method" xsi:type="array">
                                                    <item name="provider" xsi:type="string">checkoutProvider</item>
                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/shipping/methods</item>
                                                    <item name="template" xsi:type="string">Rokanthemes_OpCheckout/shipping-method/list</item>
                                                    <item name="displayArea" xsi:type="string">shipping-method</item>
                                                    <item name="children" xsi:type="array">
                                                    </item>
                                                </item>
                                                <item name="shippingAddress" xsi:type="array">
                                                    <item name="config" xsi:type="array">
                                                        <item name="deps" xsi:type="array">
                                                            <item name="0" xsi:type="string">checkout.steps.shipping-step.step-config</item>
                                                            <item name="1" xsi:type="string">checkoutProvider</item>
                                                        </item>
                                                    </item>
                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/shipping</item>
                                                    <item name="displayArea" xsi:type="string">shipping-address</item>
                                                    <item name="provider" xsi:type="string">checkoutProvider</item>
                                                    <item name="sortOrder" xsi:type="string">1</item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="customer-email" xsi:type="array">
                                                            <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/form/element/email</item>
                                                            <item name="displayArea" xsi:type="string">customer-email</item>
                                                            <item name="tooltip" xsi:type="array">
                                                                <item name="description" xsi:type="string" translate="true">We'll send your order confirmation here.</item>
                                                            </item>
                                                            <item name="children" xsi:type="array">
                                                                <item name="before-login-form" xsi:type="array">
                                                                    <item name="component" xsi:type="string">uiComponent</item>
                                                                    <item name="displayArea" xsi:type="string">before-login-form</item>
                                                                    <item name="children" xsi:type="array">
                                                                        <!-- before login form fields -->
                                                                    </item>
                                                                </item>
                                                                <item name="additional-login-form-fields" xsi:type="array">
                                                                    <item name="component" xsi:type="string">uiComponent</item>
                                                                    <item name="displayArea" xsi:type="string">additional-login-form-fields</item>
                                                                    <item name="children" xsi:type="array">
                                                                        <!-- additional login form fields -->
                                                                    </item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                        <item name="before-form" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">before-form</item>
                                                            <item name="children" xsi:type="array">
                                                                <!-- before form fields -->
                                                            </item>
                                                        </item>
                                                        <item name="before-fields" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">before-fields</item>
                                                            <item name="children" xsi:type="array">
                                                                <!-- before fields -->
                                                            </item>
                                                        </item>
                                                        <item name="address-list" xsi:type="array">
                                                            <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/shipping-address/list</item>
                                                            <item name="displayArea" xsi:type="string">address-list</item>
                                                        </item>
                                                        <item name="address-list-additional-addresses" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">address-list-additional-addresses</item>
                                                            <item name="children" xsi:type="array">
                                                                <!-- address-list-additional-addresses -->
                                                            </item>
                                                        </item>
                                                        <item name="before-shipping-method-form" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">before-shipping-method-form</item>
                                                            <item name="children" xsi:type="array">
                                                                <!-- address-list-additional-addresses -->
                                                            </item>
                                                        </item>
                                                        <item name="shipping-address-fieldset" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="config" xsi:type="array">
                                                                <item name="deps" xsi:type="array">
                                                                    <item name="0" xsi:type="string">checkoutProvider</item>
                                                                </item>
                                                            </item>
                                                            <item name="displayArea" xsi:type="string">additional-fieldsets</item>
                                                            <item name="children" xsi:type="array">
                                                                <!-- The following items override configuration of corresponding address attributes -->
                                                                <item name="region" xsi:type="array">
                                                                    <!-- Make region attribute invisible on frontend. Corresponding input element is created by region_id field -->
                                                                    <item name="visible" xsi:type="boolean">false</item>
                                                                </item>
                                                                <item name="region_id" xsi:type="array">
                                                                    <item name="component" xsi:type="string">Magento_Ui/js/form/element/region</item>
                                                                    <item name="config" xsi:type="array">
                                                                        <item name="template" xsi:type="string">ui/form/field</item>
                                                                        <item name="elementTmpl" xsi:type="string">ui/form/element/select</item>
                                                                        <item name="customEntry" xsi:type="string">shippingAddress.region</item>
                                                                    </item>
                                                                    <item name="validation" xsi:type="array">
                                                                        <item name="required-entry" xsi:type="boolean">true</item>
                                                                    </item>
                                                                    <!-- Value of region_id field is filtered by the value of county_id attribute -->
                                                                    <item name="filterBy" xsi:type="array">
                                                                        <item name="target" xsi:type="string"><![CDATA[${ $.provider }:${ $.parentScope }.country_id]]></item>
                                                                        <item name="field" xsi:type="string">country_id</item>
                                                                    </item>
                                                                </item>
                                                                <item name="postcode" xsi:type="array">
                                                                    <!-- post-code field has custom UI component -->
                                                                    <item name="component" xsi:type="string">Magento_Ui/js/form/element/post-code</item>
                                                                    <item name="validation" xsi:type="array">
                                                                        <item name="required-entry" xsi:type="string">true</item>
                                                                    </item>
                                                                </item>
                                                                <item name="company" xsi:type="array">
                                                                    <item name="validation" xsi:type="array">
                                                                        <item name="min_text_length" xsi:type="number">0</item>
                                                                    </item>
                                                                </item>
                                                                <item name="fax" xsi:type="array">
                                                                    <item name="validation" xsi:type="array">
                                                                        <item name="min_text_length" xsi:type="number">0</item>
                                                                    </item>
                                                                </item>
                                                                <item name="country_id" xsi:type="array">
                                                                    <item name="sortOrder" xsi:type="string">115</item>
                                                                </item>
                                                                <item name="telephone" xsi:type="array">
                                                                    <item name="config" xsi:type="array">
                                                                        <item name="tooltip" xsi:type="array">
                                                                            <item name="description" xsi:type="string" translate="true">For delivery questions.</item>
                                                                        </item>
                                                                    </item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>

                                                </item>
                                            </item>
                                        </item>
                                        <item name="billing-step" xsi:type="array">
                                            <item name="component" xsi:type="string">uiComponent</item>
                                            <item name="displayArea" xsi:type="string">billing-step</item>
                                            <item name="sortOrder" xsi:type="string">2</item>
                                            <item name="children" xsi:type="array">
                                                <item name="payment" xsi:type="array">
                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/payment</item>
                                                    <item name="displayArea" xsi:type="string">payment</item>
                                                    <item name="config" xsi:type="array">
                                                        <item name="title" xsi:type="string" translate="true">Payment</item>
                                                    </item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="customer-email" xsi:type="array">
                                                            <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/form/element/email</item>
                                                        </item>
                                                        <item name="payments-list" xsi:type="array">
                                                            <item name="component" xsi:type="string">Magento_Checkout/js/view/payment/list</item>
                                                            <item name="displayArea" xsi:type="string">payment-methods-list</item>
                                                            <item name="config" xsi:type="array">
                                                                <item name="deps" xsi:type="array">
                                                                    <item name="0" xsi:type="string">checkout.steps.billing-step.payment.renders</item>
                                                                    <item name="1" xsi:type="string">checkout.steps.billing-step.payment.additional-payment-validators</item>
                                                                </item>
                                                            </item>
                                                            <item name="children" xsi:type="array">
                                                                <item name="before-place-order" xsi:type="array">
                                                                    <item name="component" xsi:type="string">uiComponent</item>
                                                                    <item name="displayArea" xsi:type="string">before-place-order</item>
                                                                    <item name="dataScope" xsi:type="string">before-place-order</item>
                                                                    <item name="provider" xsi:type="string">checkoutProvider</item>
                                                                    <item name="config" xsi:type="array">
                                                                        <item name="template" xsi:type="string">Rokanthemes_OpCheckout/payment/before-place-order</item>
                                                                    </item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                        <!-- merge your payment methods here -->
                                                        <item name="afterMethods" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">afterMethods</item>
                                                            <item name="children" xsi:type="array">

                                                                <!-- merge additional data after payment methods here -->
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>

                                            </item>
                                        </item>
                                    </item>
                                </item>
                                <item name="sidebar" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="summary" xsi:type="array">
                                            <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/summary</item>
                                            <item name="displayArea" xsi:type="string">summary</item>
                                            <item name="config" xsi:type="array">
                                                <item name="template" xsi:type="string">Magento_Checkout/summary</item>
                                            </item>
                                            <item name="children" xsi:type="array">
                                                <item name="totals" xsi:type="array">
                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/summary/totals</item>
                                                    <item name="displayArea" xsi:type="string">totals</item>
                                                    <item name="config" xsi:type="array">
                                                        <item name="template" xsi:type="string">Rokanthemes_OpCheckout/summary/totals</item>
                                                    </item>
                                                </item>
                                                <item name="cart_items" xsi:type="array">
                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/summary/cart-items</item>
                                                    <item name="displayArea" xsi:type="string">item-review</item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="details" xsi:type="array">
                                                            <item name="component" xsi:type="string">Delivery_Item/js/view/summary/item/details</item>
                                                            <item name="children" xsi:type="array">
                                                                <item name="thumbnail" xsi:type="array">
                                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/summary/item/details/thumbnail</item>
                                                                    <item name="displayArea" xsi:type="string">before_details</item>
                                                                </item>
                                                                <item name="subtotal" xsi:type="array">
                                                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/summary/item/details/subtotal</item>
                                                                    <item name="displayArea" xsi:type="string">after_details</item>
                                                                </item>
                                                            </item>
                                                        </item>

                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                                <!--<item name="discount" xsi:type="array">-->
                                <!--    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/payment/discount</item>-->
                                <!--    <item name="displayArea" xsi:type="string">discount</item>-->
                                <!--    <item name="children" xsi:type="array">-->
                                <!--        <item name="errors" xsi:type="array">-->
                                <!--            <item name="sortOrder" xsi:type="string">0</item>-->
                                <!--            <item name="component" xsi:type="string">Magento_SalesRule/js/view/payment/discount-messages</item>-->
                                <!--            <item name="displayArea" xsi:type="string">messages</item>-->
                                <!--        </item>-->
                                <!--    </item>-->
                                <!--</item>-->
                                <item name="sign-up-newsletter" xsi:type="array">
                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/sign-up-newsletter</item>
                                    <item name="displayArea" xsi:type="string">sign-up-newsletter</item>
                                </item>
                                <item name="ost-terms-and-conditions" xsi:type="array">
                                    <item name="component" xsi:type="string">Rokanthemes_OpCheckout/js/view/ost-terms-and-conditions</item>
                                    <item name="displayArea" xsi:type="string">ost-terms-and-conditions</item>
                                </item>
                            </item>
                        </item>
                        <item name="checkoutProvider" xsi:type="array">
                            <item name="component" xsi:type="string">uiComponent</item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

public_html/app/code/Rokanthemes/OpCheckout/view/frontend/templates/opcheckout.phtml

    <script type='text/javascript'>
        require([
            'Rokanthemes_OpCheckout/js/model/addressFieldManager'
        ], function(addressFieldManager) {
            addressFieldManager.init(<?php echo $this->helper('Rokanthemes\OpCheckout\Helper\Config')->getAddressFieldsJsonConfig();?>);
        })
    </script>
    <ol class="one-step-checkout opcheckout-index-index three-columns-new-osc clearfix">
        <li id="checkout" data-bind="scope:'checkout'" class="checkout-container">
            <div id="checkout-loader" data-role="checkout-loader" class="loading-mask show" data-mage-init='{"checkoutLoader": {}}'>
                <div class="loader">
                    <img src="<?php /* @escapeNotVerified */ echo $block->getViewFileUrl('images/loader-1.gif'); ?>"
                         alt="<?php /* @escapeNotVerified */ echo __('Loading...'); ?>"
                         style="position: absolute;">
                </div>
            </div>
            <!-- ko template: getTemplate() --><!-- /ko -->
            <script type="text/x-magento-init">
                {
                    "#checkout": {
                        "Magento_Ui/js/core/app": <?php /* @escapeNotVerified */ echo $block->getJsLayout();?>
                    }
                }
            </script>
            <script>
                window.checkoutConfig = <?php echo json_encode($block->getCheckoutConfig()); ?>;
                window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
                window.customerData = window.checkoutConfig.customerData;
            </script>
            <script>
                require([
                    'mage/url',
                    'Magento_Ui/js/block-loader'
                ], function(url, blockLoader) {
                    blockLoader("<?php /* @escapeNotVerified */ echo $block->getViewFileUrl('images/loader-1.gif'); ?>");
                    return url.setBaseUrl('<?php /* @escapeNotVerified */ echo $block->getBaseUrl();?>');
                })
            </script>
        </li>
    </ol>

public_html/app/code/Rokanthemes/OpCheckout/view/frontend/web/template/form/field.html

<div class="field" data-bind="visible: visible, attr: {'name': element.dataScope}, css: additionalClasses, afterRender:oscAddress.fieldAfterRender(element.dataScope)">
        <div class="control" data-bind="css: {'_with-tooltip': element.tooltip}">
        <!-- ko if: (element.dataScope.indexOf('street.0')>0) -->
        <label class="label" data-bind="attr: { for: element.uid }">
            <span data-bind="i18n: 'Street Address'"></span>
            <em class='required-symbol'>*</em>
        </label>
        <!-- /ko -->
        <label class="label" data-bind="attr: { for: element.uid }">
            <!-- ko if: element.label -->
            <span data-bind="text: element.label"></span>
            <em class='required-symbol'>*</em>
            <!-- /ko -->
        </label>
        <!-- ko ifnot: element.hasAddons() -->
            <!-- ko template: element.elementTmpl --><!-- /ko -->
        <!-- /ko -->
        <!-- ko if: element.hasAddons() -->
            <div class="control-addon">
                <!-- ko template: element.elementTmpl --><!-- /ko -->

                <!-- ko if: element.addbefore -->
                    <label class="addon-prefix" data-bind="attr: { for: element.uid }"><span data-bind="text: element.addbefore"></span></label>
                <!-- /ko -->

                <!-- ko if: element.addafter -->
                    <label class="addon-suffix" data-bind="attr: { for: element.uid }"><span data-bind="text: element.addafter"></span></label>
                <!-- /ko -->
            </div>
        <!-- /ko -->

        <!-- ko if: element.tooltip -->
            <!-- ko template: element.tooltipTpl --><!-- /ko -->
        <!-- /ko -->

        <!-- ko if: element.notice -->
            <div class="field-note" data-bind="attr: { id: element.noticeId }"><span data-bind="text: element.notice"></span></div>
        <!-- /ko -->

        <!-- ko if: element.error() -->
            <div class="mage-error" data-bind="attr: { for: element.uid }, text: element.error" generated="true"></div>
        <!-- /ko -->

        <!-- ko if: element.warn() -->
            <div class="message warning" generated="true"><span data-bind="text: element.warn"></span></div>
        <!-- /ko -->
    </div>
</div>
<!-- /ko -->

Additional information

No response

Release note

No response

Triage and priority

m2-assistant[bot] commented 6 months ago

Hi @mohudoomnaina2. Thank you for your report. To speed up processing of this issue, make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, Add a comment to the issue:

andrewbess commented 6 months ago

Hey hey. This is platform repository, but not 3rd-party extension repo. Please ask module support with your problem