CORS: режим учетных данных - 'include'

Да, я знаю, что вы думаете - еще один вопрос CORS, но на этот раз я в тупике.

Итак, для начала, фактическое сообщение об ошибке:

XMLHttpRequest не может загрузить http://localhost/Foo.API/token. Значение заголовка "Access-Control-Allow-Origin" в ответе не должно быть подстановочным знаком "*", если режим учетных данных запроса "включить". Источник ' http://localhost: 5000 ', следовательно, не имеет доступа. Режим учетных данных запросов, инициируемых XMLHttpRequest, управляется атрибутом withCredentials.

Я не уверен, что подразумевается под режимом учетных данных "включить"?

Поэтому, когда я выполняю запрос в почтальоне, я не вижу такой ошибки:

enter image description here

Но когда я получаю доступ к тому же запросу через мое веб-приложение angularjs, я озадачен этой ошибкой. Вот мой запрос/ответ angualrjs. Как вы увидите, ответ OK 200, но я все еще получаю сообщение об ошибке CORS:

Fiddler Запрос и ответ:

На следующем рисунке показан запрос и ответ от веб-интерфейса к API

Fiddler

На основании всех других постов, которые я читал в Интернете, кажется, что я поступаю правильно, поэтому я не могу понять ошибку. И наконец, вот код, который я использую в angualrjs (фабрика входа):

enter image description here

Реализация CORS в API. Справочные цели:

Метод 1 используется:

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);
    }
}

Используемый метод 2:

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

    ConfigureOAuth(app);

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

}

Спасибо заранее!

Ответы

Ответ 1

Проблема связана с вашим угловым кодом:

Когда withCredentials имеет значение true, он пытается отправить учетные данные или файлы cookie вместе с запросом. Поскольку это означает, что другой источник потенциально пытается выполнить аутентифицированные запросы, подстановочный знак ("*") не разрешен в качестве заголовка "Access-Control-Allow-Origin".

Вы должны были бы явно ответить с источником, который сделал запрос в заголовке "Access-Control-Allow-Origin", чтобы сделать эту работу.

Я бы порекомендовал явно внести в белый список источники, которые вы хотите разрешить делать аутентифицированные запросы, потому что простой ответ с источником из запроса означает, что любой данный веб-сайт может делать аутентифицированные вызовы к вашему бэкэнду, если у пользователя случился допустимый сеанс.

Я объясняю это в этой статье, которую я написал некоторое время назад.

Таким образом, вы можете установить withCredentials в false или реализовать белый список происхождения и отвечать на запросы CORS с действительным источником всякий раз, когда задействованы учетные данные

Ответ 2

Настройка CORS для Angular 5 и Spring Security (базовое решение Cookie)

Со стороны Angular требуется добавить опцию флага withCredentials: true для транспорта Cookie:

constructor(public http: HttpClient) {
}

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

На стороне сервера Java требуется добавить CorsConfigurationSource для настройки политики CORS:

@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()...
    }
}

Метод configure(HttpSecurity http) по умолчанию будет использовать corsConfigurationSource для http.cors()

Ответ 3

Если вы используете промежуточное ПО CORS и хотите отправить с помощью Credential boolean true, вы можете настроить CORS следующим образом:

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

Ответ 4

Если это помогло, я использовал центрифугу в своем приложенииactjs и, проверив некоторые комментарии ниже, посмотрел файл библиотеки centrifuge.js, в моей версии которого был следующий фрагмент кода:

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

После того, как я удалил эти три строки, приложение работало нормально, как и ожидалось.

Надеюсь, поможет!

Ответ 5

Если вы используете .NET Core, вам потребуется .AllowCredentials() при настройке CORS в Startup.CS.

Внутри ConfigureServices

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

services.AddMvc();

Тогда внутри Configure:

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

Для меня это были просто пропущенные параметры. AllowCredentials() вызвал упомянутую вами ошибку. Как примечание в целом для других, имеющих также проблемы с CORS, порядок имеет значение, и AddCors() должен быть зарегистрирован до AddMVC() внутри вашего класса запуска.