Vue分享QQ却只能访问首页的解决方法
之前的代码为了能够分享当前文章到QQ我是这样写的
shareToQQ(){
let url = `https://connect.qq.com/widget/shareqq/index.html?url=https://我的网站/#/article/${this.id}&source=https://我的网站.com&title=${this.article.title}&summary=${this.article.content.slice(0, 42)}&desc=${this.article.title}&pics=https://我的网站.com${this.article.cover_image}`
window.open(url)
}
1
2
3
4
2
3
4
结果出现了发给好友,好友打开的不是文章详情页,而是网站的首页,思考了几天,最后在一个地方发现别人的写法:
<a class="lqq" target="_blank" href="javascript:void(0);" οnclick="window.open('http://connect.qq.com/widget/shareqq/index.html?url=' + encodeURIComponent(document.location.href) + '
&desc=邀请详情&title=标题&summary=简介&pics=&flash=&site=邀请人或网站&callback=" title="QQ登录">qq</a>
1
2
3
2
3
发现它的url外面有encodeURIComponent(document.location.href)包裹,于是我改了下自己的代码:
shareToQQ(){
let href = `https://我的网站.com/#/article/${this.id}`
let url = `https://connect.qq.com/widget/shareqq/index.html?url=${encodeURIComponent(href)}&source=https://我的网站.com&title=${this.article.title}&summary=${this.article.content.slice(0, 42)}&desc=${this.article.title}&pics=https://我的网站.com${this.article.cover_image}`
window.open(url)
}
1
2
3
4
5
2
3
4
5
问题解决!主要的区别就是把网址单独写了一个变量并用encodeURIComponent()方法包裹,可能是QQ那边不支持我原有的写法吧,也希望大家能够帮忙解答一下,不过最后还是解决了问题。
编辑 (opens new window)
上次更新: 2022/08/29, 16:40:19