envincebal

Hi guys, I just got a 403 error on my API calls. Which is weird because I was able to get make successful calls until now. Here's the error:

Failed to load resource: the server responded with a status of 403 (Forbidden)

Here is my code for the call:

const proxyUrl = "https://cors-anywhere.herokuapp.com/";

const key = "8cd10a7136710c1003c8e216d85941ace5a1f00e";

const endpoint = `https://www.giantbomb.com/api/search/?api_key=`; const url = proxyUrl + endpoint + key + `&format=json&resources=game&query=${search}&limit=30`;

fetch(url)

.then(res => res.json())

.then(data => {

const response = data.results;

response.forEach(game => {

this.setState(prevState => ({

games: prevState.games.concat(game)

}))

});

});

I was looking at the Networks Tab on Chrome Dev Tools and previewed the error. It says that it's being blocked because of strange activity in my IP address and that I need to prove I'm not a bot. But it won't let me actually submit anything. Do I need to be authorized from the developer's end? Any help would be appreciated. Also, I'm sorry if the code is formatted all wrong. I'm new to the forums and haven't figured out how to format code here.

@hogonalog Thank you so much! You're a life saver :)

Thanks for all your help, guys.

@szlifier and @hogonalog, forgive my newbie question but how would I prepend static link to my image urls?

https://envincebal.github.io/api-hack/index.html

Hey everyone, I pushed my api project on github's gh-page hosting. The link is right above. Everything works except the images are broken. The images work when I run the project locally. On the console, it gives an error message "GET https://envincebal.github.io/uploads/scale_large/8/82063/2267410-fusion.jpg 404 (Not Found)"

Any help would be greatly appreciate.

Here's my code: *SIDE NOTE: The "http" protocol was removed from the endpoint because it caused an error when making a request while on the hosted site.

$("#search").submit(function(event) {

event.preventDefault();

var userInput = $("#query").val();

getRequest(userInput);

});

function showResults(result) {

var html = "";

$.each(result.results, function(index, value) {

var gameName = value.name;

var boxArt = value.image ? value.image.super_url : '';

var summary = value.deck;

var site_detail = value.site_detail_url;

html += "<li><p class='game-title'>" + gameName + "</p>" + "<img src=" + boxArt + " class='game-image'>" + "<p class='game-summary'>" + summary + "</p>" + "<a href='" + site_detail + "' ><p class='game-details'>Click for more information</p></a></li>";

});

$("#search-results").html(html);

}

function getRequest(userInput){

$.ajax({

url: "http://www.giantbomb.com/api/search",

type: "GET",

data: {

resources: "game",

query: userInput,

api_key: "8cd10a7136710c1003c8e216d85941ace5a1f00e",

format: "jsonp",

crossDomain: true,

limit: 15,

field_list: "deck,name,image,site_detail_url",

json_callback: 'showResults'

},

dataType: "jsonp"

}).done(function(data) {

showResults(data.results);

console.log(data);

});

}

Hey guys, I keep getting this error message on the console and can't print out the data. Any assistance would be greatly appreciated. Thanks

$("#search").submit(function(event){

event.preventDefault();

var userInput = $("#query").val();

getRequest(userInput);

});

function getRequest(userInput){

$.ajax({

url: "http://www.giantbomb.com/api/search",

type: "GET",

data: {

resources: "game",

query: userInput,

api_key: "8cd10a7136710c1003c8e216d85941ace5a1f00e",

format: "jsonp",

crossDomain: true,

limit: 15,

field_list: "platforms,name,image,original_release_date,site_detail_url"

},

dataType: "jsonp"

}).done(function(data){

showResults(data.results);

console.log(data);

});

}

function showResults(result){

var html = "";

$.each(result, function(index,value){

var gameName = value.name;

var boxArt = value.image.icon_url;

var releaseDate = value.original_release_date;

var platform = value.platform.name;

var site_detail = value.platform.site_detail_url;

html += "<li><p>" + gameName + "</p></li>" + "<img src=" +boxArt + ">" + "<p>" + releaseDate + "</p>" + platform + "</p>" + "<a href='" + site_detail + "'><p>Click here for more information</p></a>";

});

$("#search-results").html(html);

}