webentwicklung-frage-antwort-db.com.de

Wie löse ich 'Umleitung wurde durch die CORS-Richtlinie blockiert?

Ich arbeite an einer App, die vue js ..__ verwendet. Je nach Einstellung muss die Variable an meine URL übergeben werden, wenn die Einstellung geändert wird.

$.get('http://172.16.1.157:8002/firstcolumn/' + c1v + '/' + c1b, function (data) { 
  // some code...
});

aber wenn meine app auf url klopft, zeigt es folgende messsge.

Fehler beim Laden von http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26 : Weiterleitung von ' http://172.16.1.157:8002/firstcolumn/2017- 03-01/2017-10-26 'bis' http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26/ 'wurde von der CORS-Richtlinie blockiert: Auf der angeforderten Ressource ist kein Header "Access-Control-Allow-Origin" vorhanden. Origin ' http: // localhost: 8080 ' hat daher keinen Zugriff.

19
Sharat

Zusätzlich zu dem, was awd über die Neukonfiguration der verantwortlichen Person für den Server (eine unpraktische Lösung für die lokale Entwicklung) erwähnte, verwende ich ein Change-Origin-Chrome-Plugin wie folgt:

https://chrome.google.com/webstore/detail/moesif-Origin-cors-change/digfbfaphojjndkpccljibejjbppifbc

Sie können dafür sorgen, dass Ihre local dev server (ex: localhost:8080) von 172.16.1.157:8002 or any other domain kommt. 

13
altShiftDev

Bitten Sie die Person, die den Server verwaltet, um http://172.16.1.157:8002/ , um Ihren Hostnamen zu Access-Control-Allow-Origin-Hosts hinzuzufügen.

Access-Control-Allow-Origin: yourhostname:port
5
awd

Vielen Dank an alle, die ich mit dieser Erweiterung auf Chrome gelöst habe.

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

4
Sharat

Hallo Wenn ich es richtig verstanden habe, machst du eine XMLHttpRequest zu einer anderen Domain als deine Seite ist. Der Browser blockiert ihn daher, da er aus Sicherheitsgründen normalerweise eine Anfrage in demselben Origin erlaubt. Sie müssen etwas anderes tun, wenn Sie eine domänenübergreifende Anforderung ausführen möchten. Ein Tutorial darüber, wie Sie dies erreichen, ist Using CORS .

Wenn Sie Postbote verwenden, sind sie durch diese Richtlinie nicht eingeschränkt. Zitiert aus Cross-Origin XMLHttpRequest :

Regular-Webseiten können das XMLHttpRequest-Objekt verwenden, um Daten von Remote-Servern zu senden und zu empfangen, sie sind jedoch durch dieselbe Origin-Richtlinie eingeschränkt. Erweiterungen sind nicht so begrenzt. Eine Erweiterung kann mit Remote-Servern außerhalb von Origin kommunizieren, sofern sie zum ersten Mal Cross-Origin-Berechtigungen anfordert.

3
Bhavan Patel

Ich hatte das gleiche Problem in meinen Projekten Vue.js und SpringBoot. Wenn jemand mit spring arbeitet, kannst du diesen Code hinzufügen:

@Bean
public FilterRegistrationBean simpleCorsFilter() {  
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();  
    CorsConfiguration config = new CorsConfiguration();  
    config.setAllowCredentials(true); 
    // *** URL below needs to match the Vue client URL and port ***
    config.setAllowedOrigins(Collections.singletonList("http://localhost:8080")); 
    config.setAllowedMethods(Collections.singletonList("*"));  
    config.setAllowedHeaders(Collections.singletonList("*"));  
    source.registerCorsConfiguration("/**", config);  
    FilterRegistrationBean bean = new FilterRegistrationBean<>(new CorsFilter(source));
    bean.setOrder(Ordered.HIGHEST_PRECEDENCE);  
    return bean;  
}   

In diesem Artikel habe ich eine Lösung gefunden Erstellen Sie eine einfache CRUD-App mit Spring Boot und Vue.js

1
mma

Sie stellen eine Anfrage an die externe Domäne 172.16.1.157:8002/ von Ihrem lokalen Entwicklungsserver aus, weshalb sie die Cross-Origin-Ausnahme ..__ gibt. Entweder müssen Sie die Header Access-Control-Allow-Origin:* sowohl im Frontend als auch im Backend zulassen oder alternativ diese Erweiterung cors header toggle) verwenden - Chrome-Erweiterung , sofern Sie Backend und Frontend in derselben Domäne hosten.

1
Manav Mandal

Wenn Sie die Kontrolle über Ihren Server haben, können Sie PHP verwenden:

<?PHP
header('Access-Control-Allow-Origin: *');
?>
1
Kardi Teknomo

sie müssen die Sicherheit für Ihren Browser anpassen oder die Berechtigung durch Anpassen der Sicherheit erteilen. (es ist unpraktisch für Ihre lokalen Tests), um mehr darüber zu erfahren, gehen Sie bitte über den Link.
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

0
Aditya M

Sie können dieses Problem vorübergehend lösen, indem Sie das Firefox-Add-On CORS Everywhere verwenden. Öffnen Sie einfach Firefox, drücken Sie Strg + Umschalt + A, durchsuchen Sie das Add-On und fügen Sie es hinzu !!

0

wenn Sie den Knoten js verwenden (apis machen), ist die einzig beste Lösung,

step1: - npm i cors step2: - app.use (cors ()) {in app.js file} dann starte erneut deinen Server, den du finden wirst Deine Lösung ... für Videos gehe bitte auf meinen YouTube-Kanal und abonniere https://www.youtube.com/channel/UCD8bHKf3eRE0bAWShADWAYw

0

Um dem Header mithilfe von Apache die CORS-Autorisierung hinzuzufügen, fügen Sie einfach die folgende Zeile in die Abschnitte <Directory>, <Location>, <Files> oder <VirtualHost> Ihrer Serverkonfiguration ein (normalerweise in einer * .conf-Datei, z. B. httpd.conf oder Apache.conf) ) oder in einer .htaccess-Datei:

Kopfsatz Access-Control-Allow-Origin "*"

Und dann Apache neu starten.

Das Ändern von Kopfzeilen erfordert die Verwendung von mod_headers. Mod_headers ist standardmäßig in Apache aktiviert. Sie können jedoch sicherstellen, dass sie aktiviert ist.

0
Pankaj Shinde