fission-page.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  7. <link rel="stylesheet" href="css/weui.min.css"/>
  8. <link rel="stylesheet" href="css/weuix.min.css"/>
  9. <link rel="stylesheet" href="css/style.css?vision=1.11">
  10. <script src="js/md5.js"></script>
  11. <script src="js/vue.min.js"></script>
  12. <script src="js/zepto.min.js"></script>
  13. <script src="js/zepto.weui.min.js"></script>
  14. <script src="js/php.js"></script>
  15. <script src="js/axios.min.js"></script>
  16. <script src="js/weChatSdk.js"></script>
  17. </head>
  18. <body>
  19. <div id="myApp" class="bg-box">
  20. <img alt="" class="headImg-box" :src=headSrc>
  21. <div class="content-box">
  22. <img alt="" :src=contentSrc />
  23. </div>
  24. <div class="num-box">已有 <span style="color: #A4404E">{{num}}</span> 人领取成功</div>
  25. <!--<img class="get-btn-box" src="image/get-free.gif" alt="" onclick="isfollowqr('http://open.weixin.qq.com/qr/code?username=hszuqiu')" />-->
  26. <img class="get-btn-box" src="image/get-free.gif" alt="" @click="goWeChat" />
  27. </div>
  28. </body>
  29. <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript"></script>
  30. <script type="text/javascript" src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js"></script>
  31. <script>
  32. const apiUrl = 'http://fission.xazhima.com/api/api.php';
  33. new Vue({
  34. el:'#myApp',
  35. data:{
  36. num:52255,
  37. headSrc:'image/headImg.png',
  38. contentSrc:"image/content-bg.png",
  39. weChatCode:'',
  40. isFollow:'0'
  41. },
  42. methods:{
  43. goWeChat(){
  44. if(this.isFollow === '0'){
  45. location.href = 'http://mp.weixin.qq.com/mp/getmasssendmsg?__biz=MzUzOTcwMjM0OQ==#wechat_webview_type=1&wechat_redirect'
  46. }
  47. else {
  48. console.log('show share modal');
  49. wx.onMenuShareAppMessage()
  50. }
  51. },
  52. subStrUrlCode: function () {
  53. let weChatCodeUrl = location.search; //获取url中"?"符后的字符串
  54. let theRequest = {};
  55. if (weChatCodeUrl.indexOf("?") !== -1) {
  56. let str = weChatCodeUrl.substr(1);
  57. let strS = str.split("&");
  58. for(let i = 0; i < strS.length; i ++) {
  59. theRequest[strS[i].split("=")[0]]=(strS[i].split("=")[1]);
  60. }
  61. }
  62. console.log(theRequest);
  63. return theRequest.code;
  64. },
  65. judgeLogin(){
  66. axios({
  67. method: 'post', //请求方式 有常用的有get post等
  68. url: apiUrl, //请求地址
  69. data: {
  70. method: 'login',
  71. timestamp: 11111111,
  72. sign:md5('login'+'11111111')
  73. }, //代表传过去的参数对象,
  74. transformRequest: [function(data) {
  75. let ret = '';
  76. for (let it in data) {
  77. ret += encodeURIComponent(it) + '=' +
  78. encodeURIComponent(data[it]) + '&'
  79. }
  80. return ret
  81. }], //将传参修改为formData格式 注释则为JSON格式
  82. }).then(function(rs) {
  83. if(rs.data.code === 200) {
  84. window.location.href = rs.data.msg;
  85. }else {
  86. }
  87. }).catch(function(e) {
  88. console.log(e);
  89. });
  90. },
  91. setWxConfig(param){
  92. wx.config({
  93. debug: false,
  94. appId: param.appId,
  95. timestamp: param.timestamp ,
  96. nonceStr : param.nonceStr,
  97. signature: param.signature,
  98. jsApiList: [
  99. 'imagePreview', 'chooseImage', 'uploadImage'
  100. ]
  101. });
  102. },
  103. sendCodeRequest(){
  104. let that = this;
  105. that.weChatCode = that.subStrUrlCode();
  106. axios({
  107. method: 'post', //请求方式 有常用的有get post等
  108. url: apiUrl, //请求地址
  109. data: {
  110. method: 'wxinfo',
  111. timestamp: 11111111,
  112. code:that.weChatCode,
  113. jsUrl:'http://www.baidu.com',//(location.href.split('#')[0]),
  114. sign:md5('wxinfo'+'11111111')
  115. }, //代表传过去的参数对象,
  116. transformRequest: [function(data) {
  117. let ret = '';
  118. for (let it in data) {
  119. ret += encodeURIComponent(it) + '=' +
  120. encodeURIComponent(data[it]) + '&'
  121. }
  122. return ret
  123. }], //将传参修改为formData格式 注释则为JSON格式
  124. }).then(function(rs) {
  125. if(rs.data.code === 200) {
  126. that.setWxConfig(rs.data.msg.js_sign);
  127. that.headSrc = rs.data.msg.headimgurl;
  128. that.isFollow = rs.data.msg.subscribe;
  129. }
  130. }).catch(function(e) {
  131. console.log(e);
  132. });
  133. }
  134. },
  135. mounted(){
  136. this.subStrUrlCode() ? this.sendCodeRequest() : this.judgeLogin()
  137. }
  138. })
  139. </script>
  140. </html>