小程序怎么檢測從微信復制的內容

前言

這倆天在實現一個功能從微信復制的連接，當打開小程序時可以直接檢測內容并且進行粘貼。

實現功能

• 檢測微信復制的內容。
• 正則匹配需要的內容。

一、小程序實現剪切板功能

實現效果如下

打開微信文檔可以看到給提供的倆個接口，一個為設置系統剪貼板的內容，一個為獲取系統剪貼板的內容

那么本文將會給大家介紹的就是獲取系統剪切板的內容，接口為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) {
       },
    })
  },