Kevin Powell - Community•16mo ago

.json

Not sure if this is front or back-end But um, can someone please tell me how to get a .json file to be fetched ? I couldn't do cors, don't know why or what that does, I assume from what I read it means being able to actually use teh content In other words I'll need to be able to actually get it with cors enabled... I knew long ago how to get .json data, but I no longer do Please someone help me out https://github.com/BrightDN/poketoolsTools/blob/main/jsonTesting.json

async function populate() {
    const requestURL =
      "https://github.com/BrightDN/poketoolsTools/blob/main/jsonTesting.json";
    const request = new Request(requestURL);
  
    const response = await fetch(request, { mode: 'no-cors'});
    const test = await response.json();
    console.log(test)
}

async function populate() {
    const requestURL =
      "https://github.com/BrightDN/poketoolsTools/blob/main/jsonTesting.json";
    const request = new Request(requestURL);
  
    const response = await fetch(request, { mode: 'no-cors'});
    const test = await response.json();
    console.log(test)
}

GitHub

poketoolsTools/jsonTesting.json at main · BrightDN/poketoolsTools

.JSON files and images pokemon-related. Contribute to BrightDN/poketoolsTools development by creating an account on GitHub.

27 Replies

BrightieOP•16mo ago

or will all be fine ocne I upload the file I'm calling from onto github? As I see something about credentials:same-origin

briancross•16mo ago

Your JSON file isn’t valid JSON.

BrightieOP•16mo ago

how can I make it valid json then?

briancross•16mo ago

Become familiar with the format.

BrightieOP•16mo ago

I- Hold on, did I have to start with a [ and end with a ] after all?

briancross•16mo ago

[ { "testing": "This", "json": "file" }, { "other": "file", "could": "be", "this": "right", "over": "here" } ]

BrightieOP•16mo ago

I see, so in other words... I first had it correct but then stupidly made it incorrect bc of what I saw being done on a page explaining how to get the json data and once I do that, it should work perfectly, even without no-cors mode ?

briancross•16mo ago

Try the fetch with just the URL and see what happens.

BrightieOP•16mo ago

alright, let me make the json correct again first

BrightieOP•16mo ago

Got the cross-origin issue again, with no cors I also still got the unexpected end of input error, tho I have no clue where that ones coming from

BrightieOP•16mo ago

This appears to be the reason, however I have no clue what this should be All I can think of is a title?

briancross•16mo ago

Yeah the server has to send the header in order for it to work.

BrightieOP•16mo ago

its on github.. Any idea how I can get that done? am I suppsed to add a certain license or

briancross•16mo ago

I’m pretty sure you can’t do anything since you don’t control the server.

BrightieOP•16mo ago

I've found this It appears github has a rest API, I would have toauthenticate and then I would be able to use headers, from what I'm able to get

briancross•16mo ago

I’m not an expert but CORS only affects browsers. You might be able to deploy a simple express proxy to relay the requests. Hopefully someone who knows more can chime in here.

BrightieOP•16mo ago

Well, I am already grateful for the help on pointing out my syntax on the JSON was wrong I thought I did it incorrectly first when I used those [] at begin n end

briancross•16mo ago

I’m not sure why you’re trying to pull a JSON file from GitHub. Why don’t you deploy the file with your site and then you don’t have to worry about CORS.

BrightieOP•16mo ago

Oh, I wanted them centralized and not constantly loaded Unless unlike JS, it would only load the JSON file when called upon As currently all the data for the JSON file is in a JS, its already over 4K lines and if things go on like this I think the end result of the file would be 7K+ lines Actually, the end result would be well over 12K lines now that I think of it

briancross•16mo ago

Sounds like you need a database or something.

BrightieOP•16mo ago

yeah but I don't wish to invest money into this project, I won't gain anything from it And it is just my first project to fill up a portfolio Tho for my next project I'll most likely have to figure out how to get a database that's free with infinite calls, as most free databases have limited calls my next project is not just to fill up the portfolio, well partially is But it's to tackle a real problem at my current job, which gives it extra value too xd Problem is that I will need a database that I can call infinitely on If that is not possible, I'll simply have to make guidelines on how to use it whe nthsi that I heard from one of my old-teachers mySql should have infinite calls but I'll have to look into that

briancross•16mo ago

I just realized that you're trying to fetch the web page that shows the JSON data, rather than the raw JSON data. Remove the access control header from the json file. It doesn't belong there. Click where it says "raw" and use the URL it links to. That's the raw json data. This is the URL for the raw json data: https://raw.githubusercontent.com/BrightDN/poketoolsTools/main/jsonTesting.json

BrightieOP•16mo ago

ahh, yeah that did the trick, however I've run into a confusing error: but it has testing:"smth" on line 5

BrightieOP•16mo ago

if I'm not mistaken the syntax is propertyName:propertyValue

briancross•16mo ago

That seems to be a problem with your json format. The cors issue is resolved though.

BrightieOP•16mo ago

Yeah, thank you btw, I would've never realised I wasn't using the correct link Hmm, well I'll look into that format thing tomorrow, Im calling it a night, goodnight and once again thanks for taking the time to help me out Alright, I took a quick checkbefore heading to bed, I think I've figured out the mistake I literally wrote this correct in my JavaScript alternative, mann I have to put quotation marks around the "PropertyName"

briancross•16mo ago

👍🏻

Gaming

Programming

.json