uni-app Vue3编译模式下getUserProfile在头条小程序无法使用

uni-app Vue3编译模式下getUserProfile在头条小程序无法使用

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

示例代码:

<template>  
    <view class="uni-container">  
        <button type="default" @click="getInfo">获取用户信息</button>  
    </view>  
</template>  
<script>  
    export default {  
        methods: {  
            getInfo(){  
                tt.getUserProfile({  
                      success(res) {  
                        console.log(`getUserProfile 调用成功`, res);  
                      },  
                      fail(err) {  
                        console.log(`getUserProfile 调用失败`, err);  
                      },  
                    });  
            }  
        }  
    }  
</script>

操作步骤:

直接使用hbuilder的官方uni-app项目模板即可; 相关代码使用vue2版本编译正常,但是vue3版本编译无法唤起授权

预期结果:

正常唤起用户信息授权

实际结果:

vue3版本下无法唤起用户信息授权,按照报错信息看,怀疑是vue3编译后的方法调用中含有异步操作

bug描述:

调用getUserProfile这个api时,vue3版本编译模式下会报错,{errMsg: "getUserProfile:fail must be invoked by user tap gesture",errNo: 21500};直接切换回vue2编译就是正常唤起授权的;

相关链接:

3 回复

后续会优化 ,已加分,感谢您的反馈!


uni-app 的 Vue3 编译模式下,getUserProfile 接口在头条小程序(字节跳动小程序)中无法使用,可能是由于以下原因:

1. 头条小程序不支持 getUserProfile 接口

  • getUserProfile 是微信小程序特有的接口,用于获取用户信息。头条小程序(字节跳动小程序)可能没有完全实现这个接口,或者使用了不同的接口来获取用户信息。
  • 头条小程序可能有自己的用户信息获取接口,例如 tt.getUserInfo

2. 平台差异

  • uni-app 虽然支持多端编译,但不同平台的小程序 API 实现可能存在差异。getUserProfile 在微信小程序中可用,但在头条小程序中可能不可用。
  • 你需要根据平台的不同,使用对应的 API。

3. 解决方案

  • 检查头条小程序的 API 文档:查看头条小程序的官方文档,确认是否有类似的接口来获取用户信息。

  • 使用条件编译:在 uni-app 中,你可以使用条件编译来针对不同平台编写不同的代码。例如:

    // #ifdef MP-WEIXIN
    wx.getUserProfile({
      desc: '获取用户信息',
      success(res) {
        console.log(res.userInfo);
      }
    });
    // #endif
    
    // #ifdef MP-TOUTIAO
    tt.getUserInfo({
      success(res) {
        console.log(res.userInfo);
      }
    });
    // #endif
  • 使用 uni.getUserInfouni-app 提供了跨平台的 uni.getUserInfo 方法,可以在不同平台上使用。但需要注意,不同平台的实现可能有所不同。

    uni.getUserInfo({
      success(res) {
        console.log(res.userInfo);
      }
    });
回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!