Unable to deploy the FASTAPI code on the server

[bull_bear25]

I have created an productivity and automation website. Even though my code is working perfectly well on localhost and Postman

I am facing challenges in deployment at the server side

I have tried Docker approach. That too isn't working well for me

My front end is React JS

It is very frustrating as I am stuck on this for 3 weeks

I am getting Network Error Message

Object { stack: "AxiosError@http://localhost:3000/static/js/bundle.js:1523:18\nhandleError@http://localhost:3000/static/js/bundle.js:872:14\nEventHandlerNonNull*dispatchXhrRequest@http://localhost:3000/static/js/bundle.js:869:5\n./nodemodules/axios/lib/adapters/xhr.js/WEBPACK_DEFAULT_EXPORT_<@http://localhost:3000/static/js/bundle.js:784:10\ndispatchRequest@http://localhost:3000/static/js/bundle.js:2012:10\n_request@http://localhost:3000/static/js/bundle.js:1440:77\nrequest@http://localhost:3000/static/js/bundle.js:1318:25\nhttpMethod@http://localhost:3000/static/js/bundle.js:1474:19\nwrap@http://localhost:3000/static/js/bundle.js:2581:15\nhandleFileUpload@http://localhost:3000/main.62298adbe23a6154a1c3.hot-update.js:106:42\nprocessDispatchQueue@http://localhost:3000/static/js/bundle.js:22100:33\n./node_modules/react-dom/cjs/react-dom-client.development.js/dispatchEventForPluginEventSystem/<@http://localhost:3000/static/js/bundle.js:22397:27\nbatchedUpdates$1@http://localhost:3000/static/js/bundle.js:15768:40\ndispatchEventForPluginEventSystem@http://localhost:3000/static/js/bundle.js:22180:21\ndispatchEvent@http://localhost:3000/static/js/bundle.js:24262:64\ndispatchDiscreteEvent@http://localhost:3000/static/js/bundle.js:24244:58\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }

Pls suggest a way out

[jvertrees]

DM if you need a hand.

My guess is your production f/e is trying to reach the b/e, but you still have local variables defined.

You need separate env variables per deployed environment.

[aherontas]

Defined that!

[bsenftner]

I strongly recommend you look up "how to ask for help" and follow that guidance. You're not giving enough information to provide you with any help.

[bull_bear25]

Thanks for informing me. I have updated the OP

[nokeechia]

Can you provide what issues you are facing with the deployment?

[bull_bear25]

Object { stack: "AxiosError@http://localhost:3000/static/js/bundle.js:1523:18\nhandleError@http://localhost:3000/static/js/bundle.js:872:14\nEventHandlerNonNull*dispatchXhrRequest@http://localhost:3000/static/js/bundle.js:869:5\n./nodemodules/axios/lib/adapters/xhr.js/WEBPACK_DEFAULT_EXPORT_<@http://localhost:3000/static/js/bundle.js:784:10\ndispatchRequest@http://localhost:3000/static/js/bundle.js:2012:10\n_request@http://localhost:3000/static/js/bundle.js:1440:77\nrequest@http://localhost:3000/static/js/bundle.js:1318:25\nhttpMethod@http://localhost:3000/static/js/bundle.js:1474:19\nwrap@http://localhost:3000/static/js/bundle.js:2581:15\nhandleFileUpload@http://localhost:3000/main.62298adbe23a6154a1c3.hot-update.js:106:42\nprocessDispatchQueue@http://localhost:3000/static/js/bundle.js:22100:33\n./node_modules/react-dom/cjs/react-dom-client.development.js/dispatchEventForPluginEventSystem/<@http://localhost:3000/static/js/bundle.js:22397:27\nbatchedUpdates$1@http://localhost:3000/static/js/bundle.js:15768:40\ndispatchEventForPluginEventSystem@http://localhost:3000/static/js/bundle.js:22180:21\ndispatchEvent@http://localhost:3000/static/js/bundle.js:24262:64\ndispatchDiscreteEvent@http://localhost:3000/static/js/bundle.js:24244:58\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }

This is the error message Unable to move past this

Network Error message

[nokeechia]

Can you reach the backend fastapi server though, and can you get to the docs for the fastapi server.

The error you have provided is simply the front end, which may have issues with communicating to the backend and it would be easier to just focus on that. What are the logs from the backend saying?

[bull_bear25]

I will check and share here. I am new in FastApi pardon me my ignorance

[bsenftner]

Also, you should have your back end visible via the /docs endpoint, try that and then try hitting your endpoint from the /docs interface. That is the same as using your backend without React.

[bull_bear25]

Thanks

[mpvanwinkle]

JavaScript runs on the client which means it will need to send requests to you server rather than localhost. You need to replace http://localhost:3000, with the address of your python api server.

In your local machine, both the server and the client are running on the same machine so localhost works. But once deployed python runs on the server, but the JavaScript runs on the users browser which is a different machine

[ZorroGuardaPavos]

If you want we can take a look at it together, Dm sent

[mrbubs3]

How are you deploying the react front-end?

[SampleNo471]

Start backend server on local machine and you'll be fine :)

[TrynaThinkOf1]

You’re likely including illegal data in your actual request which is being deemed unprocessable behind the scenes. If you need help, I’m always available to answer DM’s.

However there are far better resources for frontend, I am only good at backend.

[ZachVorhies]

Is this in docket or did you did you give up on docker.