Mixed Content Issue in FastAPI Application - Some Endpoints Work with HTTPS, Others Don't
The Problem
I'm facing a "mixed content" issue in my web application that uses FastAPI for the backend. Although the initial page loads over HTTPS, specific endpoints (like /categorias/) are still being accessed via HTTP, causing the following error in the browser:
Mixed content: load all resources via HTTPS to improve the security of your siteEven though the initial HTML page is loaded over a secure HTTPS connection, some resources like images, stylesheets or scripts are being accessed over an insecure HTTP connection.
1 resource
Name: categorias/
Restriction Status: blocked
What's interesting is that other endpoints like /whitelist/ work perfectly with HTTPS.
My Setup
- Frontend: React with fetch for API calls
- Backend: FastAPI
- Hosting: Vps + Coolify + Docker
- API base URL correctly configured to https
What I've Tried
- Checked all frontend code to ensure no hardcoded URLs using HTTP
- Confirmed I'm using the API_URL constant properly in all calls
- Cleared browser cache
- Compared FastAPI routers for working endpoints (whitelist) vs. non-working ones (categorias) - both appear to be configured the same way
- Checked for any different CORS configuration between endpoints
Relevant Code
Categories Router (problematic):
router = APIRouter(prefix="/categorias", tags=["Categorias"])@router.get("/", response_model=list[Categoria])def listar_categorias( session: Session = Depends(get_session), tenant_id: str = Depends(get_tenant_id)): categorias = session.exec( select(Categoria).where(Categoria.tenant_id == tenant_id) ).all() return categorias## Update:Still don't know why and how to fix properly, but found a workaround @app.middleware("http")async def rewrite_http_to_https(request, call_next): response = await call_next(request) # Check if response is a redirect if response.status_code in [301, 302, 303, 307, 308] and "location" in response.headers: if response.headers["location"].startswith("http:"): response.headers["location"] = response.headers["location"].replace("http:", "https:", 1) return response