jump.html 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. <html>
  2. <head>
  3. <title>打开小程序</title>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
  6. <script>
  7. function ajax(options) {
  8. return new Promise((resolve, reject) => {
  9. if (!options.url) {
  10. alert("确认你的url");
  11. return;
  12. }
  13. let method = options.method || 'GET';
  14. let async = options.async || true;
  15. let xhr = new XMLHttpRequest();
  16. if (method === 'GET') {
  17. // url后面添加随机数防止请求缓存
  18. xhr.open(method, options.url + "?" + Math.random(), async);
  19. xhr.send(null);
  20. } else if (method === 'POST') {
  21. xhr.open(method, options.url, async);
  22. xhr.setRequestHeader('Content-type', 'application/json;charset=utf-8');
  23. xhr.send(JSON.stringify(options.data));
  24. }
  25. xhr.onreadystatechange = () => {
  26. if (xhr.responseText) {
  27. resolve(xhr.responseText);
  28. }
  29. };
  30. xhr.onerror = (e) => {
  31. reject(e);
  32. }
  33. }).catch(e => {
  34. });
  35. }
  36. function openWeapp() {
  37. ajax({
  38. method: 'POST',
  39. async: false,
  40. url: 'https://test-mp-adm.quanshu123.com/test-api/api/v1/mp/wx/urlschema/generate',
  41. data: {
  42. path: '/pages/index/index',
  43. query: 'id=3847838'
  44. }
  45. }).then(res=>{
  46. console.log('res', res)
  47. window.location.href = "weixin://";
  48. })
  49. }
  50. </script>
  51. <style>
  52. .skip-wrap {
  53. height: 100vh;
  54. width: 100%;
  55. position: relative;
  56. }
  57. .skip-theme {
  58. display: flex;
  59. align-items: center;
  60. flex-direction: column;
  61. padding: 200px 0 0;
  62. }
  63. .skip-theme-iamge {
  64. width: 60px;
  65. height: 60px;
  66. line-height: 60px;
  67. text-align: center;
  68. color: #fff;
  69. background-color: #e96737;
  70. border-radius: 50%;
  71. margin-bottom: 10px;
  72. }
  73. .skip-theme-txt {
  74. color: rgb(194, 184, 184);
  75. text-align: center;
  76. }
  77. .skip-btn {
  78. position: absolute;
  79. bottom: 50px;
  80. width: 100%;
  81. display: flex;
  82. align-items: center;
  83. justify-content: center;
  84. }
  85. .skip-btn p {
  86. height: 30px;
  87. width: 200px;
  88. background-color: rgb(7, 192, 88);
  89. border-radius: 8px;
  90. line-height: 30px;
  91. color: #fff;
  92. text-align: center;
  93. }
  94. </style>
  95. </head>
  96. <body>
  97. <div class="skip-wrap">
  98. <div class="skip-theme">
  99. <div class="skip-theme-iamge">logo</div>
  100. <div class="skip-theme-txt">小程序</div>
  101. </div>
  102. <div class="skip-btn">
  103. <p onclick="openWeapp()">打开微信小程序</p>
  104. </div>
  105. </div>
  106. </body>
  107. </html>