Posting content to Facebook API using Javascript

Question

I am trying to post to Facebook API using Javascript. It works well when the content is hard coded in Javascript, but when I gather the content from a textbox entered by user. It throw a Same-origin policy error:

This is where I do the posting.

        FB.api('/1494363804210145/feed', 'post', postData, 
        function(response) {
            console.log(JSON.stringify(response));
            $("#status").val("Your Message as been posted!");
        });

If postData is hardset, it works:

        var postData = { 
            message      : "TEST",
            name         : "TEST",
            from         : 'pageid',
            access_token : pageAccessToken,
            description  : "TEST"
        };

If postData is dynamic, it does not work:

        var postData = { 
            message      : $("#postMessage"),
            link         : $("#postLink"),
            picture      : $("#postImage"),
            name         : $("#postTitle"),
            from         : 'pageid',
            access_token : pageAccessToken,
            description  : $("#postDesc")
        };

I am not using IFrame of any kind. How do I fix this?

The issue with your code is you are not retrieving value or text from those selectors, you are just assigning object keys value as jQuery selector which will return object. Either you call the method val() if those are form elements or html() / text() if you want content from those elements.. — Rayon

naveen naveen · Accepted Answer · 2015-09-13T04:14:55

You need to append .val(). Right now you are trying to post the jQuery object.

var postData = { 
    message      : $("#postMessage").val(),
    link         : $("#postLink").val(),
    picture      : $("#postImage").val(),
    name         : $("#postTitle").val(),
    from         : 'pageid',
    access_token : pageAccessToken,
    description  : $("#postDesc").val()
};

Posting content to Facebook API using Javascript

1 Answers