0

I'm trying to share a website I've done using GitHub pages, but I'm having troubles loading the JSON files.

This is for a friends game server website, using HTML 5, JavaScript and JSON, I've tried running it from localhost and it worked perferctly fine. The issue actually is a SyntaxError : Unexpected token < in JSON at position 0 and when I try to look for the JSON file in chrome debugger I can't see my JSON files to check where the probleme could be coming from.

The JSON file :

{
    "header_menu_games": "Games",
    "header_menu_home": "Home",
    "header_menu_rules": "Rules",
    "header_menu_support": "Support",
    "header_serverip_text": "Server ip:",
    "header_serverip_copy_btn": "Copy"
}

The JavaScript code I use to translate :

if (isLanguageAvailable) {
    var myRequest = new Request(`../../src/lang/${userLang}.json`);
    console.info(`User language (${userLang}) is available`);
} else {
    var myRequest = new Request("../../src/lang/en.json");
    console.info(`The user language (${userLang}) is unfortunately not available`);
}
console.log(myRequest);

fetch(myRequest)
    .then(resp => {
        resp.json()
            .then(data => {
                document.getElementById("lang-header_serverip_text").innerHTML = data.header_serverip_text;
            })
            .catch(err => {
                console.error(err);
            });
    })
    .catch(err => {
        console.error(err);
    });

Console error:

console_error

JavaSript catch error:

js_catch_error

The full code is available on GitHub.

  • 4
    You are getting 404 error. Its not a json. – EylM Aug 13 at 14:33
  • i think if you fix your 404 which comes from a not found json file the syntax error will also disappear – messerbill Aug 13 at 14:34
  • you have to check for resp.ok – Daniel A. White Aug 13 at 14:34
  • The thing is I don't know how to fix this 404 from a not found json file ; even if I change the path in the request, the file's not found – Vianpyro Aug 13 at 14:42
  • this is because github.io does not return that json file on the given path – messerbill Aug 13 at 14:45
2

I believe you're receiving a 404 error because you're pointing your link at the repository location instead of the actual content. You were linking to a nonexistent link: https://vianpyro.github.io/src/lang/en.json

You can do this one of two ways:

  1. Link to the raw version of the file from the repository

  2. Point at the correct location from your friend's domain


1. Linking to the Raw Version

In github, click on Raw and it should open a page containing the actual JSON.

Screenshot of Github

You'll see that the actual link to the content is: https://raw.githubusercontent.com/Vianpyro/Aycraft/master/src/lang/en.json


2. Linking to the hosted location

Part of your original problem was that you weren't pointing at the right path. Your friend's site is hosted at https://vianpyro.github.io/Aycraft and not https://vianpyro.github.io/.

This means that the base url of the site is https://vianpyro.github.io/Aycraft and everything in the path has to follow that. You have to include the /Aycraft after the domain name since that is the baseurl of the site.

The correct url would be: https://vianpyro.github.io/Aycraft/src/lang/en.json

  • Glad I could help! I updated my response for clarity for any others taking a look as well. – Jacob Helton Aug 13 at 14:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.