0530-3433334

网站建设 APP开发 小程序

知识

分享你我感悟

您当前位置>首页 >> 知识 >> 小程序

腾讯官方将浏览器(搜索直达)微信小程序打通

发表时间:2023-12-06 15:08:16

文章来源:炫佑科技

浏览次数:146

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

腾讯官方将浏览器(搜索直达)微信小程序打通

12月5日,浏览器小程序宣布与微信小程序对接。 浏览器版现已推出小程序。 在搜索场景中,小程序嵌入到浏览器的“搜索直达”中,作为直接的内容载体。 用户在搜索框中输入关键词后,相关小程序会优先出现在关键词智能推荐列表中,并直接展示相关内容。 墨迹天气、腾讯翻译等小程序已成功入驻。

另外,浏览器小程序兼容微信小程序。 据称,开发“只需三步”即可完成适配工作,将微信小程序移植到浏览器上运行。

我们知道,节目也首次经历了整个改编过程。 接下来,我们将一一解释细节和关注点。 值得一提的是,腾讯官方将浏览器()小程序称为QB小程序。 每个人听到这个名字都会有一种奇怪的感觉。

安装并注册QB小程序调试工具

在正式开始调试之前,我们需要提醒您以下三点:

目前开发工具仅支持; 小程序的官方名称、图标和简介是用户可见的,填写后无法修改,必须认真填写; 它对于设备来说是唯一的,并且将为每部手机生成。

目前QB小程序的调试页面和介绍页面还很简陋,还没有相关的PC端开发工具。 因此,开发还是需要在微信开发工具上完成小程序的开发,然后适配QB小程序。

1.使用微信扫描二维码进入QB小程序调试页面。

扫描二维码后,页面可能会提示“调试内核版本太旧”。 您需要按照提示,长按识别页面上的二维码,下载并安装*新版本的调试内核。 安装完成后,再次扫描上方二维码即可进入。

2、进入调试页面后,需要先完成“注册”。 在注册页面:

同时需要将其添加到微信小程序的app.json配置文件中,如下所示:

{
  "window": {
    "navigationBarBackgroundColor": "#FFF",
     "navigationBarTitleText": "知晓课堂",
     "navigationBarTextStyle": "black",
    "qbDebugKey": ["495f18a64485eeac5e78ccbxxx", "7e2f29d50e78411b3915128exxx"]
  },
}

注意:只有在app.json中配置并生成了测试机,测试机才可以使用浏览器小程序调试工具来调试小程序。 一部手机对应一部。

3、如果您已完成注册或其他开发为您添加了开发权限,请进入对应的小程序,点击“登录”按钮进入开发管理后台页面。

在此页面,您可以点击“开发权限管理”添加其他开发设备。 您需要输入要添加的设备的名称和昵称。 添加成功后,新设备即可使用此登录。

安装浏览器的调试版本

点击“启动QB打开小程序”按钮。 如果浏览器的debug版本尚未下载,此步骤将下载浏览器的debug版本。

如果您的手机上未安装浏览器或安装的版本不是正确的调试版本,点击后会提示“请先下载浏览器的调试版本”。 按照提示再次点击按钮即可开始下载安装; 安装完成后,返回此页面。 点击页面上的启动按钮,启动浏览器,启动需要调试的小程序。

调试兼容性

完成以上两步后,我们接下来需要调试兼容性,直到小程序可以运行。 这里我们主要关注QB小程序和微信小程序的几个区别:

这里主要适配参考QB小程序适配文档。 您可以小程序的相关开发文档。

提交预览并在浏览器中打开

兼容性问题解决后,您可以在浏览器中预览小程序。

1、首先点击QB小程序调试工具中的“微信扫码”按钮,扫描微信开发工具中预览生成的二维码。 此时,您将进入微信环境中的小程序。 首先,单击右上角的点退出。 小程序,返回QB小程序调试工具。

2.然后点击“启动QB打开小程序”按钮。 浏览器debug版安装完成后,会自动跳转到浏览器小程序环境,进入后即可看到效果。

▲ 浏览器预览效果

3.预览OK后,可以上传试用版,输入版本号。 上传成功后,会返回一个URL。 将此网址复制到浏览器中打开小程序。

4.关于共享问题。 浏览器小程序可以分享到微信朋友圈、微信好友、好友、小程序。 与微信小程序分享不同,浏览器小程序分享是创建一张分享海报,其中包含浏览器小程序二维码。 在安卓手机中腾讯官方将浏览器(搜索直达)微信小程序打通,长按识别即可自动打开小程序。

提交审核并上线

试用版测试无问题后,点击QB小程序调试工具中的“包状态管理”即可进入提交包的历史列表,点击需要审核的版本即可提交审核。

一旦获得批准微信小程序开发工具哪个好,就可以在网上发布。

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等

相关案例查看更多