Det står att Api:et är Blockat
I min konsol kommer det en Varning och ett Error-Meddelande. Där det står så här:
Error:
Access to fetch at 'http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60' from origin 'null' 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.
Error:
Uncaught (in promise) TypeError: Failed to fetch
Varning:
Cross-Origin Read Blocking (CORB) blocked cross-origin response http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60 with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more
Min Javascript kod ser ut så här:
fetch('http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60')
.then(dataWrappedByPromise => dataWrappedByPromise.json())
.then(data => {
console.log(data)
})}
Error:
Access to fetch at 'http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60' from origin 'null' 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.
Error:
Uncaught (in promise) TypeError: Failed to fetch
Varning:
Cross-Origin Read Blocking (CORB) blocked cross-origin response http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60 with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more
Min Javascript kod ser ut så här:
fetch('http://api.sl.se/api2/realtimedeparturesv4.json?key=0438551a537247a3bede1f2c0865f0f7&siteid=1202&timewindow=60')
.then(dataWrappedByPromise => dataWrappedByPromise.json())
.then(data => {
console.log(data)
})}
Följ inlägget
0
följare
Detta händer eftersom denna API inte skickar CORS headers. En webläsare kräver CORS-headers från en extern URL innan den anropar denna URL med en GET anrop. Du kan läsa mer om CORS här: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS.
Endaste sätt att fixa detta är inte köra denna fetch i en webläsare (du kan göra det i javascript från nodeJs, eller från andra språk), eller genom att köra en proxy så att båda din app och resursen finns i samma domän, eller genom att köra en proxy för som lägger till CORS headers som tillåter anrop från olika domännamner.
Hälsningar,
Bert