Lỗi CORS đầu tiên của tôi trong FastAPI
Tôi học bằng cách thực hành xây dựng. Tôi đã xây dựng một ứng dụng theo dõi chi tiêu. Tôi sử dụng FastAPI cho backend. Tôi sử dụng HTML và JavaScript cho frontend.
Server đã khởi động. Swagger UI hoạt động bình thường. Trang HTML bị lỗi. Nút Load Expenses không có phản hồi gì.
Tôi đã kiểm tra mã Python của mình. Tôi đã kiểm tra yêu cầu fetch. Mọi thứ trông vẫn ổn.
Tôi mở console của trình duyệt. Tôi thấy một lỗi màu đỏ. CORS đã chặn yêu cầu.
Frontend sử dụng cổng 3000. Backend sử dụng cổng 8000. Trình duyệt nhận thấy các origin khác nhau. Nó đã chặn kết nối.
Tôi đã thêm CORSMiddleware vào mã FastAPI của mình. Tôi đã cho phép origin http://127.0.0.1:3000. Lỗi đã biến mất.
Bài học dành cho bạn:
- Hãy mở console trình duyệt trước tiên.
- Kiểm tra API của bạn một cách riêng biệt.
- Lỗi CORS xảy ra ở trình duyệt. Chúng không phải là lỗi code.
Nguồn: https://dev.to/bynilotpal/my-first-cors-error-in-fastapi-2hf6