Implementierung einer domänenübergreifenden WebApi Ajax-Anfragelösung basierend auf CORS

Dieser Artikel stellt hauptsächlich die Lösung für domänenübergreifende WebApi-Ajax-Anfragen basierend auf CORS vor. Freunde in Not können sich auf die folgende

Übersicht

beziehen

Jeder, der die ASP.NET-Web-API verwendet hat, weiß, dass es keine komplizierte Konfigurationsdatei gibt, ein einfacher ApiController plus die erforderliche Aktion kann funktionieren. Bei der Verwendung von APIs stößt man jedoch immer wieder auf das Problem domänenübergreifender Anfragen. Gerade heute, mit der zunehmenden Verbreitung verschiedener APPs, sind domänenübergreifende Anfragen für APIs unvermeidlich.

Um CSRF-Cross-Site-Forgery-Angriffe (oder die Same-Origin-Richtlinie von JavaScript) zu verhindern, wird eine Webseite standardmäßig eingeschränkt, wenn sie Daten von einer anderen Domain erhält. Es gibt einige Möglichkeiten, diese Einschränkung zu überwinden. Dies ist natürlich nur eine von vielen Lösungen. Da JSONP nur GET-Anfragen unterstützt, kann es die Anforderungen der heutigen komplexen Unternehmen nicht mehr erfüllen. CORS (Cross Origin Resource Sharing https://www.w3.org/wiki/CORS) ist eine neue Header-Spezifikation, die es dem Server ermöglicht, domänenübergreifende Einschränkungen zu lockern und Einschränkungen basierend auf Headern zu wechseln. Domänenübergreifende Anfragen nicht einschränken. Wichtig ist, dass es alle HTTP-Anfragemethoden unterstützt.

Problem

XMLHttpRequest domänenübergreifende POST- oder GET-Anfrage, die Anfragemethode wird automatisch zu einem OPTIONS-Problem.

Aufgrund der CORS-Spezifikation (Cross Origin Resource Share) sendet der Browser zunächst einen Options-Sniff, und gleichzeitig ermittelt der Header den Ursprung, um festzustellen, ob eine domänenübergreifende Anforderung vorliegt Der Server antwortet mit dem Wert „Zugriffskontrolle“, damit der Browser mit dem Ursprung übereinstimmt. Auch wenn der Server dem Programm den domänenübergreifenden Zugriff zulässt Die Optionsanforderung wird nicht unterstützt, die Anforderung wird abgebrochen.

Grund

Aus Sicherheitsgründen unterstützt der Browser den transparenten Serverüberprüfungsmechanismus von Preflighted Request, um Entwickler bei der Verwendung benutzerdefinierter Header zu unterstützen, GET Or Andere Methoden als POST und verschiedene Arten von Betreffinhalten, d. h. zuerst wird eine Optionsanfrage gesendet,
den Server fragen, ob er die Anfrage korrekt (zulässt) und sicherstellen, dass die Anfrage sicher gesendet werden kann.

Die Situationen, in denen OPTIONEN angezeigt werden, sind im Allgemeinen:

1. Der Inhaltstyp der POST-Anfrage ist nicht der herkömmliche drei: Anwendung /x- www-form-urlencoded (mit der HTTP-POST-Methode übermitteltes Formular), multipart/form-data (wie oben, wird jedoch hauptsächlich beim Hochladen von Dateien beim Senden eines Formulars verwendet), text/plain (einfacher Text)

3. Die Nutzlast der POST-Anfrage ist Text/HTML　

4. Benutzerdefinierte Header festlegen

Der OPTIONS-Anfrageheader enthält die folgenden Header: Origin, Access-Control-Request-Method , Access-Control-Request-Header Nach dem Senden dieser Anfrage kann der Server die folgenden Header festlegen, um mit dem Browser zu kommunizieren, um zu bestimmen, ob die Anfrage zugelassen werden soll.

Access-Control-Allow-Origin, Access-Control-Allow-Method, Access-Control-Allow-Header

LösungDiese Methode ist leistungsstark und kann komplexe domänenübergreifende Anforderungen der ASP.NET-Web-API lösen, die komplexe Header-Informationen, Textinhalte und Informationen zur Autorisierungsüberprüfung enthalten

Methode 1

public class CrosHandler:DelegatingHandler
{
 private const string Origin = "Origin";
 private const string AccessControlRequestMethod = "Access-Control-Request-Method";
 private const string AccessControlRequestHeaders = "Access-Control-Request-Headers";
 private const string AccessControlAllowOrign = "Access-Control-Allow-Origin";
 private const string AccessControlAllowMethods = "Access-Control-Allow-Methods";
 private const string AccessControlAllowHeaders = "Access-Control-Allow-Headers";
 private const string AccessControlAllowCredentials = "Access-Control-Allow-Credentials";
 protected override Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
 {
  bool isCrosRequest = request.Headers.Contains(Origin);
  bool isPrefilightRequest = request.Method == HttpMethod.Options;
  if (isCrosRequest)
  {
   Task<HttpResponseMessage> taskResult = null;
   if (isPrefilightRequest)
   {
    taskResult = Task.Factory.StartNew<HttpResponseMessage>(() =>
    {
     HttpResponseMessage response = new HttpResponseMessage(System.Net.HttpStatusCode.OK);
     response.Headers.Add(AccessControlAllowOrign,
      request.Headers.GetValues(Origin).FirstOrDefault());
     string method = request.Headers.GetValues(AccessControlRequestMethod).FirstOrDefault();
     if (method != null)
     {
      response.Headers.Add(AccessControlAllowMethods, method);
     }
     string headers = string.Join(", ", request.Headers.GetValues(AccessControlRequestHeaders));
     if (!string.IsNullOrWhiteSpace(headers))
     {
      response.Headers.Add(AccessControlAllowHeaders, headers);
     }
     response.Headers.Add(AccessControlAllowCredentials, "true");
     return response;
    }, cancellationToken);
   }
   else
   {
    taskResult = base.SendAsync(request, cancellationToken).ContinueWith<HttpResponseMessage>(t =>
    {
     var response = t.Result;
     response.Headers.Add(AccessControlAllowOrign,
      request.Headers.GetValues(Origin).FirstOrDefault());
     response.Headers.Add(AccessControlAllowCredentials, "true");
     return response;
    });
   }
   return taskResult;
  }
  return base.SendAsync(request, cancellationToken);
 }
}

Verwendung:

protected void Application_Start()
{
 IOCConfig.RegisterAll();
 AreaRegistration.RegisterAllAreas();
 WebApiConfig.Register(GlobalConfiguration.Configuration);
 FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
 RouteConfig.RegisterRoutes(RouteTable.Routes);
 BundleConfig.RegisterBundles(BundleTable.Bundles);
 GlobalConfiguration.Configuration.MessageHandlers.Add(new CrosHandler());
}

zur Datei Global.asax hinzufügen. Methode 2: Fügen Sie die folgende Konfiguration zur Konfigurationsdatei

hinzu einfache domänenübergreifende Anfragen

<system.webServer>
 <httpProtocol>
  <customHeaders>
  <add name="Access-Control-Allow-Origin" value="*" />
  <add name="Access-Control-Allow-Headers" value="Content-Type" />
  <add name="Access-Control-Allow-Methods" value="GET, POST,OPTIONS" />
  </customHeaders>
 </httpProtocol>
<system.webServer>

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

Ajax-Binärstrom zur Verarbeitung anfordern (

Ajaxasynchroner Download von Dateien)

Django Framework Wie man die Post-Methode von

ajax verwendet (Bild- und Text-Tutorial)

Über das Problem der Weitergabe von Daten im Hintergrund durch Antwort in Ajax (einschließlich Code, detaillierte Analyse)

Das obige ist der detaillierte Inhalt vonImplementierung einer domänenübergreifenden WebApi Ajax-Anfragelösung basierend auf CORS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!