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:-
app/code/Rokanthemes/OpCheckout/view/frontend/layout/opcheckout_layout.xml
<body>
<referenceContainer name="before.body.end">
<block class="MagentoFrameworkViewElementTemplate" 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">
</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="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">
</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">
</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">
</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">
</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">
</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">
</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">
<item name="region" xsi:type="array">
<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>
<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">
<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="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>
<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">
</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="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>
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('RokanthemesOpCheckoutHelperConfig')->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">
<!-- ko template: getTemplate() --><!-- /ko -->
<script type="text/x-magento-init">
{
"#checkout": {
"Magento_Ui/js/core/app": <?php 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'
], function(url) {
return url.setBaseUrl('<?php echo $block->getBaseUrl();?>');
})
</script>
</li>
</ol>
