QQ小程序开发者工具 v1.01.1809040 开发文档 [PC版]

QQ小程序怎么申请?

注册地址:https://q.qq.com/

QQ小程序入驻预约登记链接:

预约登记:https://docs.qq.com/form/fill/DQVB1UFFmWmNzZEdz#/fill

QQ小程序开发者文档

一、背景

QQ小程序是运行在手机QQ中的轻应用,采用兼容微信的方式来运作,除了少数几个组件和API跟微信稍微不同外,其他API和组件都兼容微信小程序。这样好处是极大减少了第三方开发轻应用的开发成本,编译一套轻应用包,同时可以在手Q和微信中运行。

二、开发、编译和运行

因为QQ小程序编译完全兼容微信小程序,所以开发部分用“微信web开发者工具”来开发,开发好后,修改源码的相关API为QQ小程序的API,然后通过QQ小程序开发者工具,发布到QQ轻应用管理平台,开发者可进行预览,进行相关审核后,就可以在手Q运行了。

三、QQ小程序组件和API

以下列出手Q小程序跟微信小程序不一样的组件和API(红色标注为不一样的部分),没有列出的组件和API表示跟微信小程序的一样。

3.1 wx.login(OBJECT)

调用接口wx.login() 获取临时登录凭证(AccessToken)。AccessToken为腾讯开发平台的AccessToken。

手Q登录授权请参考腾讯开放平台- OAuth2.0简介:

http://wiki.open.qq.com/wiki/website/OAuth2.0%E7%AE%80%E4%BB%8B

手Q小程序登录:

1) 根据AccessToken获取用户OpenID 方法:

http://wiki.open.qq.com/wiki/website/%E8%8E%B7%E5%8F%96%E7%94%A8%E6%88%B7OpenID_OAuth2.0

第三方后台获取openid例子(发送HTTP GET请求):

https://graph.qq.com/oauth2.0/me? access_token=******

2) 根据AccessToken、Appid和OpenID获取用户信息方法:

http://wiki.open.qq.com/wiki/website/get_user_info

第三方后台获取用户信息例子(发送HTTP GET请求):

https://graph.qq.com/user/get_user_info?access_token=******&oauth_consumer_key=12345&openid=******&format=json

Object参数说明:

参数 类型 必填 说明
timeout Number 超时时间,单位 ms
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

回调结果:

参数名 类型 说明
errMsg String 调用结果
code String AccessToken。开发者需要在开发者服务器后台调用 api,使用 AccessToken换取 openid 和用户相关等信息

示例代码:

//app.js

App({

onLaunch: function() {

wx.login({

success: function(res) {

if(res.code) {

console.log(‘登录成功!’ + res.errMsg)

} else {

console.log(‘登录失败!’ +res.errMsg)

}

}

});

}

})

3.2 wx.requestPayment(OBJECT)

发起手Q支付。prepayId参数为手Q财付通的tokenid(非微信)

Object参数说明:

参数 类型 必填 说明
prepayId String 调用手Q财付通后台接口生成的订单号
payType String 支付类型,定义如下:

 

 

 

 

 

“QQPay”: QQ钱包支付

payInfo String 支付扩展信息, Jason格式,详见payInfo定义
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)


手Q财付通生成的订单号接口定义:

https://qpay.qq.com/buss/wiki/38/1203

payInfo定义:

payInfo Jason格式:

{

“QQPayInfo”: {

“miniAppId”: “”, // 轻应用appid(可选)

“bargainor_id”: “”, // 商户号(可选)

“channel”: “”, // 渠道(可选), 值:”minApp” – 轻应用

}

}

回调结果:

回调类型 errMsg 说明
success requestPayment:ok 时间戳从1970年1月1日00:00:00至今的秒数,即当前的时间
fail requestPayment:fail cancel 用户取消支付
fail requestPayment:fail (detail message) 调用支付失败,其中 detail message 为后台返回的详细失败原因

示例代码:

wx.requestPayment({

‘timeStamp’: ”,

‘nonceStr’: ”,

‘package’: ”,

‘signType’: ‘MD5’,

‘paySign’: ”,

‘success’:function(res){

},

‘fail’:function(res){

}

})

