Redeem Now
Read More
Read now
Menu Close
    Start a Project Request quote Reading list Switch to dark mode

    How to get estimate shipping rates in magento2 using js

    Here , I am going to explain that how to get estimate shipping using js. Sometime  we want to display shipping method and rates to customer at product page or another page except to checkout page.As we all know that in magento2 use js is more than to php for fast execution and change details when change in data.In this blog I will call estimate shipping rates at product view page. You have to add following files to get this functionality : –

    1- Create catalog_product_view.xml file at app/code/Test/Module/view/frontend/layout path.Using this file call block at product view page.

    2- Create template file which is define in layout

    In this file add only single button.On click of this button send to request for estimate shipping calculation.And also call js file.

    3 – Create app/code/Test/Module/view/frontend/requirejs-config.js

    4 – Create app/code/Test/Module/view/frontend/web/js/estimaterate.js .In this file call rest/default/V1/carts/mine/estimate-shipping-methods this web api which is define magento default.Using this we can get estimate rate for only login customer.If you want to calculate estimate shipping for guest then you have to call rest/default/V1/guest-carts/:quoteId/estimate-shipping-methods and provide cart id in parameters.You can check this file for reference vendor/magento/module-checkout/view/frontend/web/js/model/resource-url-manager.js

    After successfully run.You can see rates in response.I hope it will clear that how to get estimate shipping rates through js and also you can call other web api.

    Thanks for reading this blog.If you get any issue and query then feel free to add a ticket or comment.


    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*

    Be the first to comment.

    Back to Top
    Hire Us!
    Brief us about your requirements and we'll get back to you.
    Woo! Hooy!
    We have just recieved your project brief and our expert will contact you shortly.
    Send Again