web-dev-qa-db-fra.com

La demande HTTP est bloquée par la stratégie CORS pour Flutter Web

J'ai une application Android, iOS et Web qui utilise php comme backend. Toutes les API fonctionnent bien dans les deux Android et iOS mais jetant une erreur de Cors dans Web. Obtenir une erreur comme celle-ci

Accès à XMLHTTPRequest à 'https://example.com/api' de l'origine 'http: // localhost: 49168' a été bloqué par la stratégie CORS: Aucune en-tête "Access-Control-Autory-Origin" est présente sur la ressource demandée .

J'ai essayé d'envoyer des en-têtes: {'Access-Control-Abed-Origin': 'http: // localhost: 49168', "Origine": "http: // localhost: 49168"}, à la demande HTTP. Web fonctionne correctement si j'ajoute une extension Cors pour Chrome. Sil te plait aide moi

flutterflutter-web
5
Kavana Shettigar

Les mêmes problèmes me frappent il y a deux semaines. Pour moi, l'erreur suivante me donne une mauvaise direction pour vérifier le problème:

Accès à XMLHTTPRequest à 'https://example.com/api' de l'origine 'http: // localhost: 49168' a été bloqué par la stratégie CORS: Aucune en-tête "Access-Control-Autory-Origin" est présente sur la ressource demandée .

Il dit quelque chose sur la demande, mais s'avère que cela n'avait rien à voir avec la demande. Et cela n'avait également rien à voir avec le serveur Web (Apache ou nginx dans mon cas).

La solution consiste à ajouter de l'en-tête à la réponse (oui ,réponse) de votre backend. Je ne connais pas la solution pour php code, mais j'utilise le code suivant dans mon backend Golang pour ajouter en-tête à la réponse:

// 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.")
    }
}
1
ישו אוהב אותך