js复制到剪切板功能遇到的问题

前几天有个这个需要，h5页面点击一个按钮，能够把当前的url分享出去，于是我就直接写了这样一个方法

export const copyText = (text: string) => {
  navigator.clipboard.writeText(text).then(
    () => {
      showToast('已复制')
    },
    () => {
      showToast('复制失败')
    }
  )
}


//使用

copyText(window.location.href)

在电脑浏览器上,点击然后去粘贴一点问题都没有，但是。。。。，问题就出现，把链接复制到微信上面，通过微信打开浏览器页面浏览，在点击分享，就会出现这个链接

https://weixin110.qq.com/cgi-bin/mmspamsupport-bin/newredirectconfirmcgi?click=a1805d92426903fc57b2dda9769020e0&bankey=b6efb5392f42d9f108b90668e2c2337b&midpagecode=67377a2adb44e17c1b0adb24b5cf2bd10ec2c288571a57774bb1ed8fc5df16fd87df42d0b7e5dfc22d1e043298b5c3b37bd3209a672a7052a8b13f117b28bcb5adbbcf912230112e4b1ed383d7382085&bancode=49f3c07ffc2c8d4174c452aa798efdebc63305de27d9454cc2a83635848fe9eb88a37e4e4ceebcf6a1270cf5d6362bf4#wechat_redirect

这是咋回事呢？

原因：

在微信中打开H5页面时，微信会对链接进行重定向和处理，以确保安全性和防止恶意链接。这就是为什么你使用 window.location.href 获取到的是一个微信的重定向链接，而不是你期望的H5页面的URL。

微信为何会对链接进行重定向？

原因可能会有以下几点

1. 安全性：微信会对外部链接进行检查，以防止用户点击到恶意链接或钓鱼网站。通过重定向，微信可以先验证链接的安全性。
2. 防止滥用：重定向可以帮助微信防止链接被滥用，比如防止垃圾信息和广告的传播。
3. 数据统计：微信可以通过重定向链接收集点击数据，帮助分析用户行为和链接的有效性。
4. 用户体验：通过重定向，微信可以确保用户在点击链接时获得最佳的浏览体验，避免一些不兼容或不友好的页面。

如何避免链接被重定向？

1、复制的时候，直接使用固定地址。

2、后端返回链接

3、使用短连接