[解決済み] CORSポリシーによりブロックされました。プリフライトリクエストへのレスポンスがアクセスコントロールチェックを通過しない

質問

トリップサーバを作成しました。正常に動作しており POST をリクエストすることはできますが POST をリクエストすると、エラーが発生します。

has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: It does not have HTTP ok status.

axiosでのリクエストです。

let config = {
headers: {
  "Content-Type": "application/json",
  'Access-Control-Allow-Origin': '*',
  }
}

let data = {
  "id": 4
 }

 axios.post('http://196.121.147.69:9777/twirp/route.FRoute/GetLists', data, config)
   .then((res) => {
      console.log(res)
     })
    .catch((err) => {
      console.log(err)
   });
} 

私のgoファイルです。

func setupResponse(w *http.ResponseWriter, req *http.Request) {
    (*w).Header().Set("Access-Control-Allow-Origin", "*")
    (*w).Header().Set("Access-Control-Allow-Methods", "POST,GET,OPTIONS, PUT, DELETE")

    (*w).Header().Set("Access-Control-Allow-Headers", "Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization")
}


func WithUserAgent(base http.Handler) http.Handler {
    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {

    ctx := r.Context()
    ua := r.Header.Get("Jwt")
    ctx = context.WithValue(ctx, "jwt", ua)

    r = r.WithContext(ctx)

    setupResponse(&w, r)
     base.ServeHTTP(w, r)
  })
}

const (
    host     = "localhost"
    port     = 5432
    user     = "postgres"
    password = "postgres"
    dbname   = "postgres"
)

func main() {

    psqlInfo := fmt.Sprintf("host=%s port=%d user=%s "+
           "password=%s dbname=%s sslmode=disable",
               host, port, user, password, dbname)

    server := &s.Server{psqlInfo}

    twirpHandler := p.NewFinanceServiceServer(server, nil)

    wrap := WithUserAgent(twirpHandler)
      log.Fatalln(http.ListenAndServe(":9707", wrap))
}

インソムニアで前に言ったように、それは素晴らしい動作ですが、私たちはaxiosを作るとき POST をリクエストすると、ブラウザのコンソールに以下のように表示されます。

は CORS ポリシーによってブロックされました。プリフライトリクエストに対するレスポンスは、アクセス制御チェックを通過しません。HTTP ok ステータスを持ちません。

どのように解決するのですか？

これが最もシンプルな例だと思います。

header := w.Header()
header.Add("Access-Control-Allow-Origin", "*")
header.Add("Access-Control-Allow-Methods", "DELETE, POST, GET, OPTIONS")
header.Add("Access-Control-Allow-Headers", "Content-Type, Authorization, X-Requested-With")

のヘッダを追加することもできます。 Access-Control-Max-Age といった具合に、もちろん任意のヘッダやメソッドを許可することができます。

最後に、最初のリクエストに応答することを望みます。

if r.Method == "OPTIONS" {
    w.WriteHeader(http.StatusOK)
    return
}

を編集します（2019年6月）。 現在では ゴリラ を使うようになりました。 彼らのものはより活発にメンテナンスされており、本当に長い間これをやっています。 念のため、古いものへのリンクを残しておきます。

古いミドルウェアの推奨を以下に示します。 もちろん、これだけならミドルウェアを使った方が簡単かもしれません。 使ったことがないような気もしますが これ がお勧めみたいです。