短视频去水印？竟如此简单
话不多说，先上截图
也可扫码查看
这里还要额外说明一下，本人也是小白一个，大佬可以绕道而行，所给代码也只是相应的界面和简单的逻辑，并未给出去水印的接口及图片等内容，仅供参考学习，里面不足的内容欢迎评论指出。
下面上代码
wxml
<!--index.wxml-->
<image src="../../static/picture.png" class="topImage"></image>
<view class="page">
<!-- 提示用户是否是vip用户，或还有多少次使用次数 -->
<!-- <van-notice-bar text="您当前为{{vip?"vip":"普通"}}用户，可用次数：{{vip?"不限":count}}"/> -->
<view class="tip">
您当前为{{vip?"vip":"普通"}}用户，可用次数：{{vip?"不限":count}}
<text wx:if="{{!vip}}" class="toVip">\nvip用户有无限次数，可前往领会员页面</text>
</view>
<!-- 用户输入链接 -->
<view class="title">
<input class="input" placeholder="输入短视频分享链接" value="{{input}}" bindinput="inputEdit"></input>
<van-button class="button" type="primary" bindtap="onStart">解析</van-button>
<van-button class="button" type="warning" bindtap="onClear">清空</van-button>
</view>
<!-- 解析的是视频 -->
<view class="video" wx:if="{{src}}">
<video src="{{src}}"></video>
<view class="control">
<button class="copyCover videoButton" bindtap="onCopy" data-link="{{linkContent.cover}}">复制封面链接</button>
<button class="copyPlay videoButton" bindtap="onCopy" data-link="{{linkContent.playAddr}}">复制视频链接</button>
<button class="saveCover videoButton" bindtap="onSaveCover" data-link="{{linkContent.cover}}">保存封面</button>
<button class="savePlay videoButton" bindtap="onSavePlay" data-link="{{linkContent.playAddr}}">保存视频</button>
</view>
</view>
<!-- 解析的是图片 -->
<view class="Picture" wx:if="{{pics}}">
<view class="picture" wx:for="{{pics}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<image src="{{item}}" class="image" bindtap="onPreview" data-link="{{item}}"></image>
</view>
</view>
<!-- <button bindtap="onStart">解析</button> -->
</view>
js
注意：app.globalData.serverIp为在app.js声明的全局变量，为服务器地址
const app = getApp()
Page({
data: {
src: "", //视频地址
linkContent: "", //所有链接地址
input: "", //用户输入内容
vip: 0, //检测用户是否使vip
count: 10 //可解析次数
},
//实时获取输入的内容
inputEdit: function (e) {
var value = e.detail.value;
//console.log(value)
this.setData({
input: value
});
},
//点击清空按钮
onClear: function () {
this.setData({
input: ""
})
},
//获取会员信息函数
getInfo: function () {
var that = this;
wx.showLoading({
title: '正在加载',
})
// 获取会员信息
wx.login({
success: res => {
//console.log(res.code);
var code = res.code;
// 发送 res.code 到后台换取 openId, sessionKey, unionId
app.globalData.code = code
// console.log(app.globalData.code)
wx.request({
url: app.globalData.serverIp + '/mini/getInfo?code=' + code,
success: function (res) {
// console.log(res)
wx.hideLoading()
//用户为vip用户，有无限次数
if (res.data == 'vip') {
app.globalData.vip = 1;
that.setData({
vip: 1,
count: -1
})
//保存为缓存数据
wx.setStorage({
key: "info",
data: {
vip: 1,
count: -1
}
})
}
//用户为非vip用户，有十次
else {
app.globalData.vip = 0;
that.setData({
vip: 0,
count: 10
})
//保存为缓存数据
wx.setStorage({
key: "info",
data: {
vip: 0,
count: 10
}
})
}
}
})
}
})
},
onLoad: function () {
var that = this;
//获取记录会员的缓存信息，若果获取到则不做处理，如果未获取到，则向服务器发起请求
wx.getStorage({
key: 'info',
success(res) {
// console.log(res.data)
that.setData({
vip: res.data.vip,
count: res.data.count
})
app.globalData.vip = res.data.vip
// console.log(res.data.vip)
},
fail: function (err) {
console.log(err)
that.getInfo();
}
})
this.copyContent();
},
//检测剪切板
copyContent: function () {
var that=this;
//检测用户剪切板是否有链接
wx.getClipboardData({
success: function (res) {
// console.log(res.data)
var link = res.data;
if (res.data.indexOf("http") != -1) {
wx.showModal({
title: '提示',
content: '检测到您已复制链接，是否粘贴并解析?',
success: function (res) {
if (res.confirm) {
// console.log('用户点击确定')
that.setData({
input: link
})
that.onStart();
} else if (res.cancel) {
// console.log('用户点击取消')
}
}
})
}
}
})
},
//点击解析
onStart: function (e) {
var that = this;
//判断是否输入了内容
if (that.data.input) {
//判断用户是否是vip，或者普通用户还有可用次数
if (that.data.vip || that.data.count > 0) {
wx.showLoading({
title: '正在解析',
})
//调用去水印接口
wx.request({
url: 'https://example.com/', //这里为去水印的接口
method: 'POST',
data: {
"link": that.data.input
},
success: res => {
wx.hideLoading()
//console.log(res)
if (res.data.code == "0001") {
wx.showToast({
title: '解析成功',
})
//如果是普通用户，则可用次数减一
if (that.data.vip == 0) {
wx.setStorage({
key: "info",
data: {
vip: 0,
count: that.data.count - 1
}
})
that.setData({
vip: 0,
count: that.data.count - 1
})
}
//判断是图片还是视频
if (res.data.data.pics) {
that.setData({
pics: res.data.data.pics
})
} else {
that.setData({
src: res.data.data.playAddr, //视频地址
linkContent: res.data.data, //相关链接地址
})
}
} else {
wx.showToast({
title: '解析失败',
icon: 'none'
})
}
},
fail: () => { },
complete: () => { }
})
} else {
wx.showToast({
title: '您的可用次数不足，请前往领取会员',
icon: "none"
})
}
} else {
wx.showToast({
title: '请输入内容',
icon: 'none'
})
}
},
//复制链接
onCopy: function (e) {
//console.log(e.currentTarget.dataset.link);
wx.setClipboardData({
data: e.currentTarget.dataset.link,
success(res) {
//console.log(res)
wx.showToast({
title: '链接已复制',
})
}
})
},
//点击查看图片
onPreview: function (e) {
// console.log(e.currentTarget.dataset.link)
wx.previewImage({
current: e.currentTarget.dataset.link, // 当前显示图片的http链接
urls: this.data.pics // 需要预览的图片http链接列表
})
},
//保存封面
onSaveCover: function (e) {
var that = this;
wx.showLoading({
title: '正在保存',
})
var link = e.currentTarget.dataset.link;
console.log(link);
wx.downloadFile({
url: link, //仅为示例，并非真实的资源
success(res) {
// console.log(res);
wx.hideLoading();
// 只要服务器有响应数据，就会把响应内容写入文件并进入 success 回调，业务需要自行判断是否下载到了想要的内容
if (res.statusCode === 200) {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
// console.log(res);
wx.showToast({
title: '已成功保存到相册',
})
}
})
} else {
wx.showToast({
title: '保存失败',
icon: 'none'
})
}
}
})
},
//保存视频
onSavePlay: function (e) {
var that = this;
wx.showLoading({
title: '正在保存',
})
var link = e.currentTarget.dataset.link;
// console.log(link);
wx.downloadFile({
url: link, //仅为示例，并非真实的资源
success(res) {
// console.log(res);
wx.hideLoading();
// 只要服务器有响应数据，就会把响应内容写入文件并进入 success 回调，业务需要自行判断是否下载到了想要的内容
if (res.statusCode === 200) {
wx.saveVideoToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
console.log(res);
wx.showToast({
title: '已成功保存到相册',
})
}
})
} else {
wx.showToast({
title: '保存失败',
icon: 'none'
})
}
}
})
},
onShow: function () {
var that=this;
//每次显示检测用户的会员信息情况
wx.getStorage({
key: 'info',
success(res) {
// console.log(res.data)
that.setData({
vip: res.data.vip,
count: res.data.count
})
// console.log(res.data.vip)
},
fail: function (err) {
}
})
},
})
wxss
page{
width: 750rpx;
background-color: #f3f4f5;
}
.topImage{
width: 750rpx;
height: 300rpx;
}
.page{
width: 710rpx;
margin: 0 auto;
}
.tip{
width: 670rpx;
background-color: white;
border: 1rpx solid white;
padding: 20rpx;
border-radius: 20rpx;
margin-top: 20rpx;
}
.toVip{
color: red;
}
.title{
width: 100%;
height: 150rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
.input{
background-color: white;
width: 400rpx;
height: 80rpx;
padding: 10rpx;
}
.button{
border-radius: 20rpx;
}
.video{
width: 100%;
margin-top: 0rpx;
}
video{
width: 100%;
}
.control{
width: 100%;
margin-top: 20rpx;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.videoButton{
width: 330rpx;
border-radius: 40rpx;
border: 1rpx solid ;
margin-bottom:20rpx;
color: white;
}
.copyCover{
background: gold;
}
.copyPlay{
background-color: greenyellow;
}
.saveCover{
background-color: #2bcadf;
}
.savePlay{
background-color: rgb(25, 162, 226);
}
.Picture{
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.picture{
width: 340rpx;
height: 500rpx;
margin-bottom: 20rpx;
}
.image{
width: 100%;
height: 100%;
border-radius: 40rpx;
}