booboom
booboom
  • 发布:2022-08-11 17:52
  • 更新:2023-11-08 10:24
  • 阅读:1403

【报Bug】抖音小程序onUploadDouyinVideo函数无法触发

分类:uni-app

产品分类: uniapp/小程序/字节跳动

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 12.5

第三方开发者工具版本号: 21.9.0

基础库版本号: 2.65.0

项目创建方式: CLI

CLI版本号: 2.0.1-35320220729001

示例代码:
<template>  
  <view class="content">  
    <button @click="chooseVideo">chooseVideo</button>  
    <button open-type="uploadDouyinVideo" id="1" data-hello="world">uploadDouyinVideo</button>  
  </view>  
</template>  
  
<script>  
let videoPath = ''  
  
export default {  
  data() {  
    return {  
      videoPath: '',  
    }  
  },  
  
  onLoad() {},  
  
  onUploadDouyinVideo: uploadOptions => {  
    console.log('onUploadDouyinVideoOptions: ', uploadOptions)  
  
    // 返回值(文档中称之为 uploadParams)将被当作发布参数传入视频发布器,发布视频  
    return {  
      videoPath,  
      stickersConfig: {  
        text: [  
          {  
            text: '这是文字贴图',  
            color: '#ffffff',  
            fontSize: 28,  
            scale: 1,  
            x: 0.5,  
            y: 0.5,  
          },  
        ],  
      },  
      success(callback) {  
        // 只有当发布成功且挂载成功时,success callback 才会有 videoId  
        console.log('success: ', callback)  
      },  
      fail(callback) {  
        console.log('fail: ', callback)  
      },  
      complete(callback) {  
        console.log('complete: ', callback)  
      },  
    }  
  },  
  
  methods: {  
    chooseVideo() {  
      tt.chooseVideo({  
        sourceType: ['album', 'camera'],  
        compressed: true,  
        success: res => {  
          this.videoPath = res.tempFilePath  
          videoPath = res.tempFilePath  
        },  
        fail: err => {  
          const errType = err.errMsg.includes('chooseVideo:fail cancel') ? '取消选择' : '选择失败'  
          tt.showModal({  
            title: errType,  
            content: err.errMsg,  
            showCancel: false,  
          })  
        },  
      })  
    },  
  },  
}  
</script>  
  
<style lang="scss">  
.content {  
  display: flex;  
  flex-direction: column;  
  align-items: center;  
  justify-content: center;  
}  
</style>

操作步骤:
  1. ‘script’中定义onUploadDouyinVideo
  2. ‘template’中<button open-type="uploadDouyinVideo" id="1" data-hello="world">uploadDouyinVideo</button>进行触发

预期结果:

onUploadDouyinVideo 方法被调用

实际结果:

onUploadDouyinVideo 方法未被调用

bug描述:

抖音小程序“发布抖音视频”功能无法触发“onUploadDouyinVideo 钩子”

该钩子必须在Page中定义,无法把原生小程序的代码变成小程序组件进行调用。

抖音小程序“发布抖音视频”文档

2022-08-11 17:52 负责人:无 分享
已邀请:
DCloud_UNI_WZF

DCloud_UNI_WZF

HBuilderX 3.6.0-alpha vue2 已支持抖音小程序 onUploadDouyinVideo

  • booboom (作者)

    点赞


    2022-09-02 15:41

DCloud_UNI_WZF

DCloud_UNI_WZF

你那边字节开发者工具(IDE 3.3.5 基础库2.65.0.5)开发可以吗,我这边试着也不行

  • booboom (作者)

    需要在安卓最新版本抖音真机下才行


    2022-08-12 12:25

DCloud_UNI_WZF

DCloud_UNI_WZF

目前暂未支持 onUploadDouyinVideo,可自行绑定该方法到页面实例,示例:

onReady(){  
	this.$mp.page.onUploadDouyinVideo = function(uploadOptions) {  
		console.log('onUploadDouyinVideoOptions: ', uploadOptions)  
	}  
}
  • booboom (作者)

    感谢,这样可以解决问题。


    2022-08-12 15:18

  • 小鲤鲤

    请问一下vue3有没有类似的写法


    2023-02-16 10:25

  • DCloud_UNI_WZF

    回复 小鲤鲤: vue3 同样支持,使用过程请注意安卓真机测试及抖音版本,如有问题可在该贴反馈


    2023-02-16 10:31

  • 小鲤鲤

    回复 DCloud_UNI_WZF: 好的谢谢。

    onReady(() => {

    const thisPage = getCurrentPages()[0]

    thisPage.onUploadDouyinVideo = (uploadOptions) => {

    console.log('onUploadDouyinVideoOptions: ', uploadOptions)

    return {

    videoPath: videoSrc.value,

    titleConfig: { title: '测试' },

    success(res) {

    console.log(res)

    },

    fail(err) {

    console.log(err)

    }

    }

    }

    })

    这种写法可以用


    2023-02-16 10:42

  • DCloud_UNI_WZF

    回复 小鲤鲤: onUploadDouyinVideo 和 onReady 同级这样写有问题是吗


    2023-02-16 10:48

  • 小鲤鲤

    回复 DCloud_UNI_WZF: 因为vue3没提供钩子函数,我要把这个onUploadDouyinVideo放到页面实例上


    2023-02-16 14:08

