前言
目前市场上的抖音小程序种类繁多,尽管许多小程序在功能上大同小异,但各自的实现细节和特色功能却各不相同,这就导致了难以通过一套通用的方法来实现所有小程序的开发工作。这种多样性意味着开发者在尝试不同的抖音小程序时,可能会遇到各种预料之外的问题或挑战。
例如,在接入抖音小程序以获取用户手机号的功能时,由于不同小程序可能采用不同的接口、权限设置或数据处理流程,开发者可能会踩到不少坑,从而增加了开发难度和复杂度。这些问题不仅耗费时间,还可能导致开发过程中的挫败感。
因此,分享这些经验教训显得尤为重要。它不仅能帮助其他开发者避免类似的错误,还能为那些正在前线努力工作的小伙伴们提供宝贵的指导和便捷的指引。通过这样的知识共享,希望大家可以共同学习和进步,减少不必要的弯路,提高工作效率。
前置条件
获取用户绑定的手机号。需要用户主动点击 button 组件后才能发起手机号的获取。
注意:此能力仅支持小程序通过试运营期后可用,默认获取权限,无需申请;
接入指南
1.主动点击button按钮
uniapp版本:
<button
type="default"
class="right right-text"
open-type="getPhoneNumber"
@getphonenumber="getphonenumber"
>
一键获取
</button>
const getphonenumber = async (e) => {
console.log(e.detail.errMsg);
console.log(e.detail.iv);
console.log(e.detail.encryptedData);
};
原生抖音小程序版本:
<button
open-type="getPhoneNumber"
bindgetphonenumber="getPhoneNumberHandler"
></button>
Page({
getPhoneNumberHandler(e) {
console.log(e.detail.errMsg);
console.log(e.detail.iv);
console.log(e.detail.encryptedData);
},
});
2.后端解密说明
上面按钮获取到的encryptedData是加密后的信息,我们需要把这个encryptedData传递给后端,让后端解析出手机号返给前端。后端在解密encryptedData时一般需要以下几个参数:
appid,secret, iv ,encryptedData ,session_key
如果对应的后端很懵,不知道该怎么接入,可把下面的文章发给后端看,在官方文档上,关于go,java ,php,python都有相应的代码示例
获取手机号(getPhoneNumber组件code换取手机号)_抖音开放平台
tips:注意,虽然我们web前端可以直接调用官方指南的接口强行解析手机号,但是建议不要那么做,sessionkey和encryptedData本质上都属于敏感信息,在web前端直接进行操作,有暴露的风险,严重会导致小程序被封禁。
3.获取session_key
这一步从某种程度来说还是后端的范畴,但是我们前端得知晓传递什么样的参数,后端才能调用code2Session解析出正确的session_key
后端参考:code2Session_抖音开放平台
code2Session请求体:
{
"appid": "tt5da*********7910",
"secret": "188506c64********55a31de40625ec7",
"code": "fb93de745*************eMuM8q4QQLeD",
"anonymous_code": "字符串"
}
appid不用多说,可以写死;
secret也是通过小程序后台获取的;
code通过tt.login获取到;
anonymous_code通过tt.login获取到
tt.login({ force: true, success(res) { console.log(`login 调用成功${res.code} ${res.anonymousCode}`); }, fail(res) { console.log(`login 调用失败`); }, });
总之四个参数都必须要传,而且用过一次就会失效。官方文档说的anonymous_code非必填就是个坑。
4.调用后端接口获取手机号
以uniapp为例
<template>
<view>
<button
type="default"
class="right right-text"
open-type="getPhoneNumber"
@getphonenumber="getphonenumber"
v-if="false"
>
一键获取
</button>
</view>
</template>
<script setup>
import { decryptMobile } from "@/api";
import { onLoad } from "@dcloudio/uni-app";
import { ref, reactive } from "vue";
const code = ref("");
const anonymousCode = ref("");
onLoad(() => {
tt.login({
force: true,
success(res) {
console.log(`login 调用成功${res.code} ${res.anonymousCode}`);
code.value = res.code;
anonymousCode.value = res.anonymousCode;
},
fail(res) {
console.log("login 调用失败");
},
});
});
const query = reactive({
mobile: "",
})
const getphonenumber = async (res) => {
const mobileInfo = await decryptMobile({
code: code.value,
anonymousCode: anonymousCode.value,
encryptedData: res.detail.encryptedData,
sessionKey: sessionInfo.data,
iv: res.detail.iv,
});
query.mobile = mobileInfo.data;
};
</script>
至此,我们关于抖音小程序的获取手机号的接入指南就圆满结束了,那么你学会了嘛~
测试联调方式
在我们与后端联调的过程中,难免会出现后端走不通的情况,但是又不知道是前端除了问题,还是后端除了问题,就会耽误开发进程。这一点官网提供了线上调式环境的功能。
如code2Session获取session_key,我们可以用下面这个调试台进行调试,如果我们前端的参数能调通,那么就说明我们前端没有问题,需要后端去进一步排查他们的代码。
获取手机号功能我们同样能调用正式环境去进行测试:
获取手机号(getPhoneNumber组件code换取手机号)_抖音开放平台
拓展
抖音小程序的试运营期是啥?
抖音小程序的试运营期是指新上线的小程序需要经过一定阶段的考核和优化,才能获得正式运营资格。根据搜索结果,以下是关于试运营期的具体信息:
1. 试运营期的时长与要求
试运营时长:抖音小程序的试运营期通常为7天。在此期间,小程序需要完成平台设定的任务(如提升活跃度、优化用户体验等),将初始评分从60分提升至80分,方可进入正式运营阶段。
评分机制:试运营期间,平台会根据小程序的运营表现(如内容质量、用户互动、合规性等)进行评分。完成任务可获得视频加热券等资源支持,加速评分提升。
2. 试运营期的核心目标
功能限制解除:试运营期间,小程序的部分功能可能受限(如流量推荐权重较低),需通过提升评分解锁更多权限。
流量与变现准备:试运营阶段也是商家积累用户、优化直播和短视频策略的关键期,为后续正式运营的流量变现奠定基础。
3. 与其他抖音业务的区别
需注意,抖音小程序的试运营期与抖店的“新手期”或“0元试运营”不同:
抖店新手期:抖店的新手期通常为14天,期间订单量受限(如每日上限1000单),需通过成单量、好评率等考核才能解除限制。
0元试运营:抖店的0元入驻试运营时长不固定,可能因商家类型、经营状况或平台政策调整而变化,一般在1个月左右。
4. 试运营期结束后的注意事项
合规运营:正式运营后需持续遵守平台规则,避免违规导致下架或处罚。
流量放大策略:可结合直播、短视频挂载小程序链接,利用平台流量工具(如“小雪花”)提升转化率
抖音小程序的试运营期是一个关键过渡阶段,商家需在7天内通过优化内容和运营策略提升评分,以解锁更多功能并实现流量变现。若涉及抖店等其他业务,需区分其对应的试运营规则。更多细节可参考抖音官方政策或相关运营指南
小程序获取手机号为什么要通过button触发?
小程序获取手机号必须通过 <button>
组件触发,而非通过 API 自动调用,这一设计主要基于以下几点原因:
1. 用户授权与隐私保护
微信、抖音等平台强制要求用户主动触发敏感权限的获取,确保用户对个人信息的授权是明确且知情的。手机号属于敏感信息,通过按钮点击触发可以避免开发者在小程序启动或隐藏逻辑中自动获取数据,保障用户隐私安全。
例如,当用户点击按钮时,平台会弹出授权弹窗,用户需明确同意后才能继续操作。这种机制符合《个人信息保护法》等法规要求。
2. 技术实现与接口限制
接口设计逻辑:微信、抖音等平台将获取手机号的接口与
<button>
组件的open-type="getPhoneNumber"
属性绑定。只有通过这种方式触发,才能通过bindgetphonenumber
回调事件获取加密数据(encryptedData
和iv
),进而解密手机号。防止滥用:若允许通过 API 自动调用,开发者可能在用户无感知的情况下频繁发起请求,增加服务器负担或引发恶意行为。通过按钮限制调用频率和场景,降低风险。
3. 平台规范与审核要求
小程序审核规则:平台要求涉及敏感信息的功能必须符合明确的交互流程。未通过按钮触发的手机号获取功能可能无法通过审核,甚至导致小程序下架。
权限分级:例如,抖音小程序在试运营期(通常为7天)内可能无法使用手机号获取功能,需通过试运营考核后才开放权限。按钮触发机制可帮助平台动态控制权限分配。
4. 技术实现依赖
加密数据关联性:通过按钮触发时,前端需先调用
wx.login或者tt.login
获取code
,再结合后端接口解密手机号。整个过程依赖用户点击时的实时session_key
,若通过自动调用可能导致session_key
过期,解密失败。前端与后端的协作:按钮触发后,需将
encryptedData
、iv
、session_key
传至后端解密(如使用 AES-128-CBC 算法),而这一流程需用户主动参与以确保数据有效性。