微信 之短信、邮件、外部网页等拉起小程序

微信 之短信、邮件、外部网页等拉起小程序

2、短信

将跳转的链接生成短链接

二、代码

1、h5代码

<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="http://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> <script> 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: \'<?php echo $signPackage["appId"]?>\', timestamp: \'<?php echo $signPackage["timestamp"]?>\', nonceStr: \'<?php echo $signPackage["nonceStr"]?>\', signature: \'<?php echo $signPackage["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 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) { if (onBeforeJump) { onBeforeJump() } location.href = "urlscheme" } </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原始ID" path="打开页面"> <!-- 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>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zwsxys.html