Heim > Web-Frontend > js-Tutorial > So implementieren Sie domänenübergreifende WebApi-Ajax-Anfragen mithilfe von CORS

So implementieren Sie domänenübergreifende WebApi-Ajax-Anfragen mithilfe von CORS

php中世界最好的语言
Freigeben: 2018-03-31 10:34:30
Original
2236 Leute haben es durchsucht

Dieses Mal werde ich Ihnen die Methode zur Verwendung von CORS zum Implementieren domänenübergreifender WebApi-Ajax-Anfragen vorstellen. Werfen wir einen Blick darauf.

ÜbersichtJeder, der die ASP.NET Web API verwendet hat, weiß, dass es keine komplizierten

Konfigurationsdateien

gibt, a Ein einfacher ApiController plus die erforderliche Aktion wird 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, gelten standardmäßig Einschränkungen, wenn eine Webseite 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.

ProblemXMLHttpRequest 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 Berechtigung. Der Server antwortet mit dem Wert „Zugriffskontrolle erlauben“, damit der Browser mit dem Ursprung übereinstimmt, und er sendet offiziell eine

Post-Anfrage

Greifen Sie domänenübergreifend zu. Wenn die Optionsanforderung nicht unterstützt wird, wird die Anforderung abgebrochen.

GrundAus 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 verwendet, wenn die Formularübermittlung mit

Datei-Upload

einhergeht), text/plain ( Klartext)

3. Die Nutzlast der POST-Anfrage ist Text/HTML 4. Legen Sie benutzerdefinierte Header fest

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 wird.

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


Lösung

Diese 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

Verwendung: Fügen Sie

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);
 }
}
Nach dem Login kopieren

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

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());
}
Nach dem Login kopieren

hinzu einfach und kann einfache domänenübergreifende Anfragen verarbeiten

<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>
Nach dem Login kopieren

Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie unter Bitte beachten Sie andere verwandte Artikel auf der chinesischen PHP-Website! Empfohlene Lektüre:

So konvertieren Sie Entitätsklassen und XML-Dateien

Detaillierte Erklärung, wie Sie Razor-Seiten teilweise aktualisieren mit Ajax

Das obige ist der detaillierte Inhalt vonSo implementieren Sie domänenübergreifende WebApi-Ajax-Anfragen mithilfe von CORS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage