I don't know how to fix this issue with using an API. It give me a browser error that says:
Access to XMLHttpRequest at
'file:///C:/Users/Gebruiker/Desktop/PokeMax/GET%20https://api.pokemontcg.io/v2/cards?s'
from origin 'null' has been blocked by CORS policy: Cross origin
requests are only supported for protocol schemes: http, data, chrome,
chrome-extension, chrome-untrusted, https. jquery-3.4.1.min.js:2 GET
file:///C:/Users/Gebruiker/Desktop/PokeMax/GET%20https://api.pokemontcg.io/v2/cards?s
net::ERR_FAILED
If someone knows what the issue is I would love to hear it!
code:
$(document).ready(function (e) {
$("#TheSubmitButton").on("click", function(event){
event.preventDefault();
var Pokemon = $("#search")
.val()
.trim()
console.log(Pokemon);
$.ajax({
url: "GET https://api.pokemontcg.io/v2/cards?" + Pokemon,
dataType: 'json',
method: "GET"
});
});
});
// for (var i = 0; i < response.cards.length; i++) {
// var pokemonCard = $("<img>");
// pokemonCard.attr("src", response.cards[i].imageUrlHiRes);
// $("#card-container").append(pokemonCard);
// }
Related
With this code, before an year about i could get the file via XMLHttpsRequest.
Now this do not more work, because of the error:
Access to XMLHttpRequest at 'https://drive.google.com/uc?id=1zGxNBh-YTAXu74v855l2b_LPmLUaomqZ&export=download' from origin 'https://encrypt.pdfzorro.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Is there a way at now, to get the file via javascript. I can not use any server solution, the file should go direct from googleDrive to the browser from the user.. without go on a server (with php e.g.) first.
function downloadFileContent(fileId){
gapi.client.request({
'path': '/drive/v2/files/' + fileId,
'method': 'GET',
callback: function ( theResponseJS, theResponseTXT ) {
var myToken = gapi.auth.getToken();
var myXHR = new XMLHttpRequest();
myXHR.open('GET', theResponseJS.downloadUrl, true );
myXHR.responseType = 'arraybuffer';
myXHR.setRequestHeader('Authorization', 'Bearer ' + myToken.access_token );
myXHR.onreadystatechange = function( theProgressEvent ) {
if (myXHR.readyState == 4) {
// 1=connection ok, 2=Request received, 3=running, 4=terminated
if ( myXHR.status == 200 ) {
// 200=OK
cossole.log(myXHR.response);
}
}
}
myXHR.send();
}
});
}
I'm trying to call Geocoding API but I'm not having any luck. I keep receiving the following error.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.mapbox.com/gecoding/v5/mapbox.places/fort%20coll…7nugng&autocomplete=true&bbox=-105.214,40.451,-104.85,40.841. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
When I add the header it says it can't run the script. Not sure what else to do. My link is formated properly because it works in mapbox search-Playground
var searchId = document.getElementById('mySearch');
searchId.addEventListener('keyup', function onEvent(e) {
if (e.keyCode === 13) {
console.log(searchId.value)
var urlBase = 'https://api.mapbox.com/gecoding/v5/mapbox.places/';
var location = searchId.value;
var bbox = [-105.214, 40.451, -104.850, 40.841]
var query = urlBase + location + '.json?access_token=' + mapboxgl.accessToken + '&autocomplete=true&bbox=' + bbox;
$.ajax({
method: 'GET',
url: query,
success: function(data){
console.log(data)
}
})
}
});
I am trying to download a file from an url (chrome drive file) in javascript; and want to send it to my backend (php - laravel).
var url = file.downloadUrl !== undefined ? file.webContentLink : file.exportLinks['application/pdf'];
console.log(url) // if I go to url, it downloads the file
if (url !== undefined) {
var remote = new XMLHttpRequest();
remote.open('GET', url);
remote.setRequestHeader('Authorization', 'Bearer ' + gapi.client.getToken().access_token);
remote.setRequestHeader('Access-Control-Allow-Origin', '*');
remote.onload = function(e) {
vm.handle_download(remote.responseText, file, 200); // do something with the fetched content;
};
remote.onerror = function(e) {
vm.handle_download('error response', null, remote.statusText);
};
remote.send();
} else vm.handle_download('no downloadable url', {
file: null,
status: 'error'
});
and on handle
handle_download: function (content, file, status) {
if (status !== 200) {
console.log('error occured on status')
return;
}
}
Failed to load https://drive.google.com/uc?id=1D12321ofd4CNG-m9_Mp4aiDcnibNf&export=download: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://test.dev' is therefore not allowed access.
This is an intended behavior due to same origin policy in the web. Since you're doing this for testing purposes, try this Allow-Control-Allow-Origin chrome extension.
You can read more about how to implement this in Using CORS tutorial.
This SO post may also offer additional insight.
I'm having a slight issue with a cross site origin request. I'm sure it is a simple fix.
Console error:
XMLHttpRequest cannot load https://subdomain.example.com/social/disqus. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.example.com' is therefore not allowed access.
js script causing the issue:
window.onload = function(){
//jQuery AJAX GET Method on Disqus Threads
$.ajax({
type: 'GET',
url: 'https://subdomain.example.com/social/disqus',
contentType: 'application/json; charset=utf-8',
success: function(threads) {
var len = Object.keys(threads.response).length
for (i = 0; i < len; i++){
if (threads.response[i].posts == 0 || threads.response[i].posts != 1) {
$('#' + threads.response[i].identifiers).html(threads.response[i].posts + " Comments ");
} else {
$('#' + threads.response[i].identifiers).html(threads.response[i].posts + " Comment ");
}
}
},
error: function() {
console.log("Aw, snap!");
}
});
};
I'm forcing redirects in Apache for both - this may be an issue, but it looks like the CORS request is being fired from a https:// valid site to another https:// valid site... url in the ajax request is definitely https.
I'm wondering if I am missing something from $.ajax ?
I'm new to parse and javascript. i'm going through a very simple tutorial at Parse.com (https://parse.com/apps/quickstart#parse_data/web/new) and created the following block of code. It works on chrome and IE but not safari or firefox. I got the cross-origin request blocked error on firefox. Could you please help?
Firefox Error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.parse.com/1/classes/things.
This can be fixed by moving the resource to the same domain or enabling CORS.
My Code:
var PARSE_APP = "XXX";
var PARSE_JS = "XXX";
$(document).ready(function () {
Parse.initialize(PARSE_APP, PARSE_JS);
$("#FinishQuiz").click(function () {
var ShoulderStrap = "";
if ($("#ShoulderStrap1").prop("checked"))
{ ShoulderStrap = "1" }
if ($("#ShoulderStrap2").prop("checked"))
{ ShoulderStrap = "2" }
if ($("#ShoulderStrap3").prop("checked"))
{ ShoulderStrap = "3" }
NoteObject = Parse.Object.extend("things");
var object = new NoteObject();
object.save({ ShoulderStrap: ShoulderStrap }).then(function (object) {
alert("yay! it worked");
});
});