百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT知识 > 正文

手机端H5页面直接打开微信小程序

liuian 2024-12-04 13:45 232 浏览

手机端H5页面直接打开微信小程序,相信这个功能很多同学都会用到,下面我记录一下怎么实现的

这里是用到了微信小程序自带的功能:开放能力 /获取小程序链接 /获取 URL Scheme
注意前提条件:开放范围,针对非个人主体小程序开放。

操作流程

通过服务端接口或在小程序管理后台「工具」-「生成 URL Scheme」入口可以获取打开小程序任意页面的 URL Scheme。适用于从短信、邮件、微信外网页等场景打开小程序。 通过 URL Scheme 打开小程序的场景值为 1065。

生成的 URL Scheme 如下所示:weixin://dl/business/?t=*TICKET*

操作步骤

这里我就直接使用小程序的官方后台功能生成url了,首先需要扫码登陆小程序,登陆地址 https://mp.weixin.qq.com/

登陆之后,找到头部导航右上角左右的一个“工具”菜单,如图所示,有个 “生成小程序URL Scheme” 的菜单,点击它:

点击菜单之后,可以看到有几个选项需要填写,根据自己的需要填写相应的值就可以了,如下图所示:

填写完毕后,点击 “生成” 按钮,即可生成在H5中可以直接打开的链接


生成后的协议链接代码: weixin://dl/business/?t=x填写自己生成的xx

在H5页面中使用这段代码

新建一个 html 页面,把下面的代码复制到自己的html中,把生成的链接,替换成自己的,页面的样式可以自己设计修改

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>H5跳转到微信小程序</title>
        <meta name="viewport" id="viewport" content="width=320, initial-scale=1, maximum-scale=1, user-scalable=no">
        <meta content="yes" name="apple-mobile-web-app-capable">
        <meta content="black" name="apple-mobile-web-app-status-bar-style">
        
    </head>
    <body>
        <div id="appe">
            <div class="content">
                <input type="hidden" value="15" id="pageid">
                <div class="banner">
                    <a href="###" onclick="towxapp()">
                        点击我跳转到微信小程序
                    </a>
                </div>
            </div>
        </div>
        <script>
            function isIosOrAndroid() {
                var u = navigator.userAgent;
                var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;
                if (isAndroid) {
                    return 1;
                }
                var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
                if (isiOS) {
                    return 2;
                }
                return 0;
            }
            function towxapp(){
                location.href = 'weixin://dl/business/?t=xx替换成自己的xx';
            }
            var system = isIosOrAndroid()
            if (system == 2) {
                location.href = 'weixin://dl/business/?t=xx替换成自己的xx';
            }
        </script>
    </body>
</html>

最后,把文件放到自己的web服务器上,用手机打开这个页面,就可以实现H5页面,跳转到微信小程序中!

相关推荐

快捷键大全截图(快捷键大全图片截图)
  • 快捷键大全截图(快捷键大全图片截图)
  • 快捷键大全截图(快捷键大全图片截图)
  • 快捷键大全截图(快捷键大全图片截图)
  • 快捷键大全截图(快捷键大全图片截图)
正版win7下载官网(正版win7旗舰版下载官网)

去gsdn官网选择相应的版本1.打开您的浏览器,访问官方下载页面:https://www.minecraft.net/zh-hans/2.点击“获取”按钮,在弹出的对话框中选择“对PC/Mac购买...

office2010软件(office2010软件下载)
office2010软件(office2010软件下载)

看你怎么激活了,正规渠道正版激活这个是最便宜的微软原装正版办公软件office2010中文学生家庭版1用户简包/COEM¥790.00这个是最贵的微软Office2010专业版中文版特含Publisher,Access两大组...

2026-01-02 21:55 liuian

电脑下边任务栏跑到左边怎么办

电脑桌面的菜单栏从底部跑到左边,想要复原的方法如下:1、鼠标右击“任务栏”空白处,在打开的菜单中点击“属性”2、在弹窗中,找到“屏幕上的任务位置”,在它的右侧点一下倒三角。3、点一下“确定”,接下来就...

win10关闭防火墙通知(win10关闭防火墙通知怎么关闭)

可以关闭防火墙win10提醒。因为win10自带的防火墙会有提醒功能,但有些用户会觉得这个提醒不必要,可以关闭。具体操作步骤是:右键点击Windows徽标,选择“Windows防火墙”,点击“高级设置...

微软公司介绍(微软公司介绍文案)

微软美国跨国科技公司微软(Microsoft)是一家美国跨国科技企业,1975年4月4日创立。2023财年营收2119.15亿美元,[200]公司总部设立在华盛顿州雷德蒙德(Redmond,邻近西雅图...

怎样设置电脑桌面密码(设置电脑桌面密码步骤)

首先,需要确定你是想设置电脑屏幕保护密码还是系统登录密码。如果是屏幕保护密码,可以在电脑设置中进行修改。打开控制面板,找到“个性化”或“外观和个性化”选项,再找到“屏幕保护器”选项,点击“设置”,在弹...

繁体字输入法下载(繁体字输入法下载安装)

你下载百度手机输入法,默认的就是双拼,可以自己选择26键拼音输入01打开苹果手机,找到苹果商城,02打开下载中心,搜索“搜狗输入法”,03下载搜狗输入法,04等下载完成后桌面上会显示搜狗输入法,05然...

国产操作系统概念股(国产操作系统概念股票)

  那么怎么构建该系统呢?一般情况下都是从以下几个方面:   第一、选股方法。虽然靠着均线能选股,靠着指标也能选股,但是系统性的选股方法则是要结合宏观经济整体运行位置和环境,行业发展现状和前...

电脑主机开机没反应(电脑主机开机没反应电源灯亮)

操作方法01第一种情况是电脑完全没有反应,那么就可能是电源没有连接上,检查插线板和机箱插头,重新插好就好了。?02还有是电脑机箱已经开启,但是显示屏还是黑的,那么这种情况就有可能是显示屏的电源没有连接...

cad激活码2010(cad激活码和序列号)

1.首先激活码出现问题,需要进行激活确认。首先需要的中进入电脑C盘。2.可以先点击组织设置隐藏文件夹显示。3.勾选显示隐藏文件夹。4.找到C:\ProgramData文件夹,打开找到CAD文件夹。5....

联想windows7笔记本怎么连接网络

检查笔记本的无线网卡驱动1.右键我的电脑,点击“属性”,选择左侧“设备管理器”2.点击“网络适配器”,如果方框内没有驱动,请下载驱动精灵万能网卡版安装网卡驱动 二、若发现驱动前面是感叹号的&...

iphone自动关机设置方法(iphone如何设自动关机)
  • iphone自动关机设置方法(iphone如何设自动关机)
  • iphone自动关机设置方法(iphone如何设自动关机)
  • iphone自动关机设置方法(iphone如何设自动关机)
  • iphone自动关机设置方法(iphone如何设自动关机)
淘宝电脑版网页入口(淘宝网电脑版网页官方)

网站地址:https://www.taobao.com/网站链接:进入网站服务器IP:116.253.191.241网站描述:淘宝网首页,淘宝网-亚洲最大、最安全的网上交易平台,提供各类服饰、美容...

大学生用哪个牌子的笔记本电脑好

荣耀MagicBook14英寸轻薄窄边框笔记本电脑(AMD锐龙58G512GFHDIPS正版Office)冰河银这款的性价比较高。也可以根据自己的预算选同系列其他型号。...