3.3 wx.getSystemInfo(OBJECT)

获取系统信息。增加AppPlatform 字段来区分手Q和微信。

Object参数说明:

参数 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

回调结果:

参数 说明
brand 手机品牌
model 手机型号
pixelRatio 设备像素比
screenWidth 屏幕宽度
screenHeight 屏幕高度
windowWidth 可使用窗口宽度
windowHeight 可使用窗口高度
statusBarHeight 状态栏的高度
language 手Q设置的语言
version 手Q版本号
system 操作系统版本
platform 客户端平台
fontSizeSetting 用户字体大小设置。以“我-设置-通用-字体大小”中的设置为准,单位:px
SDKVersion 客户端基础库版本
AppPlatform 标识那个APP平台,值为“qq”: 标识是QQ平台的轻应用,新增加字段

示例代码:

wx.getSystemInfo({

success: function(res) {

console.log(res.model)

console.log(res.pixelRatio)

console.log(res.windowWidth)

console.log(res.windowHeight)

console.log(res.language)

console.log(res.version)

console.log(res.platform)

}

})

3.4 wx. getUserInfo (OBJECT)

获取用户信息,返回信息中只支持用户信息userInfo字段,其他字段(如:rawData等)不支持

Object参数说明:

参数 类型 必填 说明
timeout Number 超时时间,单位 ms
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

与微信实现不同的是目前仅返回基本用户信息userInfo,不包含openid 等敏感信息

参数 说明
userInfo 用户信息对象,不包含 openid 等敏感信息

userInfo参数说明:

参数 说明
nickName 用户信息对象,不包含 openid 等敏感信息
avatarUrl 用户头像Url
gender 用户的性别,值为1时是男性,值为2时是女性,值为0时是未知
city 用户所在城市
province 用户所在省份
country 用户所在国家

wx.getUserInfo({

success: function(res) {

console.log(res.userInfo)

}

})

四、QQ小程序已经实现API和组件

详情请参考:

https://docs.qq.com/sheet/BBrwmL2nAgtD39m7nw1ZZThw2eouap2IXN3m0IQmKC2Cjyb92Rffyt2cJFrx3ECuZS4zM0kg3

五、唤起QQ小程序指定页面能力

开发者需要在某些场景定向跳转到指定轻应用页面,可以使用一下链接完成:

mqqapi://microapp/open?mini_appid=xxxx&scene=xxxx&entry_path=xxxx

参数说明:

appid:填写需要跳转目标轻应用的appid

scene:场景值,1200(缺省的场景值 );1209(公众号自定义菜单 );1210(公众号模版消息);1211(公众号群发消息)

entry_path:指定轻应用页面路径(UrlEncode编码),如果跳转轻应用首页,该项目不填写,请删除“&entry_path=xxxx”

例子:目标轻应用页面路径:pages/specialtopic/specialtopic?topic_id=946&type=wf

step1:在最后一个路径后面加上.html,即pages/specialtopic/specialtopic.html?topic_id=946&type=wf

step2:进行UrlEncode编码,可以在网站:http://www.jsons.cn/urlencode/内完成

step3:得到最终有效的页面路径:pages%2Fspecialtopic%2Fspecialtopic.html%3Ftopic_id%3D946%26type%3Dwf

六、轻应用小程序一键关注QQ商户公众号组件使用说明

为更好地打通QQ平台的开发能力,协助开发者完成粉丝获取和沉淀的商业闭环,现提供一键关注公众号组件,开发者只需通过简单的配置,将轻应用appid和公众号id实现关联,引入相应的组件标签,即可在轻应用页面内展示关注组件。未关注的用户点击组件即可完成关注,简单便捷。

  • 轻应用页面引入说明:

在轻应用页面需要嵌入组件的位置引入以下代码:

  • 轻应用关联公众配置:

在轻应用管理系统进入【公众号关联】配置页,填写需要关联的公众号id(该参数的获取详见下图)和引导关注文案,提交即可。(灰度期间,需要提前提交appid至官方团队添加体验白名单)


原文链接:,转发请注明来源!

发表评论

要发表评论,您必须先登录