Question

我遇到了一个有趣的问题。我试图了解何时加载内联js函数。应该先定义什么？调用函数的html或函数本身？

我应该注意到我使用babel来使用es6类和模块。相当自信不是问题。

我使用Facebook SDK遇到了这个问题。我不确定Facebook需要加载的元素的顺序。我已按推荐的顺序将它们包含在内，但它不会识别facebook登录按钮内的onlogin挂钩。

我的html（jade）看起来像这样：

script(src='assets/js/bundle.js')

fb:login-button(scope='public_profile,email', onlogin='checkLoginState();')
#status

我已经拥有

function statusChangeCallback(response) {
  if (response.status === 'connected') {
    testAPI();
  } else if (response.status === 'not_authorized') {
    document.getElementById('status').innerHTML = 'Please log into this app.';
  } else {
    document.getElementById('status').innerHTML = 'Please log into Facebook.';
  }
}

function checkLoginState() {
  FB.getLoginStatus(function(response) {
    statusChangeCallback(response);
  });
}

window.fbAsyncInit = function() {
  FB.init({
    appId      : '###########',
    cookie     : true,
    xfbml      : true,
    version    : 'v2.6'
  });

  FB.getLoginStatus(function(response) {
    statusChangeCallback(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 = "//connect.facebook.net/en_US/sdk.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

function testAPI() {
...
}

但是，如果我点击Facebook登录，它将不会触发checkLoginState函数并返回undefined。

这正是他们prescribe的流程。

或者，需要加载的顺序是什么？

尝试的解决方案：

撤消订单。我已经尝试在按钮
我尝试将fbAsyncInit更改为iife。
我已经尝试完全绕过onlogin功能，但响应回复未知。
新方法 - 手动构建按钮并使用document.addEventListener

我应该使用Inline JS或定义JS First的脚本加载HTML吗？

0 个答案: