Да, я знаю, о чем вы думаете - еще один вопрос CORS, но на этот раз я в тупике.
Итак, для начала фактическое сообщение об ошибке:
XMLHttpRequest не может загрузить http: //localhost/Foo.API/token . Значение заголовка «Access-Control-Allow-Origin» в ответе не должно быть подстановочным знаком «*», если режим учетных данных запроса - «включить» . Следовательно, к источнику ' http: // localhost: 5000 ' не разрешен доступ. Режим учетных данных запросов, инициированных XMLHttpRequest, управляется атрибутом withCredentials.
Я не уверен, что подразумевается под режимом учетных данных «включить» ?
Поэтому, когда я выполняю запрос в почтальоне, у меня нет такой ошибки:
Но когда я обращаюсь к тому же запросу через свое веб-приложение angularjs, эта ошибка меня ставит в тупик. Вот мой запрос / ответ angualrjs. Как вы увидите, ответ есть OK 200
, но я все еще получаю ошибку CORS:
Запрос и ответ Fiddler:
Следующее изображение демонстрирует запрос и ответ от веб-интерфейса к API.
Итак, судя по всем остальным сообщениям, которые я читал в Интернете, кажется, что я поступаю правильно, поэтому я не могу понять ошибку. Наконец, вот код, который я использую в angualrjs (фабрика входа в систему):
Реализация 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);
}
Спасибо заранее!
источник
*
- так что сторона сервера выполняет CORS неправильно - о, и почтальон работает, потому что это не запрос на перекрестное происхождениеaccess-control-allow-origin
ответ должен быть*
Ответы:
Проблема связана с вашим кодом Angular:
Если
withCredentials
установлено значение true, он пытается отправить учетные данные или файлы cookie вместе с запросом. Поскольку это означает, что другой источник потенциально пытается выполнить аутентифицированные запросы, подстановочный знак («*») не разрешен в качестве заголовка «Access-Control-Allow-Origin».Чтобы это сработало, вам нужно будет явно ответить источником, который сделал запрос, в заголовке «Access-Control-Allow-Origin».
Я бы порекомендовал явно занести в белый список источники, которым вы хотите разрешить выполнять аутентифицированные запросы, потому что простой ответ с источником из запроса означает, что любой данный веб-сайт может выполнять аутентифицированные вызовы на ваш сервер, если у пользователя есть действующий сеанс.
Я объясняю это в статье, которую написал некоторое время назад.
Таким образом, вы можете либо установить
withCredentials
значение false, либо реализовать белый список происхождения и отвечать на запросы CORS с действительным источником всякий раз, когда задействованы учетные данные.источник
Если вы используете промежуточное ПО CORS и хотите отправить
withCredentials
логическое значение true, вы можете настроить CORS следующим образом:var cors = require('cors'); app.use(cors({credentials: true, origin: 'http://localhost:5000'}));
`
источник
Настройка 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()
источник
Если это помогает, я использовал центрифугу с моим приложением reactjs, и, проверив некоторые комментарии ниже, я посмотрел на файл библиотеки centrifuge.js, который в моей версии имел следующий фрагмент кода:
if ('withCredentials' in xhr) { xhr.withCredentials = true; }
После того, как я удалил эти три строки, приложение заработало нормально, как и ожидалось.
Надеюсь, это поможет!
источник
Если вы используете .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 });
Для меня это было просто отсутствие options.AllowCredentials (), которое вызывало указанную вами ошибку. В качестве дополнительного примечания для других, у которых также есть проблемы с CORS, порядок имеет значение, и AddCors () должны быть зарегистрированы перед AddMVC () внутри вашего класса Startup.
источник