html - 处理 CORS 表单提交

Question

我有一个非常简单的表单，由 localhost:3000 提供

<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>

在 localhost:8080 上，我有一个非常简单的 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)
}

当我提交表单时，我实际上收到了两个请求!一个 POST 和一个 GET!这是单次提交后我的控制台:

$ http://localhost:3000
$ POST
$ 
$ GET

请注意，GET 请求没有附加来源。我试图执行一些逻辑，然后根据成功或失败将用户重定向到不同的 url。但我不能这样做，因为 GET 请求紧跟在 POST 请求之后。我可以使用 AJAX，没问题，但我希望找到一个简单的 html 表单提交解决方案。

有什么想法、想法吗？是否所有浏览器都遵循 POST/Redirect/Get范式，我是 SOL？

谢谢。

Answer 1

我假设您的表单操作是 action="http://localhost:8080" 因为您说这是一个跨源请求。

第二个 GET 请求是对网站图标的请求(正如 elithrar 在评论中指出的那样)。只需执行 log.Println(r.URL) 即可确定。我不确定为什么浏览器不向其添加原始 header 。

您可以通过替换 w.WriteHeader(http.StatusOK) 来重定向请求，例如，http.Redirect(w, r, "http://localhost:3000/success.html", http.StatusSeeOther)。