CORS 挫败感答案

【问题标题】：CORS frustrationCORS 挫败感
【发布时间】：2017-08-07 22:37:04
【问题描述】：

已经挖了几个小时了。

我有 vue.js 代码：

$(document).ready(function() {
  var vue = new Vue({
    el: '#login',
    data: {
      logged_in: false,
      username: "",
      password: "",
      csrf_token: "",
    },
    methods: {
      login: function() {
        $.ajax({
          url: apiEndpoint + '/login/', 
          type: "POST", 
          dataType: "json",
          dataType: 'json',
          data: JSON.stringify({"username": username.value, 
          "password": password.value, 
          "csrf_token": this.csrf_token}), 
          success: (data) => {
            alert(1);
          }
        });
        return false;
      },
      getCsrfToken: function() {
        $.ajax({
          url: apiEndpoint + '/login/', 
          success: (data) => {
            this.csrf_token = data["Csrf_Token"];

            if(data["User_id"] !== "") {
              this.logged_in = true;
            }
          }
        });   
      }
    }
  });

  vue.getCsrfToken();
});

以及用 GO 代码编写的后端：

w.Header().Set("Access-Control-Allow-Origin", "*")
w.Header().Set("Access-Control-Allow-Headers", "Content-Type")
w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS")

fmt.Printf("METHOD - %s\n", r.Method)
if r.Method == "POST" {

我的服务器处理程序：

appmux := http.NewServeMux()

appmux.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.Dir("../www/static"))))
appmux.Handle("/assets/", http.StripPrefix("/assets/", http.FileServer(http.Dir("../www/assets"))))

appmux.Handle("/login/", commonMiddlewares(http.HandlerFunc(loginHandler)))
appmux.Handle("/logout/", secure(http.HandlerFunc(logoutHandler)))

浏览器发送 OPTIONS 请求就可以了。然后它尝试发送一个 POST 请求并得到 400，错误请求但后端甚至没有注册请求（fmt.Print..）。

为什么我的 Post 请求会得到 400？

谢谢！

编辑：图片！！

【问题讨论】：

你试过了吗？ w.Header().Set("Access-Control-Allow-Origin", r.Header.Get("Origin")).
刚才试了一下，现在连OPTIONS都没有注册。真的很混乱..
不，它确实注册了。但没有变化。 POST 仍然返回 400 并且没有在服务器上注册（ OPTIONS 确实注册并返回 okey ）。
在 Go 中，您使用什么来为应用程序提供服务？ http.ServeMux 或像 gorilla/mux 这样的第三方软件包？还有那个设置这些标头的处理程序它服务的路径是什么？ / 或 /login/ 或其他？
用服务器处理程序更新了问题

标签： google-chrome go cors vue.js

【解决方案1】：

您应该针对测试服务器测试您的代码，例如：https://www.posttestserver.com/，然后您可以转到http://posttestserver.com/data/ 并查看您的请求已发送，因为它可能没有发送您认为的内容。

【讨论】：