i have develop app in fast api like book translator
meatitd11
FREEOP

10 months ago

i have develop app in fast api like book translator if i can translate large file face this issue how to solve this tell me about ?

when my file half translate face this erro why ?

:1 Access to XMLHttpRequest at 'https://exciting-stillness-venv.up.railway.app/api/translate' from origin 'https://book-translator-ui.vercel.app' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.Understand this error TranslationService.js:240 Translation error: AxiosError {message: 'Network Error', name: 'AxiosError', code: 'ERR_NETWORK', config: {…}, request:

XMLHttpRequest, …} translateDocument @ TranslationService.js:240 await in translateDocument handleSubmit @ TranslationForm.jsx:135 callCallback2 @ chunk-6BKLQ22S.js?v=b46cab8a:3674 invokeGuardedCallbackDev @ chunk-6BKLQ22S.js?v=b46cab8a:3699 invokeGuardedCallback @ chunk-6BKLQ22S.js?v=b46cab8a:3733 invokeGuardedCallbackAndCatchFirstError @ chunk-6BKLQ22S.js?v=b46cab8a:3736 executeDispatch @ chunk-6BKLQ22S.js?v=b46cab8a:7014 processDispatchQueueItemsInOrder @ chunk-6BKLQ22S.js?v=b46cab8a:7034 processDispatchQueue @ chunk-6BKLQ22S.js?v=b46cab8a:7043 dispatchEventsForPlugins @ chunk-6BKLQ22S.js?v=b46cab8a:7051 (anonymous) @ chunk-6BKLQ22S.js?v=b46cab8a:7174 batchedUpdates$1 @ chunk-6BKLQ22S.js?v=b46cab8a:18913 batchedUpdates @ chunk-6BKLQ22S.js?v=b46cab8a:3579 dispatchEventForPluginEventSystem @ chunk-6BKLQ22S.js?v=b46cab8a:7173 dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay @ chunk-6BKLQ22S.js?v=b46cab8a:5478 dispatchEvent @ chunk-6BKLQ22S.js?v=b46cab8a:5472 dispatchDiscreteEvent @ chunk-6BKLQ22S.js?v=b46cab8a:5449Understand this error TranslationForm.jsx:182 Translation error: AxiosError {message: 'Network Error', name: 'AxiosError', code: 'ERR_NETWORK', config: {…}, request: XMLHttpRequest, …}

Solved$10 Bounty

Pinned Solution

idiegea21
HOBBY

10 months ago

Hello,

Your FastAPI backend isn't allowing requests from your Vercel frontend due to missing CORS headers. To fix it, add CORSMiddleware in your FastAPI app with allow_origins=["https://book-translator-ui.vercel.app"]. This should stop the browser from blocking cross-origin requests and also reveal real backend errors if translation fails halfway.

2 Replies

10 months ago

Do you have the CORS Middleware properly configured in your FastAPI app? See https://fastapi.tiangolo.com/tutorial/cors


idiegea21
HOBBY

10 months ago

Hello,

Your FastAPI backend isn't allowing requests from your Vercel frontend due to missing CORS headers. To fix it, add CORSMiddleware in your FastAPI app with allow_origins=["https://book-translator-ui.vercel.app"]. This should stop the browser from blocking cross-origin requests and also reveal real backend errors if translation fails halfway.


Status changed to Solved chandrika 10 months ago


Welcome!

Sign in to your Railway account to join the conversation.

Loading...