Search code examples
javascriptbottle

Why does typeof JSON.parse returns string


Brief Explanation

I'm using bottle.py as a simple web server and I'm rendering a javascript, passing it a python dictionary, then in the javascript file I want to add another field to the object and make a post request with the result.

However when i log the typeof datain likePost() returns string, so I can't add the new property to the object.

Also I tried without JSON.Stringify() and returns the following error: Unexpected token ' in JSON at position

Code

    function commentPost(post){
        var comment = prompt("Comment:", "Great post I like it")
        data = JSON.parse(JSON.stringify(post))
        console.log(typeof data)                      // RETURNS STRING
        data.comment = comment                        // THIS DOESN'T WORK
        fetch("/post", {
            method: "POST", 
            body: JSON.stringify(data)
        }).then(res => {
            likePost(data)       
        });

    }
Console.log(post)
{'hashtag': 'landscapephotography', 'shortcode': 'B_5b0IWqrRU', 'display_url': 'https://scontent-mad1-1.cdninstagram.com/v/t51.2885-15/e35/s1080x1080/95910887_233194497953707_7239044831960646903_n.jpg?_nc_ht=scontent-mad1-1.cdninstagram.com&_nc_cat=107&_nc_ohc=i179pDQmui0AX82O3nB&oh=676ca07cba3af57944abcba4d3a27ad2&oe=5EDE8D74', 'thumbnail_src': 'https://scontent-mad1-1.cdninstagram.com/v/t51.2885-15/sh0.08/e35/s640x640/95910887_233194497953707_7239044831960646903_n.jpg?_nc_ht=scontent-mad1-1.cdninstagram.com&_nc_cat=107&_nc_ohc=i179pDQmui0AX82O3nB&oh=1ff2ac0b031bcc7cbdbb64b2a661ea1b&oe=5EDF0745', 'is_video': False, 'comments_disabled': False, 'caption': 'Photo by Jelen Girona on May 07, 2020.', 'comments_count': 0, 'timestamp': 1588877630, 'owner': '15642627659', 'likes_count': 0}
Console.log(typeof post)

string


Solution

  • While your typeof post is of string then you just need to use JSON.parse.

    The reason this fails, is because a valid JSON can only have double quotes(also check here for the full JSON syntax). Try:

    JSON.parse(post.replace(/\'/g, '"'))
    

    For your case though (I just saw your updated question), your source seems to return False with the first letter capitalized and you will get a new error after trying the above.

    Uncaught SyntaxError: Unexpected token F in JSON at position 617

    If you can't make your API return it properly, you will have to .replace it as well.

    const post = "{'hashtag': 'landscapephotography', 'shortcode': 'B_5b0IWqrRU', 'display_url': 'https://scontent-mad1-1.cdninstagram.com/v/t51.2885-15/e35/s1080x1080/95910887_233194497953707_7239044831960646903_n.jpg?_nc_ht=scontent-mad1-1.cdninstagram.com&_nc_cat=107&_nc_ohc=i179pDQmui0AX82O3nB&oh=676ca07cba3af57944abcba4d3a27ad2&oe=5EDE8D74', 'thumbnail_src': 'https://scontent-mad1-1.cdninstagram.com/v/t51.2885-15/sh0.08/e35/s640x640/95910887_233194497953707_7239044831960646903_n.jpg?_nc_ht=scontent-mad1-1.cdninstagram.com&_nc_cat=107&_nc_ohc=i179pDQmui0AX82O3nB&oh=1ff2ac0b031bcc7cbdbb64b2a661ea1b&oe=5EDF0745', 'is_video': False, 'comments_disabled': False, 'caption': 'Photo by Jelen Girona on May 07, 2020.', 'comments_count': 0, 'timestamp': 1588877630, 'owner': '15642627659', 'likes_count': 0}"
    
    const postObject = JSON.parse(post.replace(/\'/g, '"').replace(/False/g, 'false'));
    console.log(postObject);

    I would suggest you also check true. Maybe your source/API/backend also returns it with the first letter capitalized and cause your code to break at a later time.