程序员如何做一个简单的去水印小程序
首先看成品:
做这个去水印的小程序之前也研究过,如何去水印,有的是用python去抓取原视频,这方面的我目前还不会这个python语言,因为去水印他不是简单的去一个平台的水印,他有几十个平台,所以这个方法对我消耗也比较大。我自己也没有这个精力去做这个东西, 我就想着应该有这方面的第三方接口,我自己在网上找了几天也没找到,之后掘金的一个哥哥,给我提供了一个网站,他上面的接口是要钱的,但是还算便宜,之后就想着用这个平台的,这个是网站(watermarkuser.hlytools.top/#/dashboard…
有便宜的,价格也不算很贵。
自己搭建的话,可能的会点小程序方面的知识。
流程主要是:申请小程序(个人的30 企业的300) 小程序备案 开发小程序 上线小程序
大概的流程就是这样 我这边就不说其他细节的东西了,直接提供代码,其他的自己百度百度。 页面代码
<view class="content">
<uni-easyinput errorMessage v-model="url" focus placeholder="请输入视频的页面网址/分享内容"></uni-easyinput>
<view class="butList">
<button class="mini-btn" type="default" size="mini" @click="getClipboard">粘贴</button>
<button class="mini-btn" style="color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19" type="primary"
@click="submit" size="mini">发送</button>
</view>
<view v-if="data" class="">
<view class="">
<x-video ref="videoPlayer" :autoplay='false' :src="data.videoSrc" :progress="progress" />
</view>
<view class="butList">
<button class="mini-btn" type="default" size="mini" @click="copyTextToClipboard">复制视频链接</button>
<button class="mini-btn" style="color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19"
type="primary" @click="downVideo" size="mini">下载视频</button>
</view>
</view>
<button class="mini-btn butBoom" type="primary" open-type='contact' size="mini">联系客服</button>
<!-- 解析视频的时候 -->
<zero-loading v-if="analysis" :mask='true' :maskOpacity='0.1'></zero-loading>
<!-- 下载视频的时候 -->
<zero-loading v-if="downShow" :mask='true' type='surround' :maskOpacity='0.1'></zero-loading>
</view>
<script>
export default {
data() {
return {
analysis: false,
downShow: false,
url: '',
data: '',
progress: 0
}
},
onLoad() {},
onShareAppMessage(res) {
return {
title: '小创去水印',
path: 'pages/index/index',
imageUrl: '../../static/logo.png',
}
},
//2.分享到朋友圈
onShareTimeline(res) {
return {
title: '小创去水印',
path: 'pages/index/index',
imageUrl: '../../static/logo.png',
}
},
methods: {
async submit() {
this.analysis = true
let res = await this.$http.removeWatermark({
appid: '66d56c3d3ae6b2022B8XT',
link: this.url
})
if (res.code == 1) {
this.data = res.data
} else {
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
}
this.analysis = false
},
downVideo() {
var that = this
that.downShow = true
uni.downloadFile({
url: that.data.videoSrc,
success: function(res) {
console.log(res,'【【【【【【【【【')
uni.saveVideoToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
that.downShow = false
setTimeout(() => {
uni.showToast({
title: "保存成功",
icon: "success"
})
})
},
fail: (err) => {
that.downShow = false
uni.showToast({
title: "保存失败",
icon: "error"
})
}
})
}
})
},
// 获取剪贴板
getClipboard() {
var that = this
uni.getClipboardData({
success: function(res) {
that.url = res.data
uni.showToast({
title: '粘贴成功',
icon: 'success',
duration: 600
});
}
});
},
// 复制文本到剪贴板
copyTextToClipboard() {
uni.setClipboardData({
data: this.data.videoSrc,
success: function() {
uni.showToast({
title: '复制成功',
icon: 'success',
duration: 600
});
},
fail: function() {}
});
}
}
}
</script>
代码我就不解释了。页面就是这个样子的,我个人喜欢简约一点的,大家有啥更好的建议或者意见我一定虚心接受。