node.js - 测试微信页面支持scanQRCode接口，但调用该接口代码的时候，为什么这段js代码没有执行？-PHP Chinese Network Q&A

按照官方开发者文档中的demo去做了一样的配置，为什么点击【扫一扫】按钮没有触发这段接口代码？
还有没有触发是不是wx.config没有配置对的原因，
wx.config中appId在账号后台可以找到，那timestamp，nonceStr，signature这3个参数是哪里获取的？

wx.scanQRCode({
                needResult: 1,
                desc: 'scanQRCode desc',
                success: function (res) {
                alert(JSON.stringify(res));
                }
        });

以下是我完整的测试代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
    <script type="text/javascript" src="js/lib/zepto.min.js"></script>
</head>
<body>
    <button id="checkJsApi">是否支持js接口</button>
    <br>
    <br>
    <br>
    <br>
    <button id="scanTD">扫一扫</button>
</body>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
      /*
       * 注意：
       * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
       * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
       * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
       *
       * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈：
       * 邮箱地址：weixin-open@qq.com
       * 邮件主题：【微信JS-SDK反馈】具体问题
       * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
       */
      wx.config({
          debug: false,
          appId: 'wxf8b4f85f3a794e77',
          timestamp: 1474338092,
          nonceStr: 'dGd8HrTtWMwXiHZl',
          signature: 'ff14f84f18b701f681c91ecb5c8ba84258599144',
          jsApiList: [
            'checkJsApi',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareWeibo',
            'onMenuShareQZone',
            'hideMenuItems',
            'showMenuItems',
            'hideAllNonBaseMenuItem',
            'showAllNonBaseMenuItem',
            'translateVoice',
            'startRecord',
            'stopRecord',
            'onVoiceRecordEnd',
            'playVoice',
            'onVoicePlayEnd',
            'pauseVoice',
            'stopVoice',
            'uploadVoice',
            'downloadVoice',
            'chooseImage',
            'previewImage',
            'uploadImage',
            'downloadImage',
            'getNetworkType',
            'openLocation',
            'getLocation',
            'hideOptionMenu',
            'showOptionMenu',
            'closeWindow',
            'scanQRCode',
            'chooseWXPay',
            'openProductSpecificView',
            'addCard',
            'chooseCard',
            'openCard'
          ]
      });

    </script>
    <script>
      wx.ready(function(){
          alert("api right init!");

               document.querySelector('#checkJsApi').onclick = function () {
                wx.checkJsApi({
                  jsApiList: [
                    'scanQRCode'
                  ],
                  success: function (res) {
                    alert(JSON.stringify(res));
                  }
                });
              };

            document.querySelector("#scanTD").onclick = function(){
                alert("load ok!");
                wx.scanQRCode({
                    needResult: 1,
                    desc: 'scanQRCode desc',
                    success: function (res) {
                    alert(JSON.stringify(res));
                    }
                });
            }
      });
      wx.scanQRCode();
</script>

</html>