Parcourir la source

跳转小程序

chunping il y a 3 ans
Parent
commit
f61adf4b46
2 fichiers modifiés avec 47 ajouts et 265 suppressions
  1. 0 225
      jump-mp.html
  2. 47 40
      public/jump.html

+ 0 - 225
jump-mp.html

@@ -1,225 +0,0 @@
-<html>
-
-<head>
-  <title>打开小程序</title>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
-  <script>
-    window.onerror = e => {
-      console.error(e)
-      alert('发生错误' + e)
-    }
-  </script>
-  <!-- weui 样式 -->
-  <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.4.1/weui.min.css">
-  </link>
-  <!-- 调试用的移动端 console -->
-  <!-- <script src="https://cdn.jsdelivr.net/npm/eruda"></script> -->
-  <!-- <script>eruda.init();</script> -->
-  <!-- 公众号 JSSDK -->
-  <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
-  <!-- 云开发 Web SDK -->
-  <script src="https://res.wx.qq.com/open/js/cloudbase/1.1.0/cloud.js"></script>
-
-  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
-
-  <script>
-    import { urlschemaGeneratee } from "./src/api/business/ticket";
-    function docReady(fn) {
-      if (document.readyState === 'complete' || document.readyState === 'interactive') {
-        fn()
-      } else {
-        document.addEventListener('DOMContentLoaded', fn);
-      }
-    }
-
-    docReady(async function () {
-      var ua = navigator.userAgent.toLowerCase()
-      var isWXWork = ua.match(/wxwork/i) == 'wxwork'
-      var isWeixin = !isWXWork && ua.match(/micromessenger/i) == 'micromessenger'
-      var isMobile = false
-      var isDesktop = false
-      if (navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i)) {
-        isMobile = true
-      } else {
-        isDesktop = true
-      }
-
-      if (isWeixin) {
-        var containerEl = document.getElementById('wechat-web-container')
-        containerEl.classList.remove('hidden')
-        containerEl.classList.add('full', 'wechat-web-container')
-
-        var launchBtn = document.getElementById('launch-btn')
-        launchBtn.addEventListener('ready', function (e) {
-          console.log('开放标签 ready')
-        })
-        launchBtn.addEventListener('launch', function (e) {
-          console.log('开放标签 success')
-        })
-        launchBtn.addEventListener('error', function (e) {
-          console.log('开放标签 fail', e.detail)
-        })
-
-        wx.config({
-          // debug: true, // 调试时可开启
-          appId: 'wx8533800e393dbd6b', // <!-- replace -->
-          timestamp: 0, // 必填,填任意数字即可
-          nonceStr: 'nonceStr', // 必填,填任意非空字符串即可
-          signature: 'signature', // 必填,填任意非空字符串即可
-          jsApiList: ['chooseImage'], // 必填,随意一个接口即可 
-          openTagList: ['wx-open-launch-weapp'], // 填入打开小程序的开放标签名
-        })
-      } else if (isDesktop) {
-        // 在 pc 上则给提示引导到手机端打开
-        var containerEl = document.getElementById('desktop-web-container')
-        containerEl.classList.remove('hidden')
-        containerEl.classList.add('full', 'desktop-web-container')
-      } else {
-        var containerEl = document.getElementById('public-web-container')
-        containerEl.classList.remove('hidden')
-        containerEl.classList.add('full', 'public-web-container')
-        var c = new cloud.Cloud({
-          // 必填,表示是未登录模式
-          identityless: true,
-          // 资源方 AppID - 小程序 AppID
-          resourceAppid: 'wx8533800e393dbd6b', // <!-- replace -->
-          // 资源方环境 ID - 云开发环境 ID
-          resourceEnv: 'mangpiao-prod-0gc3lhscbc41fb6e', // <!-- replace -->
-        })
-        await c.init()
-        window.c = c
-
-        var buttonEl = document.getElementById('public-web-jump-button')
-        var buttonLoadingEl = document.getElementById('public-web-jump-button-loading')
-        try {
-          await openWeapp(() => {
-            buttonEl.classList.remove('weui-btn_loading')
-            buttonLoadingEl.classList.add('hidden')
-          })
-        } catch (e) {
-          buttonEl.classList.remove('weui-btn_loading')
-          buttonLoadingEl.classList.add('hidden')
-          throw e
-        }
-      }
-    })
-
-    async function openWeapp(onBeforeJump) {
-      function GetRequest(name) {
-        var url = window.parent.location.search; //获取url中"?"符后的字串
-        // var theRequest = new Object();
-        if (url.indexOf("?") != -1) {
-          var str = url.substr(1);
-          if (str.indexOf("#" != -1)) {
-            str = str.substr(0);
-          }
-          strs = str.split("&");
-          for (var i = 0; i < strs.length; i++) {
-            if (strs[i].indexOf(name) != -1) {
-              return strs[i].split("=")[1];
-            }
-          }
-        }
-        // return strs || null;
-      }
-      var aa =  GetRequest()
-
-      urlschemaGeneratee({}).then(res=>{
-        console.log('res', res)
-      })
-    }
-  </script>
-  <style>
-    .hidden {
-      display: none;
-    }
-
-    .full {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-    }
-
-    .public-web-container {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    .public-web-container p {
-      position: absolute;
-      top: 40%;
-    }
-
-    .public-web-container a {
-      position: absolute;
-      bottom: 40%;
-    }
-
-    .wechat-web-container {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    .wechat-web-container p {
-      position: absolute;
-      top: 40%;
-    }
-
-    .wechat-web-container wx-open-launch-weapp {
-      position: absolute;
-      bottom: 40%;
-      left: 0;
-      right: 0;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    .desktop-web-container {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    .desktop-web-container p {
-      position: absolute;
-      top: 40%;
-    }
-  </style>
-</head>
-
-<body>
-  <div class="page full">
-    <div id="public-web-container" class="hidden">
-      <p class="">正在打开 “盲票小程序”...</p> <!-- replace -->
-      <a id="public-web-jump-button" href="javascript:" class="weui-btn weui-btn_primary weui-btn_loading"
-        onclick="openWeapp()">
-        <span id="public-web-jump-button-loading" class="weui-primary-loading weui-primary-loading_transparent"><i
-            class="weui-primary-loading__dot"></i></span>
-        打开小程序
-      </a>
-    </div>
-    <div id="wechat-web-container" class="hidden">
-      <p class="">点击以下按钮打开 “盲票小程序”</p> <!-- replace -->
-      <!-- 跳转小程序的开放标签。文档 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html -->
-      <wx-open-launch-weapp id="launch-btn" username="gh_cf2872611f66" path="pages/index/index?id=123456"
-        env-version="trial">
-        <!-- replace -->
-        <template>
-          <button
-            style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">打开小程序</button>
-        </template>
-      </wx-open-launch-weapp>
-    </div>
-    <div id="desktop-web-container" class="hidden">
-      <p class="">请在手机打开网页链接</p>
-    </div>
-  </div>
-</body>
-
-</html>

+ 47 - 40
public/jump.html

@@ -3,7 +3,8 @@
 <head>
   <title>打开小程序</title>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
+  <meta name="viewport"
+        content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
   <script>
     window.onerror = e => {
       console.error(e)
@@ -24,7 +25,9 @@
   <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
 
   <script>
-    function docReady(fn) {
+    import {urlschemaGeneratee} from "./src/api/business/ticket";
+
+    function docReady (fn) {
       if (document.readyState === 'complete' || document.readyState === 'interactive') {
         fn()
       } else {
@@ -38,7 +41,8 @@
       var isWeixin = !isWXWork && ua.match(/micromessenger/i) == 'micromessenger'
       var isMobile = false
       var isDesktop = false
-      if (navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i)) {
+      if (navigator.userAgent.match(
+        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i)) {
         isMobile = true
       } else {
         isDesktop = true
@@ -66,7 +70,7 @@
           timestamp: 0, // 必填,填任意数字即可
           nonceStr: 'nonceStr', // 必填,填任意非空字符串即可
           signature: 'signature', // 必填,填任意非空字符串即可
-          jsApiList: ['chooseImage'], // 必填,随意一个接口即可 
+          jsApiList: ['chooseImage'], // 必填,随意一个接口即可
           openTagList: ['wx-open-launch-weapp'], // 填入打开小程序的开放标签名
         })
       } else if (isDesktop) {
@@ -104,8 +108,8 @@
       }
     })
 
-    async function openWeapp(onBeforeJump) {
-      function GetRequest(name) {
+    async function openWeapp (onBeforeJump) {
+      function GetRequest (name) {
         var url = window.parent.location.search; //获取url中"?"符后的字串
         // var theRequest = new Object();
         if (url.indexOf("?") != -1) {
@@ -122,14 +126,12 @@
         }
         // return strs || null;
       }
-      var aa =  GetRequest()
-
-      // 发送 POST 请求
-      axios({
-        method: 'post',
-        url: 'https://test-mp.quanshu123.com/api/v1/mp/wx/urlschema/generate',
-        data: {}
-      });
+
+      var aa = GetRequest()
+
+      urlschemaGeneratee({}).then(res => {
+        console.log('res', res)
+      })
     }
   </script>
   <style>
@@ -196,32 +198,37 @@
 </head>
 
 <body>
-  <div class="page full">
-    <div id="public-web-container" class="hidden">
-      <p class="">正在打开 “盲票小程序”...</p> <!-- replace -->
-      <a id="public-web-jump-button" href="javascript:" class="weui-btn weui-btn_primary weui-btn_loading"
-        onclick="openWeapp()">
-        <span id="public-web-jump-button-loading" class="weui-primary-loading weui-primary-loading_transparent"><i
-            class="weui-primary-loading__dot"></i></span>
-        打开小程序
-      </a>
-    </div>
-    <div id="wechat-web-container" class="hidden">
-      <p class="">点击以下按钮打开 “盲票小程序”</p> <!-- replace -->
-      <!-- 跳转小程序的开放标签。文档 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html -->
-      <wx-open-launch-weapp id="launch-btn" username="gh_cf2872611f66" path="pages/index/index?id=123456"
-        env-version="trial">
-        <!-- replace -->
-        <template>
-          <button
-            style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">打开小程序</button>
-        </template>
-      </wx-open-launch-weapp>
-    </div>
-    <div id="desktop-web-container" class="hidden">
-      <p class="">请在手机打开网页链接</p>
-    </div>
+<div className="page full">
+  <div id="public-web-container" className="hidden">
+    <p className="">正在打开 “盲票小程序”...</p> <!-- replace -->
+    <a id="public-web-jump-button" href="javascript:"
+       className="weui-btn weui-btn_primary weui-btn_loading"
+       onClick="openWeapp()">
+        <span id="public-web-jump-button-loading"
+              className="weui-primary-loading weui-primary-loading_transparent"><i
+          className="weui-primary-loading__dot"></i></span>
+      打开小程序
+    </a>
+  </div>
+  <div id="wechat-web-container" className="hidden">
+    <p className="">点击以下按钮打开 “盲票小程序”</p> <!-- replace -->
+    <!-- 跳转小程序的开放标签。文档 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html -->
+    <wx-open-launch-weapp id="launch-btn" username="gh_cf2872611f66"
+                          path="pages/index/index?id=123456"
+                          env-version="trial">
+      <!-- replace -->
+      <template>
+        <button
+          style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">
+          打开小程序
+        </button>
+      </template>
+    </wx-open-launch-weapp>
+  </div>
+  <div id="desktop-web-container" className="hidden">
+    <p className="">请在手机打开网页链接</p>
   </div>
+</div>
 </body>
 
-</html>
+</html>