mucahitduz
mucahitduz

Reputation: 3

React App working on localhost but not working on Netlify deploy because the API call is different

I am developing a React app using freetogame API and it works perfectly on localhost, but I deployed it on Netlify and it's not working because it's making the API call to a different adress. Here is the API call on localhost: localhost API Call

and here is the API call on the deployed site: Deployed Site API Call

As you can see in the deployed site API call, the Request URL is completely different and there is an /undefined/ part in the API call. I don't know what's causing this problem. Here is the Github link to the project: Project Github Link

Please help me find the solution. Thanks in advance

Edit: I did some more research and figured that the problem may be caused by the axios call. There is baseURL, headers, and params in my axios call and I didn't defined them in the Netlify deploy. Here is my axios call: Axios Call and here is my package.json file: package.json . How can I define them in netlify?

Upvotes: 0

Views: 1200

Answers (2)

mucahitduz
mucahitduz

Reputation: 3

I found a solution and wanted to post it here so it can help others. I tried deploying my build file to Netlify manuelly and the site is working now.

Upvotes: 0

David Jones
David Jones

Reputation: 106

Have you added your environment variables to Netlify?

api_key = process.env.REACT_APP_API_KEY  
api_host = process.env.REACT_APP_API_HOST
api_base_url = process.env.REACT_APP_API_BASE_URL

If you don't declare the above variables in your Netlify project it won't know what values to insert, which is why they are currently undefined. Visit this link for more information: Netlify Environment Variables

Upvotes: 1

Related Questions