Hoe op te lossen ‘Omleiding is geblokkeerd door CORS-beleid: geen ‘Access-Control-Allow-Origin’-header’?

Ik werk aan een app die Vue jsgebruikt.
Volgens mijn instelling moet ik een variabele doorgeven aan mijn URL bij het wijzigen van instellingen.

<!-- language: lang-js -->
    $.get('http://172.16.1.157:8002/firstcolumn/' + c1v + '/' + c1b, function (data) { 
      // some code...
    });

Maar wanneer mijn app op URL komt, wordt het volgende bericht weergegeven.

Failed to load http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26: Redirect from 'http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26' to 'http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26/' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

Antwoord 1, autoriteit 100%

In aanvulling op wat awd zei over het opnieuw configureren van de persoon die verantwoordelijk is voor de server (een onpraktische oplossing voor lokale ontwikkeling), gebruik ik een Chrome-plug-in met wijzigingsoorsprong, zoals deze:

Moesif Orign & CORS-wisselaar

Je kunt ervoor zorgen dat je local dev server (ex: localhost:8080)afkomstig lijkt te zijn van 172.16.1.157:8002 or any other domain.


Antwoord 2, autoriteit 35%

Bedankt allemaal, ik heb het opgelost met deze extensie op chrome.

CORS toestaan: Access-Control-Allow-Origin


Antwoord 3, autoriteit 18%

Vraag de persoon die de server onderhoudt op http://172.16.1.157:8002/om uw hostnaam toe te voegen naar Access-Control-Allow-Origin-hosts moet de server een header retourneren die lijkt op de volgende met het antwoord-

Access-Control-Allow-Origin: yourhostname:port

Antwoord 4, autoriteit 18%

Als je controle hebt over je server, kun je PHP gebruiken:

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

Antwoord 5, autoriteit 14%

Als je dit probleem met Chrome hebt, heb je geen extensie nodig.
Start Chrome vanuit de console:

chrome.exe –user-data-dir=”C:/Chrome dev session” –disable-web-security

Misschien moet je alle tabbladen in Chrome sluiten en opnieuw opstarten.


Antwoord 6, autoriteit 10%

Hallo Als ik het goed heb begrepen, doet u een XMLHttpRequestnaar een ander domein dan uw pagina staat aan. Dus de browser blokkeert het omdat het om veiligheidsredenen meestal een verzoek in dezelfde oorsprong toestaat. U moet iets anders doen als u een domeinoverschrijdend verzoek wilt doen. Een tutorial over hoe je dat kunt bereiken is CORS gebruiken.

Als u postbode gebruikt, worden deze niet beperkt door dit beleid. Geciteerd uit Cross-Origin XMLHttpRequest:

Gewone webpagina’s kunnen het XMLHttpRequest-object gebruiken om gegevens van externe servers te verzenden en te ontvangen, maar ze worden beperkt door hetzelfde oorsprongsbeleid. Extensies zijn niet zo beperkt. Een extensie kan communiceren met externe servers buiten zijn oorsprong, zolang deze eerst om cross-origin-machtigingen vraagt.


Antwoord 7, autoriteit 7%

Om de CORS-autorisatie aan de kop toe te voegen met Apache, voegt u eenvoudig de volgende regel toe in de <Directory>, <Location>, <Files>of <VirtualHost>secties van uw serverconfiguratie (meestal in een *.conf-bestand, zoals httpd.conf of apache.conf), of binnen een .htaccessbestand:

Koptekst instellen Access-Control-Allow-Origin “*”

En herstart apache.

Het wijzigen van headers vereist het gebruik van mod_headers. Mod_headers is standaard ingeschakeld in Apache, maar u kunt ervoor zorgen dat het is ingeschakeld.


Antwoord 8, autoriteit 4%

Je doet een verzoek aan het externe domein 172.16.1.157:8002/vanaf je lokale ontwikkelserver, daarom geeft deze een uitzondering voor cross origin.
U moet ofwel headers Access-Control-Allow-Origin:*toestaan ​​in zowel de frontend als de backend, of u kunt deze extensie cors header toggle – chrome extensiontenzij je backend en frontend host op hetzelfde domein.


Antwoord 9, autoriteit 4%

Ik had hetzelfde probleem in mijn Vue.js- en SpringBoot-projecten. Als iemand met de lente werkt, kun je deze code toevoegen:

@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;  
}   

Ik heb een oplossing gevonden in dit artikel Build een eenvoudige CRUD-app met Spring Boot en Vue.js


Antwoord 10, autoriteit 4%

Probeer deze opdracht in uw terminal uit te voeren en test het opnieuw.

