UNPKG

cckj-util

Version:

A common util lib for cj

154 lines (138 loc) 5.52 kB
# utils 前端公用工具库 ## 线上地址 ``` <script src="https://miandan.cjdropshipping.com/js-lib/utils.1.0.0.js"></script> ``` ## 测试地址 `https://miandan.cjdropshipping.com/js-lib/test.html` ## 上传视频 ``` /** * 创建上传实例 * 参数: * url //生成上传凭证地址 线上:https://tools.cjdropshipping.com/tool/downLoad/token * type //是否上传生成有水印的 1:有水印 3:无水印(后台未测通,现在不要用) * addFileSuccessFn //视频获取成功后回调 * onUploadProgress //上传中的进度回调 * success //视频上传成功后回调 * error //视频上传失败回调 * onUploadEnd //视频全部上传后回调 (不过好像给的uploadInfo拿不到,感觉没啥用QAQ) */ var uploader = cjUtils.createUploader({ url, type: 1, addFileSuccessFn: ({ uploadInfo }) => { console.log('视频添加成功 =>', uploadInfo) }, onUploadProgress: ({ uploadInfo, totalSize, progress }) => { console.log('上传进度 uploadInfo =>', uploadInfo, 'toalSize =>', totalSize, 'progress =>', progress) var progressPercent = Math.ceil(progress * 100); console.log('进度 =>', progressPercent) }, success: ({ uploadInfo }) => { console.log('上传成功 =>', uploadInfo) console.log('视频id =>', uploadInfo.videoId) }, error: ({ uploadInfo, code, message }) => { console.log("上传失败" + uploadInfo.file.name + ",code:" + code + ", message:" + message) }, onUploadEnd: ({ uploadInfo }) => { console.log("全部上传结束 =>", uploadInfo); } }) /** 添加视频 **/ uploader.addFile(file, null, null, null, '{"Vod":{}}') //file就是视频文件 /** 开始上传 **/ uploader.startUpload() ``` ## 播放视频(新) ``` /** * eleId: String //需要加载视频的容器id (request) * videoId: String //视频id (optional) 注:videoId和sourceUrl至少传一个,当两者都传入时,sourceUrl优先 * sourceUrl: String //视频链接(optional) * configuration: Object //配置项(optional) * width: String //视频宽度(optional: 240px) * height: String //视频高度(optional: 136px) * autoplay: Boolean //是否自动播放(optional: false) * isLive: Boolean //是否允许直播(optional: false) * rePlay: Boolean //播放器自动循环播放(optional: false) * playsinline: Boolean //H5是否内置播放,有的Android浏览器不起作用(optional: true) * preload: Boolean //封面,在autoplay为false时生效 注:在用videoId的时候,阿里好像会自动截取视频第一针做为封面,但是他的地址是http的,所有不要封面的话,给一个' '(optional: true) * cover: String //视频高度(optional: " ") * callback: Function //回调函数 返回一个player实例(optional: () => {}) * hasWater: Boolean //是否需要展示有水印视频(optional: true) **/ cjUtils.getVideoInfo({ eleId: 'J_prismPlayer', hasWater: false, videoId: '3f4388778807418993618e49278d81be', configuration: { width: '400px', heigth: '220px', }, callback: player => { player.on('ready', () => { console.log('视频加载完成后回调') }) player.on('ended', () => { console.log('视频播放完成后回调') }) } }) ``` ## 播放视频 ``` /** * eleId //需要加载视频的容器id * videoId //视频id * getPlayAuthUrl //获取播放凭证的接口地址 线上:https://tools.cjdropshipping.com/tool/downLoad/getVideoPlayAuth * playAuth //播放凭证 * sourceUrl //视频链接 * configuration //配置项 * callback //回调函数 **/ let player = cjUtils.AccessVideo({ eleId: 'J_prismPlayer', /** 有视频id,但没有播放凭证,需要获取播放凭证 **/ videoId: '48b0ca7138a04f24a5755d54bfded63e', getPlayAuthUrl: 'https://tools.cjdropshipping.com/tool/downLoad/getVideoPlayAuth', /** 有视频id,也有播放凭证**/ videoId: '48b0ca7138a04f24a5755d54bfded63e', playAuth: '123123123123', /** 有视频链接 **/ sourceUrl: 'https://cc-west-usa.oss-us-west-1.aliyuncs.com/15306336/338209605760.mp4', configuration: { width: '240px', //视频宽度 height: '136px', //视频高度 autoplay: false, //是否自动播放 isLive: false, //是否允许直播 rePlay: false, //播放器自动循环播放 playsinline: true, //H5是否内置播放,有的Android浏览器不起作用。 preload: true, //播放器自动加载,目前仅h5可用 cover: ' ' //封面,在autoplay为false时生效 注:在用videoId的时候,阿里好像会自动截取视频第一针做为封面,但是他的地址是http的,所有不要封面的话,给一个' ' }, callback: player => { console.log(player) player.on('ready', () => { //视频加载完成后回调 }); player.on('ended', () => { //视频播放完成后回调 }); } }) ``` # 获取聊天链接 ``` /** * @params {String} cookie 应该就是在cjdropshipping.com 下的所有cookie * @params {String} env ip环境,开发: dev, 测试: test, 线上: prod * @params {String} domain 引入聊天的域名地址,默认document.domain */ const chatURL = cjUtils.getChatUrl({ env: 'prod', cookie: document.cookie, domain: 'https://app.cjdropshipping.com/' })