更新记录

1.0.0（2025-08-12）

1.0版本

平台兼容性

云端兼容性

阿里云 腾讯云 支付宝云
√ √ √

uni-app x(4.66)

Chrome Safari Android Android插件版本 iOS 鸿蒙 微信小程序
- - 5.0 1.0.0 - - -

xwq-player-video

仿抖音快手刷视频插件文档

插件说明

  • 插件使用原生播放器封装（非官方组件），暂只支持Android端
  • 自动管理播放缓存
  • 视频预加载
  • 数据分页加载
  • 进度条显示
  • 进度条支持拖拽调整进度
  • 持续更新。。。。。

扫码体验Android安装包效果

Android体验二维码

已测试机型

系统 机型 系统版本 测试情况
Android 红米K60 android15 运行丝滑

页面使用示例

<template>
    <view>
        <view class="video">
            <xwqPlayerSwiperVideo v-if="showVideo" ref="videoRef"
                :style="{width:'100%',height:`${systemInfo.windowHeight}`}" :list="listData" @loadNext="loadNext">
            </xwqPlayerSwiperVideo>
            <button class="btn-play" type="default" @click="play">播放</button>
            <button class="btn-pause" type="default" @click="pause">暂停</button>
        </view>
    </view>
</template>

<script setup>
    import xwqPlayerSwiperVideo from '@/uni_modules/xwq-player-video/components/xwq-player-video/xwq-player-video.uvue';
    // import { VideoType } from '@/uni_modules/xwq-player-video/utssdk/interface.uts';
    // import testData from './testData';

    const listData = ref([] as UTSJSONObject[]);
    const showVideo = ref(false);
    const systemInfo = uni.getSystemInfoSync();
    type RequestType = {
        pagesize : number,
        page : number
    }

    let params = {
        pagesize: 12,//必须是3的倍数
        page: 1
    } as RequestType;
    let finished = false;
    const videoRef = ref<XwqPlayerVideoComponentPublicInstance | null>(null);

    /**
     * 加载数据
     */
    const getVideoList = () => {
        if (uni.getStorageSync('videoList') != null && uni.getStorageSync('videoList') != '') {
            const cacheVideoList = (uni.getStorageSync('videoList') as UTSJSONObject[]);
            if (cacheVideoList.length > 15) {
                listData.value = cacheVideoList;
                showVideo.value = true;

                return
            }
        }

        const requestDb = uniCloud.importObject('videoList', { customUI: false });
        requestDb.getVideo(params).then((res : UTSJSONObject) => {
            if (res.code == 0) {
                let arr = res.detail as UTSJSONObject[];
                if (arr.length < params.pagesize) {
                    finished = true;
                }
                arr.forEach((i : UTSJSONObject) => {
                    i['isPlaying'] = false;
                })
                if (listData.value.length == 0) {
                    listData.value = arr;
                } else {
                    listData.value = listData.value.concat(arr);
                }
                uni.setStorage({
                    key: 'videoList',
                    data: listData.value
                })
                showVideo.value = true;
            }
        }).catch(err => {
            console.error(err)
            uni.showToast({
                title: '接口异常，请稍后再试!',
                icon: 'none'
            })
        })
    };

    getVideoList();

    /**
     * 请求下一页
     */
    const loadNext = () => {
        if (finished) return;
        ++params.page;
        getVideoList();
    }

    const play = () => {
        console.log('播放')
        videoRef.value?.play?.()
    }

    const pause = () => {
        console.log('暂停')
        videoRef.value?.pause?.()
    }
</script>

<style>

    .btn-play {
        position: absolute;
        left: 50px;
        top: 150px;
        color: #323030;
        width: 100px;
    }

    .btn-pause {
        position: absolute;
        left: 50px;
        top: 220px;
        color: #323030;
        width: 100px;
    }
</style>

接口数据格式

[{
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672b6be8e4ca03e4581a0063",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "测试 m3u8 切割",
    "loop": true,
    "duration": 29970,
    "playIng": false,
    "muted": false,
    "likeSum": 99,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672c903442a21686318cd4ad",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 9100,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672c911ebaea7915f45e1b09",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 14280,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672ca13b29d183956332a5b2",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 10940,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672ca15529d183956332a64b",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 9450,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672ca16b521a64050d97c506",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 7410,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "672ca1c529d183956332a975",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频仿抖音视频",
    "loop": true,
    "duration": 124200,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674aece6419454fa0e992cee",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "好声音就是你",
    "loop": true,
    "duration": 279310,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af6c15d90d1ce2792107a",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "快手美女视频…",
    "loop": true,
    "duration": 14630,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af6d63054e0861b3cf82c",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "快手美女(*´ω｀*)",
    "loop": true,
    "duration": 8750,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af6f99fd38e63368a289a",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女嗨嗨嗨~(¯▽¯~)",
    "loop": true,
    "duration": 15580,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af745419454fa0e9980f1",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 10640,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af7953476eeb8e2009b6f",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈💃",
    "loop": true,
    "duration": 19450,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af7abe0299d9e838863c0",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 11840,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af7bb3054e0861b3d0751",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 15240,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af819e0299d9e8388669e",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 11340,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af8dcd212f86ab76b805c",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 10680,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674af8ea3476eeb8e200bb0b",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美女色拉舞蹈",
    "loop": true,
    "duration": 10920,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "674afba6ab6b774a52266555",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "美丽三亚，大海美女！ \"气质美女 \"带你去看海 \"海边美女",
    "loop": true,
    "duration": 10710,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}, {
    "userId": "666dd802f366f40a8b9a4dd4",
    "avatar": "https://env-00jxgwsep3px.normal.cloudstatic.cn/snsPro/image/1744677303367.jpg",
    "nickname": "追风少年💓( ˘ ³˘)💋",
    "isfollow": false,
    "videoId": "682563535c390753ecb5b02a",
    "playurl": "https://cdn.exmple.com/test.mp4",
    "poster": "",
    "vduser": "追风少年💓( ˘ ³˘)💋",
    "vdtitle": "测试视频切片",
    "loop": true,
    "duration": 314790,
    "playIng": false,
    "muted": false,
    "likeSum": 0,
    "isLiked": false,
    "commemtSum": 0,
    "shareSum": 0,
    "isPlaying": false
}]

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

评论列表 撰写评论 向官方投诉
加载更多...