Submit form with redirect hits 2 times

[nasermirzaei89]

Here I have a login page:

https://github.com/nasermirzaei89/blog/blob/master/templates/login-page.gohtml#L10

<form method="post" action="/login" class="flex flex-col gap-2" x-target="login" x-target.away="_top">

and I set messages like error and success in the session, and on rendering page, I render and delete them.

in the login page, when I return error, it shows that as the notification section uses x-sync
https://github.com/nasermirzaei89/blog/blob/master/templates/page-footer.gohtml#L1

but on success, when I set the success message. it calls the page 2 times:

in the picture above, the first call response size is 2.4kb as it has the message rendered, but the second one is 2.3kb because the message renders only once.

So, the login message won't display after redirect.

Is there any suggested solution to it?

[imacrayon]

Unfortunately this is a limitation with fetch. Fetch doesn’t allow access to the location of a redirect without requesting the redirected content. That’s why you’ll see the page load twice.
We need to find a solution for this in the next release. The common workaround is to use the content in the first request and combine it with history.pushState to fake a redirect, but this causes other state management problems, for example, DOMContentLoaded won’t fire on a fake redirect, so JS won’t be initialized.

[nasermirzaei89]

So, is there any idea to change the login page behavior completely, so we don't face this issue?