全局变量在 <script> 标签内定义。但是在<script>标签外访问时会被覆盖

Question

我正在尝试访问 HTML 中的 Facebook SDK。

我有一个全局变量accessToken。该变量的值将在 SDK 内部生成。 SDK 包含在 <script> 标签内的 ejs 文件中。

我的EJS代码：

<body>
<!--------------------- Facebook SDK script Starts --------------------->
<%      var accessToken;   %>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '****',
      cookie     : true,
      xfbml      : true,
      version    : 'v2.11'
    });


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 = "https://connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));

   function statusChangeCallback(response){

    if (response.status === 'connected'){
        accessToken= response.authResponse.accessToken;
    console.log("User Logged in. Access Token: " + accessToken);  

    }
    else
    {
        console.log("Not logged into FB");  
    };

    }


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

</script>
<!--=============== Facebook SDK script ends =============== -->

<fb:login-button 
  scope="public_profile,email,user_friends"
  onlogin="checkLoginState();">
</fb:login-button>
<h1>Click here to log into FB: </h1>
<form action="/checkdp" method="GET">
    <input type="hidden" name="accessToken" value="<%=accessToken%>"> 
    <button>Click Here</button>
</form>

</body>

您可能已经注意到，我在 <script> 标签外引入了带有空值的 var accessToken，并在 <script> 标签内定义了它的值。

再次添加代码：

    if (response.status === 'connected'){
        accessToken= response.authResponse.accessToken;
    console.log("User Logged in. Access Token: " + accessToken);

我在控制台记录了这个值，它打印得很好。但是当我再次访问 HTML 表单内的变量时，变量值 = "" (null)。

似乎在 <script> 标签内分配的值一旦在 <script> 标签外就被覆盖了。

我问的一位开发人员说它是异步的或类似的东西。我不明白，所以我无法从他那里得到进一步的帮助。

问题：有人想试一试吗？

Answer 1

隐藏输入字段的值似乎是在解析 HTML 时在页面加载期间分配的。此时accessToken的值还是undefined。

尝试在检索到访问令牌后设置输入元素的值：

if (response.status === 'connected'){
    accessToken= response.authResponse.accessToken;
    document.querySelect( "[name=accessToken]").value = accessToken;
    console.log("User Logged in. Access Token: " + accessToken);

（未测试）。

全局变量在 <script> 标签内定义。但是在<script>标签外访问时会被覆盖

Global variable is defined inside <script> tag. But it is overwritten when accessed outside <script> tag

javascript

ejs

node.js

facebook-javascript-sdk