Facebook Javascript API fan_count - javascript

I am new to Javascript and am try to follow the Facebook steps to display fan_count (likes) on my webpage. I have done the following but for the life of me can't work out how the count is displayed.
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '231179987472162',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.0'
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<h1>Hello, world!</h1>
<script>
FB.api(
'/cityviewshopping',
'GET',
{"fields":"fan_count"},
function(response) {
// Insert your code here
}
);
</script>

Related

facebook customer chat SDK with vuejs

I just want to implement a Facebook customer chat feature with my vuejs application.
This is my full code in the index.html file.
<body>
<div id="app" page_id="PAGE_ID" minimized="false" class="fb-customerchat"></div>
<!-- Include after Vue (before closing body) -->
<script src="https://unpkg.com/vue-fullpage.js/dist/vue-fullpage.min.js"></script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID',
autoLogAppEvents : true,
xfbml : true,
version : 'v2.11'
});
};
(function(d, s, id){
console.log('d',d,'s',s,'id',d)
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- built files will be auto injected -->
</body>
I am sure that my page_id and app_id is correct.
I don't know what's wrong with the code. I can't see any error in the console log also.
I implement exact same thing in a normal html file. It works 100%
<body>
<div
class="fb-customerchat"
page_id="PAGE_ID"
minimized="false"
></div>
<script>
window.fbAsyncInit = function () {
FB.init({
appId: 'APP_ID',
autoLogAppEvents: true,
xfbml: true,
version: 'v2.11',
});
};
(function (d, s, id) {
var js,
fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement(s);
js.id = id;
js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js';
fjs.parentNode.insertBefore(js, fjs);
})(document, 'script', 'facebook-jssdk');
</script>
</body>
I don't know why this is not working with the vue.js.
Is that something with webpack building or something else?

Facebook embedded "JOIN GROUP" button event .. something like Onclick

i have added join group fb plugin to my webpage, now i want to trigger a event when someone click on that "join group button".
FB.Event.subcribe is not working for this. i think that's only for like button
window.fbAsyncInit = function() {
FB.init({
appId : '*********',
xfbml : true,
version : 'v3.3'
});
FB.Event.subscribe('edge.create', function(response) {
alert("working");
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//code which I get from facebook
<div class="fb-group" data-href="https://www.facebook.com/groups/[group-id]/" data-width="450" data-show-social-context="true" data-show-metadata="false"></div>

How do I fix "Uncaught ReferenceError: FB is not defined"?

When I run this code, in Google Chrome, it gives me the following error:
Uncaught ReferenceError: FB is not defined
I have read multiple other questions regarding the same error but none seem to have a solution for this.
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxxxx',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.2'
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
FB.api(
'/me',
'GET',
{"fields":"id,name,posts{picture,message,comments{likes}}"},
function(response) {
// Insert your code here
}
);
I want the Facebook API to return the fields I have selected.
My code is a copy of the code shown in Facebook's documentation.
You cannot use FB before the JS SDK is initialized:
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxxxx',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.2'
});
FB.api(
'/me',
'GET',
{"fields":"id,name,posts{picture,message,comments{likes}}"},
function(response) {
console.log(response);
}
);
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Btw, this code will not work without user authorization. How to do that is explained in detail here: https://developers.facebook.com/docs/facebook-login/web/
There is also a full example in the docs: https://developers.facebook.com/docs/facebook-login/web/#example

message : "invalid version specified"

For some reason the Facebook login SDK is giving this error: message
:"invalid version specified".
I've simply copied the code from their site:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{my app id is here}',
cookie : true,
xfbml : true,
version : '{v3.0}'
});
FB.AppEvents.logPageView();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

I installed the facebook chat plugin and found the Uncaught error h - sdk.js 108

I developed a website using magento ver.1.9.3 and used a basic theme named RWD.
Then I have to paste this code into Header (this code is derived from https://developers.facebook.com)
<div class="fb-customerchat" page_id="my-page_id" minimized="true"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'my-App_id',
autoLogAppEvents : true,
xfbml : true,
version : 'v2.12'
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/th_TH/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Then there is an error. Uncaught h> sdk.js: 108 At frame PostmessageRelay
{throw u},0);return false}};return t.__wrapper}function r(t){try{return t&&t.callee&&t.callee.caller?t.callee.caller.name:""}catch(u){return""}}function s(t,u){return function(v,w){var x=u+":"+(n||"[global]")+":"+(v.name||"[anonymous]"+r(arguments));return t(j(v,"entry",x),w)}}if(l){setTimeout=s(setTimeout,"setTimeout");setInterval=s(setInterval,"setInterval");j.setWrapper(p,"entry")}return{guard:p,unguard:q}}f.exports={create:k}}),null);

Categories

Resources