微信源码一键搬家
字节开发
开发流程:注册与认证->开发小程序->发布上线
支持的宿主:今日头条、今日头条极速版、抖音
小程序目录结构
.
├── app.js //小程序逻辑
├── app.json //小程序公共配置
├── app.ttss //小程序公共样式表
├── project.config.json //项目配置
└── pages
└── pageA
├── pageA.ttss //页面样式表
├── pageA.js //页面逻辑
├── pageA.json //页面配置
└── pageA.ttml //页面结构
小程序组件&api演示
开发中需要注意的地方
- 开发设置:配置域名白名单
- 微信小程序中有的组件、api等,在字节小程序中不支持(没有observers、cover-view、cover-image,echarts-for-weixin需要修改)
功能接入
分享
配置分享模板
开发者平台 -> 选择对应小程序 -> 设置 -> 分享设置 -> 添加新分享
小程序内接入转发
Page({
...
onShareAppMessage (option) {
// option.from === 'button'
return {
title: '这是要转发的小程序标题',
desc: '这是默认的转发文案,用户可以直接发送,也可以在发布器内修改',
path: '/pages/index/index?from=sharebuttonabc&otherkey=othervalue', // ?后面的参数会在转发页面打开时传入onLoad方法
imageUrl: 'https://e.com/e.png', // 支持本地或远程图片,默认是小程序icon
templateId: '这是开发者后台设置的分享素材模板id',
success () {
console.log('转发发布器已调起,并不意味着用户转发成功,微头条不提供这个时机的回调');
},
fail () {
console.log('转发发布器调起失败');
}
}
}
});
分享内容优先级
| 场景 | 优先级 |
|---|---|
| 端内分享 | 代码指定 > 模板指定 > 平台默认 |
| 端外分享 | 模板指定 > 平台默认 |
支付
开发者平台申请开通
- 小程序收银台
- 微信、支付宝API支付
前端接入
tt.pay({
orderInfo,
service: 1,//1收银台;3微信API;4支付宝API
},
success(res) {
if (res.code == 0) {
// 支付成功处理逻辑,只有res.code=0时,才表示支付成功
// 0:支付成功
// 1:支付超时
// 2:支付失败
// 3:支付关闭
// 9:订单状态未知
// 但是最终状态要以商户后端结果为准,前端可轮询商户服务端获取准确的微信支付/支付宝的订单状态
let count = 0
let timer = setTimeout(() => {
// 自行选择轮询次数
if (count > 3) {
clearTimeout(timer)
// 商户根据自身需求处理轮询完未成功的状态
return
}
// 商户前端根据 out_order_no 请求商户后端查询微信/支付宝支付订单状态
tt.request({
url: "<your-backend-url>",
success(res) {
// 商户后端查询到的微信/支付宝订单状态
},
fail(err) {
// 处理请求失败
}
});
count++
}, 500)
}
},
fail(res) {
// 调起收银台失败处理逻辑
},
});
虚拟物品在ios上不支持支付,支付金额不能超过1元
激励视频
仅支持抖音端
接入流程
开通流量主 → 创建广告位 → 获取广告位 ID → 嵌入代码 → 提交审核上线小程序
代码示例
var videoAd = tt.createRewardedVideoAd({
adUnitId: "g1u8fbou4kl18r87jo"
});
videoAd.onLoad(()=>{
console.log('广告组件成功拉取广告素材')
})
videoAd.onClose((res) => {
if (res.isEnded) {
// 给予奖励
}
});
//显示广告
videoAd.show()
自定义数据分析
代码示例
tt.reportAnalytics('index_show', {
});
验证埋点事件
注册设备 → 选择验证事件 → 验证埋点
让更多的人看到我们的小程序
流量入口
今日头条
抖音