英文:
Handling CORS form submissions
问题
我有一个非常简单的表单，从localhost:3000提供。
<!-- language: html -->
<form id="my-HTML-form" action="http://localhost:8080" method="POST">
<input type="text" placeholder="用户名" name="username" />
<input type="password" placeholder="密码" name="password" />
<input type="hidden" name="form-id" value="login" />
<button type="submit">提交</button>
</form>
在localhost:8080上，我有一个非常简单的Go服务器：
<!-- language: Go -->
package main
import (
"log"
"net/http"
)
func main() {
// 启动服务器
http.HandleFunc("/", handler)
serverErr := http.ListenAndServe(":8080", nil)
if serverErr != nil {
log.Println("启动服务器时出错")
log.Fatal(serverErr)
}
}
func handler(w http.ResponseWriter, r *http.Request) {
log.Println(r.Header.Get("Origin"))
log.Println(r.Method)
w.Header().Set("Access-Control-Allow-Origin", "*")
w.Header().Set("Access-Control-Allow-Methods", "GET, POST, OPTIONS")
w.Header().Set("Access-Control-Allow-Headers",
"Accept, Accept-Encoding, Authorization, Content-Length, Content-Type, Origin, X-CSRF-Token")
w.WriteHeader(http.StatusOK)
}
当我提交表单时，实际上会收到两个请求！一个是POST请求，一个是GET请求！这是我在单次提交后的控制台输出：
$ http://localhost:3000
$ POST
$
$ GET
请注意，GET请求没有附加来源。我想执行一些逻辑，然后根据成功或失败将用户重定向到不同的URL。但是我无法做到这一点，因为GET请求紧随POST请求之后。我可以使用AJAX，没有问题，但我希望找到一个简单的HTML表单提交的解决方案。
有什么想法、建议吗？所有的浏览器都遵循POST/Redirect/Get范例吗？谢谢。
英文:
I have a very simple form being served from localhost:3000
<!-- language: html -->
<form id="my-HTML-form" action="http://localhost:8080" method="POST">
<input type="text" placeholder="Username" name="username" />
<input type="password" placeholder="Password" name="password" />
<input type="hidden" name="form-id" value="login" />
<button type="submit">Submit</button>
</form>
On localhost:8080, I have a very simple go server:
<!-- language: Go -->
package main
import (
"log"
"net/http"
)
func main() {
// Start the server
http.HandleFunc("/", handler)
serverErr := http.ListenAndServe(":8080", nil)
if serverErr != nil {
log.Println("Error starting server")
log.Fatal(serverErr)
}
}
func handler(w http.ResponseWriter, r *http.Request) {
log.Println(r.Header.Get("Origin"))
log.Println(r.Method)
w.Header().Set("Access-Control-Allow-Origin", "*")
w.Header().Set("Access-Control-Allow-Methods", "GET, POST, OPTIONS")
w.Header().Set("Access-Control-Allow-Headers",
"Accept, Accept-Encoding, Authorization, Content-Length, Content-Type, Origin, X-CSRF-Token")
w.WriteHeader(http.StatusOK)
}
When I submit my form, I actually receive two requests! A POST and a GET! Here is my console after a SINGLE submit:
$ http://localhost:3000
$ POST
$
$ GET
Notice the GET request doesn't have an origin attached to it. I'm trying to perform some logic and then redirect the user to different url's based on success or failure. But I can't do this because the GET request immediately follows the POST request. I can use AJAX, no problem, but I was hoping to find a solution for a simple html form submission.
Any thoughts, ideas? Do all browsers follow the POST/Redirect/Get paradigm and I'm SOL?
Thanks.
答案1
得分: 1
我假设你的表单操作是 action="http://localhost:8080"，因为你说这是一个跨域请求。
第二个GET请求是对favicon的请求（正如elithrar在评论中指出的）。只需执行log.Println(r.URL)以确保。虽然我不确定为什么浏览器没有添加origin头。
你可以通过将w.WriteHeader(http.StatusOK)替换为例如http.Redirect(w, r, "http://localhost:3000/success.html", http.StatusSeeOther)来重定向请求。
英文:
I assume your form action is action="http://localhost:8080" because you said this is a cross origin request.
The second GET request is the request for favicon (as elithrar points out in comments). Just do a log.Println(r.URL) to make sure. I am not sure why the browser does not add origin header to it though.
You can redirect requests by replacing w.WriteHeader(http.StatusOK) by for example,
http.Redirect(w, r, "http://localhost:3000/success.html", http.StatusSeeOther).
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论