CORS: Der Anmeldeinformationsmodus ist "Einschließen".

Ja, ich weiß, was Sie denken - noch eine CORS-Frage, aber diesmal bin ich ratlos.

Um zu beginnen, die eigentliche Fehlermeldung:

XMLHttpRequest kann http: //localhost/Foo.API/token nicht laden . Der Wert des Headers 'Access-Control-Allow-Origin' in der Antwort darf nicht der Platzhalter '*' sein, wenn der Anmeldeinformationsmodus der Anforderung 'include' ist . Origin ' http: // localhost: 5000 ' ist daher kein Zugriff gestattet. Der Anmeldeinformationsmodus von Anforderungen, die von XMLHttpRequest initiiert wurden, wird durch das Attribut withCredentials gesteuert.

Ich bin nicht sicher, was unter Anmeldeinformationsmodus "Einschließen" zu verstehen ist.

Wenn ich also die Anfrage beim Postboten ausführe, tritt kein solcher Fehler auf:

Wenn ich jedoch über meine AngularJS-Webanwendung auf dieselbe Anfrage zugreife, bin ich von diesem Fehler überrascht. Hier ist meine angualrjs Anfrage / Antwort. Wie Sie sehen werden, lautet die Antwort OK 200, aber ich erhalte immer noch den CORS-Fehler:

Fiddler Anfrage und Antwort:

Das folgende Bild zeigt die Anforderung und Antwort vom Web-Front-End an die API

Basierend auf all den anderen Posts, die ich online gelesen habe, scheint es , als würde ich das Richtige tun. Deshalb kann ich den Fehler nicht verstehen. Zum Schluss hier der Code, den ich in angualrjs (Login Factory) verwende:

CORS-Implementierung in API - Referenzzwecke:

Methode 1 verwendet:

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        EnableCrossSiteRequests(config);
    }

    private static void EnableCrossSiteRequests(HttpConfiguration config)
    {
        var cors = new EnableCorsAttribute("*", "*", "*")
        {
            SupportsCredentials = true
        };
        config.EnableCors(cors);
    }
}

Methode 2 verwendet:

public void Configuration(IAppBuilder app)
{
    HttpConfiguration config = new HttpConfiguration();

    ConfigureOAuth(app);

    WebApiConfig.Register(config);
    app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
    app.UseWebApi(config);

}

Vielen Dank im Voraus!

Das Problem ergibt sich aus Ihrem Angular-Code:

Wenn withCredentialstrue festgelegt ist, wird versucht, Anmeldeinformationen oder Cookies zusammen mit der Anforderung zu senden. Da dies bedeutet, dass ein anderer Ursprung möglicherweise versucht, authentifizierte Anforderungen auszuführen, ist der Platzhalter ("*") als Header "Access-Control-Allow-Origin" nicht zulässig.

Sie müssten explizit mit dem Ursprung antworten, der die Anforderung im Header "Access-Control-Allow-Origin" gestellt hat, damit dies funktioniert.

Ich würde empfehlen, die Ursprünge, die Sie für authentifizierte Anfragen zulassen möchten, explizit auf die Whitelist zu setzen, da eine einfache Beantwortung des Ursprungs der Anfrage bedeutet, dass jede Website authentifizierte Anrufe an Ihr Backend tätigen kann, wenn der Benutzer zufällig eine gültige Sitzung hat.

Ich erkläre dieses Zeug in diesem Artikel, den ich vor einiger Zeit geschrieben habe.

Sie können also entweder withCredentialsauf false setzen oder eine Ursprungs-Whitelist implementieren und auf CORS-Anfragen mit einem gültigen Ursprung antworten, wenn Anmeldeinformationen betroffen sind

Wenn Sie CORS-Middleware verwenden und withCredentialsboolean true senden möchten , können Sie CORS folgendermaßen konfigurieren:

var cors = require('cors');    
app.use(cors({credentials: true, origin: 'http://localhost:5000'}));

`

Anpassen von CORS für Angular 5 und Spring Security (Cookie-Basislösung)

Auf der Winkelseite muss das Optionsflag withCredentials: truefür den Cookie-Transport hinzugefügt werden:

constructor(public http: HttpClient) {
}

public get(url: string = ''): Observable<any> {
    return this.http.get(url, { withCredentials: true });
}

Auf der Java-Serverseite muss CorsConfigurationSourcefür die Konfiguration eine CORS-Richtlinie hinzugefügt werden:

@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Bean
    CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        // This Origin header you can see that in Network tab
        configuration.setAllowedOrigins(Arrays.asList("http:/url_1", "http:/url_2")); 
        configuration.setAllowedMethods(Arrays.asList("GET","POST"));
        configuration.setAllowedHeaders(Arrays.asList("content-type"));
        configuration.setAllowCredentials(true);
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration);
        return source;
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.cors().and()...
    }
}

Die Methode configure(HttpSecurity http)wird standardmäßig corsConfigurationSourcefür verwendethttp.cors()

Wenn Sie .NET Core verwenden, müssen Sie beim Konfigurieren von CORS in Startup.CS .AllowCredentials () verwenden.

Innerhalb von ConfigureServices

services.AddCors(o => {
    o.AddPolicy("AllowSetOrigins", options =>
    {
        options.WithOrigins("https://localhost:xxxx");
        options.AllowAnyHeader();
        options.AllowAnyMethod();
        options.AllowCredentials();
    });
});

services.AddMvc();

Dann innerhalb von Configure:

app.UseCors("AllowSetOrigins");
app.UseMvc(routes =>
    {
        // Routing code here
    });

Für mich fehlten speziell nur options.AllowCredentials (), die den von Ihnen erwähnten Fehler verursachten. Als Randnotiz für andere, die ebenfalls CORS-Probleme haben, müssen die Ordnungsangelegenheiten und AddCors () vor AddMVC () in Ihrer Startup-Klasse registriert werden.

Wenn es hilft, habe ich centrifuge mit meiner reactjs-App verwendet. Nachdem ich einige Kommentare unten überprüft hatte, habe ich mir die Bibliotheksdatei centrifuge.js angesehen, die in meiner Version den folgenden Codeausschnitt enthielt:

if ('withCredentials' in xhr) {
 xhr.withCredentials = true;
}

Nachdem ich diese drei Zeilen entfernt hatte, funktionierte die App wie erwartet einwandfrei.

Ich hoffe es hilft!