Golang REST API PUT 和 DELETE 请求在使用 Javascript 从 HTML 页面调用时不起作用

问题描述

我正在尝试在 Go 中编写 REST API，当我通过 postman 运行时，所有方法都可以正常工作，但是当使用 JAVA Script 函数从 HTML 页面调用 PUT 和 Delete 方法时，它不起作用。是否有相同的替代方案？

这是我在 main.go 文件中的 Go 处理程序。

func main() {
    router := mux.NewRouter()
    router.HandleFunc("/",HomePageHandler).Methods("GET")
    router.HandleFunc("/demo",CreateDemoDetail).Methods("POST") // Add New row
    router.HandleFunc("/demo",GetAllDemoDetails).Methods("GET") // Fetch all details
    router.HandleFunc("/demo/{id}",GetDemoDetail).Methods("GET") // Fetch Single row
    router.HandleFunc("/demo",UpdateDemoDetails).Methods("PUT") // Update Single row
    router.HandleFunc("/demo",DeleteDemo).Methods("DELETE")     // Delete Single row
    log.Fatal(http.ListenAndServe(":8080",router))
}

以下是调用处理程序的Java Script函数，

 function submitForm(reqtype){
          var form = document.getElementById("demoform");      
    
          if (reqtype == "Delete"){
            form.action = 'http://localhost:8080/demo';
           form.method='PUT';      
          }
          if (reqtype == "Update"){
            form.action = 'http://localhost:8080/demo';
            form.method='DELETE';      
    
          }      
    
          form.submit();
        }
      </script>

如果我将处理程序更改为 router.HandleFunc("/updatedemo",UpdateDemoDetails).Methods("POST") 不仅仅是 /demo 和 POST 它的方法从 java 脚本工作，但不是当它的 demo/ 和方法是放置/删除。

有趣的是，当端点为 demo/ 或 get demo 且方法为 POST/GET/PUT/Delete 时，它与 Postman 完美配合。但不是来自带有 Javascript 调用的 HTML 表单。

我应该采取的最佳方法是什么？

解决方法

method attribute 仅支持 GET 和 POST HTTP 动词。

要使用 PUT 或 DELETE，您需要使用 fetch 或 XMLHttpRequest 发出请求。

经过一番研究，我找到了解决问题的方法。现在我可以将 URL 保留为“demo/”以处理所有操作（POST/GET/PUT/DELETE）。

我在 main.go 页面中创建了一个 HTTP 方法覆盖函数，还有一个隐藏的文本文件，它提供了来自 HTML 页面的实际方法名称。使用此字段，来自 JAva 脚本的 Post/Get 请求将在服务器端转换为 PUT/DELETE。

main.go

func main() {
    router := mux.NewRouter()
    router.HandleFunc("/",HomePageHandler)

    router.HandleFunc("/demo",formHandler)        // Handle all POST/GET/PUT/DELETE requests
    err := http.ListenAndServe(":8080",router)
}



func formHandler(w http.ResponseWriter,r *http.Request) {

    method := r.FormValue("_method")        
    fmt.Println(method)

    if method == "PUT" || method == "DELETE" {
        r.Method = method

    }

    switch r.Method {
    case "GET":
        t,err := template.New("form").Parse("form")
        if err != nil {
            http.Error(w,err.Error(),500)
        }
        // View All Demo
        GetAllDemoDetails(w,r)
        fmt.Println(t)
    case "POST":
        // Add New Demo
        CreateDemoDetail(w,r)
    case "PUT":
        // Update Demo
        UpdateDemoDetails(w,r)
    case "DELETE":
        // Delete Demo
        DeleteDemo(w,r)
    default:
        HomePageHandler(w,r)
    }
}

从 HTML 页面修改 JAVAScript。

<script>
    function submitForm(reqtype){
      var form = document.getElementById("demoform");      

      if (reqtype == "Delete"){
        form._method.value="DELETE"        
        form.action = 'http://localhost:8080/demo';

      }
      if (reqtype == "Update"){
        form._method.value="PUT"
        form.action = 'http://localhost:8080/demo';
      }            
      form.method='POST';              
      form.submit();
    }
  </script>

以及在请求中将 Delete/PUT 方法传递给服务器的所有重要的隐藏字段。

<input type="hidden" name="_method">
<button type="button" onclick="submitForm('Update');">Update</button>

尽管此解决方案有效，但我想知道这是否是我可以采取的最佳方法？ 请求 Golang 堆栈社区分享您的宝贵想法。

如果您的网络服务器运行的主机/端口不是您的 API，我会查看 CORS (https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)。

按照评论中的建议，检查您的浏览器 JS 日志/控制台。如果 CORS 是您的问题，应该有明确的错误消息。

go golang-migrate html javascript