Calling third party REST api call form clinet side on AEM (e.g. localhost:4052 ) | Community
Skip to main content
C
chgovind
Level 2
November 2, 2018

Calling third party REST api call form clinet side on AEM (e.g. localhost:4052 )

  • November 2, 2018
  • 1 reply
  • 7927 views

Let's say we are calling an a third party API directly from React using axios/fetch. (localhost:9000)

To handle CORS issues we set proxy in  packege.json/webpack.config, and "passing relative URL" to axios/fetch(THIS WORKS!!)

NOW we deployed the same in AEM and hosting on localhost:4502.(THIS DOESN'T WORK)

I understand that now react build is deployed and proxy will not work in production, but I am looking for a way to handle it once it's deployed and served on AEM.

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

    1 reply

    Daniel_Gordon
    Adobe Employee
    Daniel_GordonAdobe Employee
    Adobe Employee
    November 2, 2018

    Hi @chgovind ,

    To make sure I am understanding the use case:

    During development, you are using a webpack dev server and any calls to your external service you are using the Proxy features of the webpack dev server and thus passing in a relative URL. However, when you create your production build and deploy to AEM the JS is still passing in relative URLs to your 3rd party API?

    You could look into using environment variables: Adding Custom Environment Variables · Create React App If you are in development mode you don't add a host name but in the production build you do append a host name to the 3rd party call...

    C
    chgovindAuthor
    Level 2
    November 6, 2018

    You are close.

    What if the third party API doesn't allow CORS.

    Is there a way to handle this in Local AEM environment?

    smacdonald2008
    smacdonald2008
    Level 10
    November 6, 2018

    A better apprach to invoke a 3rd party endpoint - like a Restful service is to use an AEM service and write Java to invoke the service and then display the results in front end component. YOu should look at using HTL and Sling Models.

      Terms & ConditionsAccessibility statement

      Loading footer...