2017-02-08 1 views
2

J'essaie d'implémenter le plugin Facebook Messenger Checkbox dans mon application AngularJS. Je suis ce guide https://developers.facebook.com/docs/messenger-platform/plugin-reference/checkbox-plugin.Le plugin de la case à cocher Facebook messenger n'est pas affiché

J'ai réussi à le faire fonctionner. Je navigue vers la page et mon plugin checkbox messenger est affiché, mais quand je navigue vers une autre page et puis revenir à cette page qui contient Facebook Checkbox Messenger Plugin il n'est pas rendu et je n'ai rien enregistré de Facebook.

Ceci est mon processus d'initialisation pour FB

$window.fbAsyncInit = function() { 
    FB.init({ 
     appId: 'MY_FACEBOOK_APP_ID', 
     xfbml: true, 
     version: 'v2.8' 
    }); 
}; 
(function (d, s, id) { 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    var fbElement = d.getElementById(id); 
    if (fbElement) { 
    return; 
    } 
    js = d.createElement(s); 
    js.id = id; 
    js.src = '//connect.facebook.net/en_US/sdk.js'; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 

et ceci est ma directive pour case messenger facebook Plugin

<div 
    class="fb-messenger-checkbox" 
    origin="{{origin}}" 
    page_id="{{pageId}}" 
    messenger_app_id="{{messengerAppId}}" 
    user_ref="{{userRef}}" 
    prechecked="true" 
    allow_login="true" 
    size="xlarge"> 
</div> 

Comme je l'ai dit tout est ok lorsque je navigue première fois à la page (alors le plugin Facebook Checkbox Messenger est rendu). Après cela quand je navigue vers une autre page et que je récupère le plugin n'est plus affiché. Il n'y a pas d'erreur et aussi je recalcule le paramètre user_ref à chaque fois pour être une chaîne aléatoire.

Il me semble que lorsqu'une fois FB.init est appelé après que je retourne à cette page (même si je ne FB.init pas encore) quelque chose ne va pas.

Est-ce que quelqu'un sait ce qui peut être un problème?

Répondre

0

Pour un, vous devez inscrire votre domaine sur la liste blanche avec fb.

+0

Oui J'ai ajouté à la liste blanche le domaine. Je pense que les paramètres de l'application Facebook sont ok parce que, comme je l'ai dit, le plugin facebook messenger checkbox fonctionne réellement mais juste la première fois que je navigue vers cette page qui le contient. Quand je navigue le temps de deuxième/troisième/etc il rend juste le html que j'ai fourni mais il semble que le script de facebook n'est pas déclenché et il ne rend pas l'iframe dans le html que j'ai fourni. – user3362996

+0

Est-il exposé publiquement? Quelle est l'URL? – Ram

1

Assurez-vous que vous générez user_ref chaque fois que la page est rendue. Si même user_ref est donnée alors case ne sera pas rendu

0

J'ai eu le même problème et vous devez utiliser votre code javascript:

FB.XFBML.parse(document.getElementById('fb-messenger_checkbox')); (ezfb au lieu de FB si vous utilisez-easyFb angulaire comme je faire)

vous pouvez également essayer dans la console pendant que vous êtes sur votre application, il rend le plugin trop si vous avez fait tout le reste correct:

  • votre domaine
  • liste blanche
  • Randomized l'utilisateur-ref (par exemple $scope.userRef = Math.floor((Math.random() * 10000000000000) + 1);)

PS: si vous utilisez-easyfb angulaire, vous n'avez pas besoin de charger un window.fbAsyncInit $, ezfb faire pour vous

+0

Pourquoi un utilisateur randomiserait-il l'arbitre? Cela causerait-il que le plugin FB ne soit pas rendu? –

+0

Oui exactement. Comme il est dit dans le document, chaque fois que vous voulez rendre le plugin, vous devez avoir un user_ref différent. C'est pourquoi vous devriez randomiser cette variable. –