sun1998

sun1998

onReady(){
this.$mp.page.onUploadDouyinVideo = function(uploadOptions) {
console.log('onUploadDouyinVideoOptions: ', uploadOptions)
}
}请问这个是怎么解决问题的 没有看懂

  • DCloud_UNI_WZF

    把我贴的代码copy过去就可以啊,就是手动把该方法绑定到当前页面实例上


    2022-08-18 11:29

  • sun1998

    回复 DCloud_UNI_WZF: <template>

    <view class="content">

    <button @click="chooseVideo">chooseVideo</button>

    <button open-type="uploadDouyinVideo" id="1" data-hello="world">uploadDouyinVideo</button>

    </view>

    </template>


    <script>

    let videoPath = ''


    export default {

    data() {

    return {

    videoPath: '',

    }

    },

    onReady(){

    // console.log(this.$mp.page)

    this.$mp.page.onUploadDouyinVideo = function(uploadOptions) {

    console.log('onUploadDouyinVideoOptions: ', uploadOptions)

    }

    },

    onLoad() {},


    onUploadDouyinVideo: uploadOptions => {

    console.log('onUploadDouyinVideoOptions: ', uploadOptions)


     // 返回值(文档中称之为 uploadParams)将被当作发布参数传入视频发布器,发布视频    
    return {
    videoPath,
    stickersConfig: {
    text: [
    {
    text: '这是文字贴图',
    color: '#ffffff',
    fontSize: 28,
    scale: 1,
    x: 0.5,
    y: 0.5,
    },
    ],
    },
    success(callback) {
    // 只有当发布成功且挂载成功时,success callback 才会有 videoId
    console.log('success: ', callback)
    },
    fail(callback) {
    console.log('fail: ', callback)
    },
    complete(callback) {
    console.log('complete: ', callback)
    },
    }

    },


    methods: {

    chooseVideo() {

    tt.chooseVideo({

    sourceType: ['album', 'camera'],

    compressed: true,

    success: res => {

    this.videoPath = res.tempFilePath

    videoPath = res.tempFilePath

    console.log(this.videoPath)

    },

    fail: err => {

    const errType = err.errMsg.includes('chooseVideo:fail cancel') ? '取消选择' : '选择失败'

    tt.showModal({

    title: errType,

    content: err.errMsg,

    showCancel: false,

    })

    },

    })

    },

    },

    }

    </script>


    <style lang="scss">

    .content {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    }

    </style>

    真机调试第二个按钮不反应 控制台什么也不打印


    2022-08-18 11:34

  • DCloud_UNI_WZF

    回复 sun1998: 上传测试工程


    2022-08-18 11:39

  • sun1998

    回复 DCloud_UNI_WZF: 真机调试里不生效吗


    2022-08-18 11:45

  • DCloud_UNI_WZF

    回复 sun1998: 看上面的记录,安卓真机,最新版抖音,测试可以的


    2022-08-18 11:49

  • sun1998

    回复 DCloud_UNI_WZF: OK 我试试 thanks


    2022-08-18 12:10

  • 语文数学天才

    回复 DCloud_UNI_WZF: vue3不支持 onUploadDouyinVideo


    2023-02-12 16:52

语文数学天才

语文数学天才 - 做最顺手的nvue组件库与工具集

@DCloud_UNI_WZF vue3下没有开放 onUploadDouyinVideo 钩子。

  • DCloud_UNI_WZF

    没提供是指 composition api 时的导入吗,button open-type 对应钩子仅支持 options api


    2023-02-16 14:49

  • 语文数学天才

    回复 DCloud_UNI_WZF: import {onLoad, onShareAppMessage} from '@dcloudio/uni-app' 像这样。


    2023-02-28 17:41

7***@qq.com

7***@qq.com

现在安卓真机调试可以,那么上线之后ios也支持使用这个吗?

要回复问题请先登录注册