ਮੇਰੀ FastAPI ਵਿੱਚ ਪਹਿਲੀ CORS Error
ਮੈਂ ਬਣਾ ਕੇ ਸਿੱਖਦਾ ਹਾਂ। ਮੈਂ ਇੱਕ expense tracker ਬਣਾਇਆ। ਮੈਂ ਬੈਕਐਂਡ ਲਈ FastAPI ਦੀ ਵਰਤੋਂ ਕੀਤੀ। ਮੈਂ ਫਰੰਟਐਂਡ ਲਈ HTML ਅਤੇ JavaScript ਦੀ ਵਰਤੋਂ ਕੀਤੀ।
ਸਰਵਰ ਸ਼ੁਰੂ ਹੋ ਗਿਆ। Swagger UI ਕੰਮ ਕਰ ਰਿਹਾ ਸੀ। HTML ਪੇਜ ਫੇਲ ਹੋ ਗਿਆ। Load Expenses ਬਟਨ ਨੇ ਕੁਝ ਨਹੀਂ ਕੀਤਾ।
ਮੈਂ ਆਪਣਾ Python ਕੋਡ ਚੈੱਕ ਕੀਤਾ। ਮੈਂ ਆਪਣੀ fetch request ਚੈੱਕ ਕੀਤੀ। ਕੁਝ ਵੀ ਗਲਤ ਨਹੀਂ ਲੱਗ ਰਿਹਾ ਸੀ।
ਮੈਂ ਬ੍ਰਾਊਜ਼ਰ ਕੰਸੋਲ ਖੋਲ੍ਹਿਆ। ਮੈਨੂੰ ਇੱਕ ਲਾਲ ਰੰਗ ਦੀ error ਦਿਖਾਈ ਦਿੱਤੀ। CORS ਨੇ request ਨੂੰ ਰੋਕ ਦਿੱਤਾ।
ਫਰੰਟਐਂਡ port 3000 ਦੀ ਵਰਤੋਂ ਕਰ ਰਿਹਾ ਸੀ। ਬੈਕਐਂਡ port 8000 ਦੀ ਵਰਤੋਂ ਕਰ ਰਿਹਾ ਸੀ। ਬ੍ਰਾਊਜ਼ਰ ਨੇ ਵੱਖਰੇ origins ਦੇਖੇ। ਇਸਨੇ ਕਨੈਕਸ਼ਨ ਨੂੰ ਰੋਕ ਦਿੱਤਾ।
ਮੈਂ ਆਪਣੇ FastAPI ਕੋਡ ਵਿੱਚ CORSMiddleware ਜੋੜਿਆ। ਮੈਂ origin http://127.0.0.1:3000 ਨੂੰ ਇਜਾਜ਼ਤ ਦਿੱਤੀ। Error ਗਾਇਬ ਹੋ ਗਈ।
ਤੁਹਾਡੇ ਲਈ ਸਬਕ:
- ਸਭ ਤੋਂ ਪਹਿਲਾਂ ਆਪਣਾ ਬ੍ਰਾਊਜ਼ਰ ਕੰਸੋਲ ਖੋਲ੍ਹੋ।
- ਆਪਣੀ API ਨੂੰ ਵੱਖਰੇ ਤੌਰ 'ਤੇ ਟੈਸਟ ਕਰੋ।
- CORS errors ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਹੁੰਦੀਆਂ ਹਨ। ਇਹ ਕੋਡ ਦੇ bugs ਨਹੀਂ ਹਨ।
Source: https://dev.to/bynilotpal/my-first-cors-error-in-fastapi-2hf6