I'm using the Google Load-Balancer with Cloud run where my webapp runs in a container and I configured the Load Balancer according to the manual where http can be forwarded to https and the https Load-Balancer is configured properly with the ssl certificate. My webapp runs with fastAPI. It is a very simple ToDo webapp from a tutorial.
Everything seems to work fine. When I type in my webpage http://example.com
I get forwarded to https://example.com
.
Now the strange part I'm not figuring out. I have a simple login page. The login page contains a form with a username, a password and a submit button:
(the layout contains the boostrap ui. I also tried semantic ui, with the same result)
{% include 'layout.html' %}
<div style="margin-top: 100px;" class="ui container">
<div class="ui card">
<div class="content">
<div class="header">
Login
</div>
<div class="description">
{% if msg %}
{% if msg == 'Logout Successful' or msg == 'User successfully created' %}
<div class="ui positive message">
<div class="header">Success</div>
<p>{{msg}}</p>
</div>
{% else %}
<div class="ui negative message">
<div class="header">Error</div>
<p>{{msg}}</p>
</div>
{% endif %}
{% endif %}
<form class="ui form" method="POST" action="/auth">
<div class="field">
<label>Username</label>
<input type="text" name="email" required>
</div>
<div class="field">
<label>Password</label>
<input type="password" name="password" required>
</div>
<button class="ui primary button" type="submit">Login</button>
</form>
</div>
</div>
<div class="extra content">
<a href="register">Register?</a>
</div>
</div>
</div>
My endpoint in my fastAPI app is:
@router.post("/", response_class=HTMLResponse)
async def login(request: Request, db: Session = Depends(get_db)):
try:
form = LoginForm(request)
await form.create_oauth_form()
url = todos_router.url_path_for("home")
response = RedirectResponse(url=url, status_code=status.HTTP_302_FOUND)
validate_user_cookie = await login_for_access_token(response=response, form_data=form, db=db)
if not validate_user_cookie:
msg = "Incorrect Username or Password"
return templates.TemplateResponse("login.html", {"request": request, "msg": msg})
return response
except HTTPException:
msg = "Unknown Error"
return templates.TemplateResponse("login.html", {"request": request, "msg": msg})
When I type-in a username and password I get the following "error" from the browser (Edge/Chrome):
BUT for some reason I can prevent this from happening by changing the type of the password field from
<div class="field">
<label>Password</label>
<input type="password" name="password" required>
</div>
to
<div class="field">
<label>Password</label>
<input type="text" name="password" required>
</div>
But of course I don't want to have a plain text field for the password. How can I fix this? Has anyone experienced this issue? Why is it possible to submit a form without an error when I don't use a password field?