小程序怎么检测从微信复制的内容

小编给大家分享一下小程序怎么检测从微信复制的内容,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

网站设计、成都网站设计过程中,需要针对客户的行业特点、产品特性、目标受众和市场情况进行定位分析,以确定网站的风格、色彩、版式、交互等方面的设计方向。创新互联还需要根据客户的需求进行功能模块的开发和设计,包括内容管理、前台展示、用户权限管理、数据统计和安全保护等功能。


前言

这俩天在实现一个功能从微信复制的连接,当打开小程序时可以直接检测内容并且进行粘贴。

实现功能

  • 检测微信复制的内容。
  • 正则匹配需要的内容。

一、小程序实现剪切板功能

实现效果如下

小程序怎么检测从微信复制的内容
实现效果

打开微信文档可以看到给提供的俩个接口,一个为设置系统剪贴板的内容,一个为获取系统剪贴板的内容

小程序怎么检测从微信复制的内容
文档提供的接口

那么本文将会给大家介绍的就是获取系统剪切板的内容,接口为wx.getClipboardData

先根据文档来熟悉一下此接口的使用规则。

小程序怎么检测从微信复制的内容
接口使用规则

以上就是关于剪切板的使用规则,并且在文档中也给提供了使用方法,知道了这些内容就可以来到自己的项目进行验证了。

此处的过程只是为了给新接触小程序的伙伴一些开发经验。

wx.getClipboardData({
 success (res){
   console.log(res.data)
 }
})

二、代码实现

下图就是非常简单的一个实现,可以看到复制的数据被直接打印在了控制台。

小程序怎么检测从微信复制的内容
代码实现

那么接下来要做的事情就是将复制过来的内容进行正则匹配,匹配出我们只需要的内容。

以下js代码在utils目录下新建一个文件即可。

小程序怎么检测从微信复制的内容
正则代码
var t = {};

t.handleUrl = function(t){
   var e = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g;
   return !!(t = t.match(e)) && t[0];
}, module.exports = t;

然后在需要引入的地方进行引入文件即可使用。

小程序怎么检测从微信复制的内容
引入文件

调用正则匹配需要的数据,返回的值就是匹配完成的结果。

小程序怎么检测从微信复制的内容
返回的结果

第二步做的处理就是当检测剪切板的内容跟设置后的值一致时不再弹框。

弹框的代码就是showModel这个接口,可以自行查看文档哈!

完整代码如下。

  onShow: function (res){
   let that = this;
   wx.getClipboardData({
     success: function (res){
       // 匹配地址
       let result = util.handleUrl(res.data);
       // 如果地址相同则不在显示
       if(result == that.data.prase_address){
         return;
       }
       wx.showModal({
         title: '检测到视频链接,是否粘贴?',
         content: result,
         showCancel: true,//是否显示取消按钮
         cancelText: "取消",//默认是“取消”
         cancelColor: '#ff9900',//取消文字的颜色
         confirmText: "粘贴",//默认是“确定”
         confirmColor: '#ff9900',//确定文字的颜色
         success: function (res){
           if (res.cancel) {
           } else {
             that.setData({
               prase_address: result,
             })
           }
         },
       })
     },
     fail: function (res){ },
     complete: function (res){
      },
   })
 },

以上是“小程序怎么检测从微信复制的内容”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


文章名称:小程序怎么检测从微信复制的内容
URL标题:http://azwzsj.com/article/pdopcc.html