在微信小程序中如何实现短网址生成功能?

/ 0评 / 0

因为上一篇的表情包生成太占空间同时想起来了新浪的短网址所以今天把他集成到微信小程序里

<view>
<form bindsubmit="getUrl">
<input focus class="input" maxlength="300" name="url" placeholder="请输入要缩短的网址" type="text" value="{{url}}"></input>
<button bindtap="selectSite" class="button">类型:{{site}}</button>
<button class="button" formType="submit">一键生成</button>
</form>
<view class="result" hidden="{{!shortUrl}}">
<view class="showShortUrl">{{shortUrl}}</view>
<button bindtap="clear" class="result-button">清空</button>
<button bindtap="copy" class="result-button">复制</button>
</view>
</view><view class="adContainer">
<ad unit-id="adunit-db83411bc0a7051e" ad-intervals="30" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
</view>

请输入要缩短的网址因为部分网址在微信里报毒我们还不能直接使用,我们再把他作301跳转

Page({
data: {
siteList: [ "t.cn", "tinyurl.com" ],
url: "",
site: "t.cn",
shortUrl: ""
},
onLoad: function(t) {},
selectSite: function(t) {
var e = this;
wx.showActionSheet({
itemList: e.data.siteList,
success: function(t) {
var a = e.data.siteList[t.tapIndex];
e.setData({
site: a
});
}
});
},
getUrl: function(e) {
var a = this, s = e.detail.value.url, o = a.data.site;
s ? (s.match("http") || (s = "http://" + s), console.log(s), wx.request({
url: t + "/shortSite.php",
method: "POST",
data: {
site: o,
url: s
},
header: {
"content-type": "application/x-www-form-urlencoded"
},
success: function(t) {
t.data && !t.data.match("An error") ? (a.setData({
shortUrl: t.data
}), console.log(t)) : wx.showToast({
title: "凉凉,好像失败了",
icon: "none"
});
}
})) : wx.showToast({
title: "老哥,你还没输入网址咧",
icon: "none"
});
},
copy: function(t) {
var e = this;
wx.setClipboardData({
data: e.data.shortUrl,
success: function(t) {
wx.showToast({
title: "已复制",
icon: "none"
});
}
});
},
clear: function(t) {
this.setData({
url: "",
shortUrl: ""
});
},
onShareAppMessage: function(e) {
return {
title: "一个木函--短网址生成",
path: "/pages/tools/shortSite/shortSite",
imageUrl:"https://api.isoyu.com/ARU_GIF_S.php"
};
}
});

同时也集成的一键复制功能,有问题欢迎留言

评论已关闭。