Lo que estoy tratando de hacer
Tengo una API web ASP.Net Core de back-end alojada en un plan gratuito de Azure (código fuente: https://github.com/killerrin/Portfolio-Backend ).
También tengo un sitio web de cliente que quiero hacer que consuma esa API. La aplicación de cliente no se alojará en Azure, sino que se alojará en páginas de Github u otro servicio de alojamiento web al que tenga acceso. Debido a esto, los nombres de dominio no se alinearán.
Al investigar esto, necesito habilitar CORS en el lado de la API web, sin embargo, he intentado casi todo durante varias horas y se niega a funcionar.
Cómo tengo la configuración del cliente Es solo un cliente simple escrito en React.js. Estoy llamando a las API a través de AJAX en Jquery. El sitio React funciona, así que sé que no es eso. La llamada a la API de Jquery funciona como lo confirmé en el intento 1. Así es como hago las llamadas
var apiUrl = "http://andrewgodfroyportfolioapi.azurewebsites.net/api/Authentication";
//alert(username + "|" + password + "|" + apiUrl);
$.ajax({
url: apiUrl,
type: "POST",
data: {
username: username,
password: password
},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var authenticatedUser = JSON.parse(response);
//alert("Data Loaded: " + authenticatedUser);
if (onComplete != null) {
onComplete(authenticatedUser);
}
},
error: function (xhr, status, error) {
//alert(xhr.responseText);
if (onComplete != null) {
onComplete(xhr.responseText);
}
}
});
Lo que he intentado
Intento 1 - La forma 'adecuada'
https://docs.microsoft.com/en-us/aspnet/core/security/cors
He seguido este tutorial en el sitio web de Microsoft hasta una T, probando las 3 opciones de habilitarlo globalmente en Startup.cs, configurándolo en cada controlador y probándolo en cada acción.
Siguiendo este método, Cross Domain funciona, pero solo en una sola Acción en un solo controlador (POST al AccountController). Para todo lo demás, el Microsoft.AspNetCore.Cors
middleware se niega a configurar los encabezados.
Instalé a Microsoft.AspNetCore.Cors
través de NUGET y la versión es1.1.2
Así es como lo configuro en Startup.cs
// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
// Add Cors
services.AddCors(o => o.AddPolicy("MyPolicy", builder =>
{
builder.AllowAnyOrigin()
.AllowAnyMethod()
.AllowAnyHeader();
}));
// Add framework services.
services.AddMvc();
services.Configure<MvcOptions>(options =>
{
options.Filters.Add(new CorsAuthorizationFilterFactory("MyPolicy"));
});
...
...
...
}
// This method gets called by the runtime. Use this method to configure
//the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env,
ILoggerFactory loggerFactory)
{
loggerFactory.AddConsole(Configuration.GetSection("Logging"));
loggerFactory.AddDebug();
// Enable Cors
app.UseCors("MyPolicy");
//app.UseMvcWithDefaultRoute();
app.UseMvc();
...
...
...
}
Como puede ver, estoy haciendo todo lo que me dijeron. Agregué Cors antes de MVC las dos veces, y cuando eso no funcionó, intenté poner [EnableCors("MyPolicy")]
cada controlador como tal
[Route("api/[controller]")]
[EnableCors("MyPolicy")]
public class AdminController : Controller
Intento 2 - Brute forzándolo
https://andrewlock.net/adding-default-security-headers-in-asp-net-core/
Después de varias horas de intentar el intento anterior, pensé que trataría de aplicar una fuerza bruta al tratar de configurar los encabezados manualmente, obligándolos a ejecutarse en cada respuesta. Hice esto siguiendo este tutorial sobre cómo agregar encabezados manualmente a cada respuesta.
Estos son los encabezados que agregué
.AddCustomHeader("Access-Control-Allow-Origin", "*")
.AddCustomHeader("Access-Control-Allow-Methods", "*")
.AddCustomHeader("Access-Control-Allow-Headers", "*")
.AddCustomHeader("Access-Control-Max-Age", "86400")
Estos son otros encabezados que probé que fallaron
.AddCustomHeader("Access-Control-Allow-Methods", "GET, POST, PUT, PATCH, DELETE")
.AddCustomHeader("Access-Control-Allow-Headers", "content-type, accept, X-PINGOTHER")
.AddCustomHeader("Access-Control-Allow-Headers", "X-PINGOTHER, Host, User-Agent, Accept, Accept: application/json, application/json, Accept-Language, Accept-Encoding, Access-Control-Request-Method, Access-Control-Request-Headers, Origin, Connection, Content-Type, Content-Type: application/json, Authorization, Connection, Origin, Referer")
Con este método, los encabezados Cross Site se aplican correctamente y se muestran en mi consola de desarrollador y en Postman. Sin embargo, el problema es que mientras pasa el Access-Control-Allow-Origin
cheque, el navegador web lanza un ataque siseante (creo) Access-Control-Allow-Headers
indicando415 (Unsupported Media Type)
Entonces el método de fuerza bruta tampoco funciona
Finalmente
¿Alguien ha conseguido que esto funcione y pueda echar una mano, o simplemente poder señalarme en la dirección correcta?
EDITAR
Entonces, para que las llamadas a la API se procesen, tuve que dejar de usar JQuery y cambiar a un XMLHttpRequest
formato Javascript puro .
Intento 1
Me las arreglé para Microsoft.AspNetCore.Cors
que funcionara siguiendo la respuesta de MindingData, excepto dentro del Configure
Método que pone el app.UseCors
antes app.UseMvc
.
Además, cuando se combina con la Solución API de Javascript options.AllowAnyOrigin()
para el soporte comodín, comenzó a funcionar también.
Intento 2
Así que he logrado que el Intento 2 (fuerza bruta) funcione ... con la única excepción de que el comodín Access-Control-Allow-Origin
no funciona y, como tal, tengo que configurar manualmente los dominios que tienen acceso a él.
Obviamente no es ideal, ya que solo quiero que este WebAPI esté abierto para todos, pero al menos funciona para mí en un sitio separado, lo que significa que es un comienzo
app.UseSecurityHeadersMiddleware(new SecurityHeadersBuilder()
.AddDefaultSecurePolicy()
.AddCustomHeader("Access-Control-Allow-Origin", "http://localhost:3000")
.AddCustomHeader("Access-Control-Allow-Methods", "OPTIONS, GET, POST, PUT, PATCH, DELETE")
.AddCustomHeader("Access-Control-Allow-Headers", "X-PINGOTHER, Content-Type, Authorization"));
fuente
415 (Unsupported Media Type)
problema, establezca unContent-Type
encabezado de solicitud enapplication/json
.Respuestas:
Debido a que tiene una política CORS muy simple (Permitir todas las solicitudes del dominio XXX), no necesita hacerla tan complicada. Intente hacer lo siguiente primero (Una implementación muy básica de CORS).
Si aún no lo ha hecho, instale el paquete nuget CORS.
En el método ConfigureServices de su startup.cs, agregue los servicios CORS.
Luego, en el método Configure de su startup.cs, agregue lo siguiente:
Ahora inténtalo. Las políticas son para cuando desea diferentes políticas para diferentes acciones (por ejemplo, diferentes hosts o diferentes encabezados). Por su simple ejemplo, realmente no lo necesita. Comience con este sencillo ejemplo y modifique como lo necesite desde allí.
Leer más: http://dotnetcoretutorials.com/2017/01/03/enabling-cors-asp-net-core/
fuente
app.UseCors
DESPUÉS de `` app.UseMvc () `. Los middlewares se ejecutan en el orden en que están registradosoptions.DisableHttpsRequirement();
para que todo esto funcione. Parece que con la configuración de https cors no se aplicaba.En ConfigureServices agregue
services.AddCors();
ANTES de services.AddMvc ();Agregar UseCors en Configurar
El punto principal es que agregue
app.UseCors
, antesapp.UseMvc()
.Asegúrese de declarar la funcionalidad CORS antes de MVC para que el middleware se active antes de que la tubería MVC obtenga el control y finalice la solicitud.
Después de que el método anterior funcione, puede cambiarlo, configurar un ORIGEN específico para aceptar llamadas api y evitar dejar su API tan abierta a cualquiera
En el método de configuración, dígale a CORS que use la política que acaba de crear:
Acabo de encontrar este artículo compacto sobre el tema: https://dzone.com/articles/cors-in-net-core-net-core-security-part-vi
fuente
Configure()
el orden no es realmente importante aquí dentroConfigureServices()
AllowCredentials()
con loAllowAnyOrigin()
anterior. Para usarloAllowCredentials()
necesitas configurarloWithOrigins()
. docs.microsoft.com/en-us/aspnet/core/security/…Creé mi propia clase de middleware que funcionó para mí, creo que hay algo mal con la clase de middleware .net core
y lo usé de esta manera en el startup.cs
fuente
if (!context.Request.Headers.ContainsKey(CorsConstants.Origin)) return this._next(context);
En mi caso, solo la
get
solicitud funciona bien de acuerdo con la respuesta de MindingData. Para otros tipos de solicitud, debe escribir:No olvides agregar
.AllowAnyHeader()
fuente
Para ampliar la respuesta del usuario 8266077 , descubrí que aún necesitaba proporcionar la respuesta OPTIONS para las solicitudes de verificación previa en .NET Core 2.1-preview para mi caso de uso:
y luego habilitó el middleware como en Startup.cs
fuente
app.Use<CorsMiddleware>();
await _next(context)
y configurar el código de estado y la respuesta manualmente si esto sucede. También tuve que agregar "autorización" a Access-Control-Allow-Headers para que la solicitud de verificación previa funcione al hacer solicitudes de reacción que requieren autorización.fuente
Estuve luchando con esto por DÍAS.
Finalmente lo puse a trabajar al pasar
app.UseCors(CORS_POLICY);
a la parte superior deConfigure()
.También:
Microsoft.AspNetCore.Cors
solía ser un paquete NuGet requerido en .Net Core 2 y versiones inferiores; ahora es automáticamente una parte de Microsoft.AspNetCore en .Net Core 3 y superior.builder.AllowAnyOrigin()
y las.AllowCredentials()
opciones CORS ahora son mutuamente exclusivas en .Net Core 3 y superiorhttps
. Una URL http parecía dar un error CORS independientemente de la configuración CORS del servidor .Net Core. Por ejemplo,http://localhost:52774/api/Contacts
daría un error CORS; simplemente cambiando la URL ahttps://localhost:44333/api/Contacts
trabajado.Nota adicional :
fuente
Ninguno de los procedimientos anteriores ayudó y luego leí el artículo que resolvió el problema.
Debajo está el código.
y
y en la parte superior de mi método de acción
fuente
app.UseCors()
) con[EnableCors()]
la misma aplicación. Debería utilizar uno u otro, pero no ambos: docs.microsoft.com/en-us/aspnet/core/security/… :Use the [EnableCors] attribute or middleware, not both in the same app.
intente agregar
jQuery.support.cors = true;
antes de la llamada AjaxTambién podría ser que los datos que envía a la API son inestables,
intente agregar la siguiente función JSON
luego en sus datos: objeto cambiarlo a
fuente
La solución más simple es agregar
a Startup.cs.
fuente
Creo que si usa su propio middleware CORS , debe asegurarse de que realmente sea una solicitud CORS marcando el encabezado de origen .
fuente
Access-Control-Allow-Origin
el servidor no emitió el encabezado. En realidad, envié solicitudes a través del cartero sin elOrigin
encabezado. Esto me salvó el día! (O al menos mi mañana;))Según su comentario en la respuesta de MindingData, no tiene nada que ver con su CORS, está funcionando bien.
Su acción de controlador está devolviendo los datos incorrectos. HttpCode 415 significa "Tipo de medio no compatible". Esto sucede cuando pasa el formato incorrecto al controlador (es decir, XML a un controlador que solo acepta json) o cuando devuelve un tipo incorrecto (devuelve Xml en un controlador que se declara que solo devuelve xml).
Para más adelante, verifique la existencia del
[Produces("...")]
atributo en su acciónfuente
Para mí, no tenía nada que ver con el código que estaba usando. Para Azure tuvimos que ir a la configuración del Servicio de aplicaciones, en el menú lateral, la entrada "CORS". Allí tuve que agregar el dominio del que estaba solicitando cosas. Una vez que tuve eso, todo fue mágico.
fuente
En launchSettings.json, en iisSettings, establezca anonymousAuthentication en true:
Luego, en Startup.cs, en ConfigureServices, antes de services.AddMvc, agregue:
y luego, en el método de configuración, antes de app.UseMvc () agregue:
fuente
Estoy usando .Net CORE 3.1 y pasé años golpeándome la cabeza contra la pared con este cuando me di cuenta de que mi código realmente comenzó a funcionar pero mi entorno de depuración estaba roto, así que aquí hay 2 pistas si está tratando de solucionar el problema. problema:
Si está intentando registrar encabezados de respuesta utilizando el middleware ASP.NET, el encabezado "Access-Control-Allow-Origin" nunca aparecerá, incluso si está allí. No sé cómo, pero parece que se agregó fuera de la tubería (al final tuve que usar wireshark para verlo).
.NET CORE no enviará el "Acceso-Control-Permitir-Origen" en la respuesta a menos que tenga un encabezado "Origen" en su solicitud. El cartero no configurará esto automáticamente, por lo que deberá agregarlo usted mismo.
fuente
En mi caso lo arreglé con UseCors antes de UserRouting ..
fuente
.NET Core 3.1
Funcionó para mí y cómo dicen los documentos para hacerlo:
en la clase de inicio:
En el método ConfigureServices ():
En el método Configure ():
https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-3.1
fuente
Obtuve la respuesta anterior de MindingData para trabajar, pero tuve que usar Microsoft.AspNet.Cors en lugar de Microsoft.AspNetCore.Cors. Estoy usando el proyecto de API de aplicación web .NetCore en Visual Studio 2019
fuente
los
le permitirá hacer CORS con funciones integradas, pero no maneja la solicitud de OPCIONES. La mejor solución hasta ahora es crear un nuevo Middleware como se sugirió en una publicación anterior. Marque la respuesta marcada como correcta en la siguiente publicación:
Habilite el encabezado OPTIONS para CORS en .NET Core Web API
fuente
Forma simple y fácil de hacerlo.
Install-Package Microsoft.AspNetCore.Cors
app.UseCors(options => options.AllowAnyOrigin());
fuente
Aquí está mi código :)
fuente
Así es como hice esto.
Veo que en algunas respuestas están configurando
app.UserCors("xxxPloicy")
y poniendo[EnableCors("xxxPloicy")]
controladores. No necesitas hacer las dos cosas.Aquí están los pasos.
En Startup.cs dentro de ConfigureServices agregue el siguiente código.
Si desea aplicar en todo el proyecto, agregue el siguiente código en el método Configurar en Startup.cs
O
Si desea agregarlo a los controladores específicos, agregue el código de habilitación de cors como se muestra a continuación.
Para más información: ver esto
fuente
Use un atributo de acción / controlador personalizado para configurar los encabezados CORS.
Ejemplo:
Luego, en el controlador / acción de la API web:
fuente
Solo para agregar una respuesta aquí, si está utilizando
app.UseHttpsRedirection()
y no está utilizando el puerto SSL, considere comentar esto.fuente
Estaba usando blazor webassembly como cliente y asp.net web api core como backend y también tuve un problema de cors.
Encontré solución con este código:
Mi ASP.Net core web api Startup.cs ConfigureServices y Configure primera línea de métodos se ve así:
y mi método de configuración:
cambiar
http://example.com
con su dominio de cliente o dirección IPfuente
fuente