http请求被用于Flatter web的Cors策略阻止

Question

我有一个Android、Ios和web应用程序，它使用php作为后端。所有Api在android和ios中都运行良好，但在web中抛出CORS错误。得到这样的错误

访问位于“”的XMLHttpRequesthttps://example.com/api“起源”http://localhost:49168'已被CORS策略阻止：请求的资源上不存在'Access Control Allow Origin'标头。

我试图发送标题：{'Access-Control-Allow-Origin'：'http://localhost:49168“，“来源”：”http://localhost:49168“}，发送到http请求。如果我为chrome添加CORS扩展，Web将顺利运行。请帮帮我

Answer 1

两周前我也遇到了同样的问题。对我来说，以下错误给了我检查问题的错误方向：

访问位于“”的XMLHttpRequesthttps://example.com/api“起源”http://localhost:49168'已被CORS策略阻止：请求的资源上不存在'Access Control Allow Origin'标头。

它说了一些关于请求的事情，但事实证明它与请求无关。而且它也与Web服务器无关（在我的例子中，apache或nginx）。

解决方案是从后端向响应（是，响应）添加头。我不知道phpcode的解决方案，但我在我的golang后端使用以下代码向响应添加标题：

// Adding CORS header to response.
func (server *WebUploadServer) addCorsHeader(res http.ResponseWriter) {
    headers := res.Header()
    // use your domain or ip address instead of "*".
    // Using "*" is allowing access from every one
    // only for development.
    headers.Add("Access-Control-Allow-Origin", "*")
    headers.Add("Vary", "Origin")
    headers.Add("Vary", "Access-Control-Request-Method")
    headers.Add("Vary", "Access-Control-Request-Headers")
    headers.Add("Access-Control-Allow-Headers", "Content-Type, Origin, Accept, token")
    headers.Add("Access-Control-Allow-Methods", "GET, POST, OPTIONS")
}


// Here we handle the web request.
func (server *WebUploadServer) webHandler(w http.ResponseWriter, r *http.Request) {
    fmt.Println("Endpoint hit")

    server.addCorsHeader(w) // Here, we add the header to the response

    switch r.Method {
    case "POST":
        // do something here.
    case "OPTIONS":
        w.WriteHeader(http.StatusOK)
    case "GET":
        fallthrough
    default:
        fmt.Fprintf(w, "Sorry, only  POST method is supported.")
    }
}