curl -H "origin: originHost" -v "RequestedResource"

Bijvoorbeeld:

Als mijn originHostgelijk is aan https://localhost:8081/en mijn RequestedResourcegelijk is aan https://example.com/

Mijn opdracht is als volgt:

curl -H "origin: https://localhost:8081/" -v "https://example.com/"

Als je de volgende regel kunt zien, zou het voor jou moeten werken.

< access-control-allow-origin: *

Hopelijk helpt dit.


Antwoord 11, autoriteit 4%

Npm gebruiken:

Om cross-origin-verzoeken toe te staan, installeer ‘cors’:

npm i cors

Voeg dit toe aan de serverzijde:

let cors = require("cors");
app.use(cors());

Antwoord 12, autoriteit 3%

U kunt dit tijdelijk oplossen door de Firefox-add-on te gebruiken, CORS Overal. Open Firefox, druk op Ctrl+Shift+A, zoek de add-on en voeg deze toe!


Antwoord 13

Je zult dit niet geloven,
Zorg ervoor dat u “.” toevoegt. aan het einde van de “url”

Ik kreeg een soortgelijke fout met deze code:

fetch(https://itunes.apple.com/search?term=jack+johnson)
.then( response => {
    return response.json();
})
.then(data => {
    console.log(data.results);
}).catch(error => console.log('Request failed:', error))

De fout die ik kreeg:

Access to fetch at 'https://itunes.apple.com/search?term=jack+johnson'
 from origin 'http://127.0.0.1:5500' has been blocked by CORS policy:
 No 'Access-Control-Allow-Origin' header is present on the requested
 resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Maar ik realiseerde me na veel onderzoek dat het probleem was dat ik de . niet kopieerde
juiste URL-adres uit de iTunes API-documentatie.

Het had moeten zijn

https://itunes.apple.com/search?term=jack+johnson.

niet

https://itunes.apple.com/search?term=jack+johnson

Let op de punt aan het einde

Er is een enorme uitleg waarom de punt belangrijk is bij het citeren van problemen over DNS en karaktercodering, maar de waarheid is dat het u waarschijnlijk niet kan schelen. Probeer de punt toe te voegen, misschien werkt het ook voor jou.

Toen ik de “.” alles werkte als een tierelier.

Ik hoop dat het ook voor jou werkt.


Antwoord 14

Geef wel @CrossOrigin(origins = "http://localhost:8081")
in Controller-klasse.


Antwoord 15

Het goedgekeurde antwoord op deze vraag is niet geldig.

Je moet headers instellen op je server-side code

app.use((req,res,next)=>{
    res.setHeader('Acces-Control-Allow-Origin','*');
    res.setHeader('Acces-Control-Allow-Methods','GET,POST,PUT,PATCH,DELETE');
    res.setHeader('Acces-Contorl-Allow-Methods','Content-Type','Authorization');
    next(); 
})

Antwoord 16

u moet de beveiliging voor uw browser aanpassen of toestemming toestaan ​​door de beveiliging aan te passen. (het is onpraktisch voor uw lokale testen)
ga voor meer informatie naar de link.
https://developer.mozilla.org/en-US/docs/ Web/HTTP/CORS


Antwoord 17

installeren:

npm i cors

Vervolgens cors():

app.get("/list",cors(),(req,res) =>{
});

Antwoord 18

Dit probleem wordt opgelost door simpelweg onderstaande tekst toe te voegen aan het bestand httpd.conf.

Koptekst instellen Access-Control-Allow-Origin “*”


Antwoord 19

Deze fouten kunnen worden veroorzaakt door de volgende redenen. Zorg ervoor dat de volgende stappen worden gevolgd. Om de lokale host te verbinden met de lokale virtuele machine (host). Hier verbind ik http://localhost:3001/ met de http://abc.testte volgen stappen gevolgd:

1.We moeten CORS toestaan, door Access-Control-Allow-Origin:in de kop van het verzoek te plaatsen
werkt mogelijk niet. Installeer een Google-extensie die een CORS-verzoek mogelijk maakt.
*

2.Zorg ervoor dat de inloggegevens die u opgeeft in het verzoek geldig zijn.

3.Zorg ervoor dat de zwerver is voorzien. Probeer vagrant up –provision dit maakt de localhost verbinding met db van de homestead.

  1. Probeer het inhoudstype van de koptekst te wijzigen. header:{ ‘Content-Type’ : ‘application/x-www-form-urlencoded; charset=UTF-8;application/json’}
    dit punt is erg belangrijk.

Antwoord 20

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

Zet gewoon “https” .

LEAVE A REPLY

Please enter your comment!
Please enter your name here

20 − 7 =

Other episodes