首先這一定需要使用微信jssdk，但是在你使用了微信jssdk之后，依舊分享的鏈接不帶圖標(biāo)和摘要，那就看看我踩的坑吧。

前端代碼

我這里引入了jQuery（不用jQuery的寫法的話可以不引入），然后這里就是必須引入最新的微信jssdk：https://res2.wx.qq.com/open/js/jweixin-1.6.0.js
最新的微信jssdk已經(jīng)舍棄了之前的分享接口，最新的分享接口是：updateAppMessageShareData 和 updateTimelineShareData
前端代碼如下：

<script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> var url = location.href; $.ajax({type: "get",url: "https://你的網(wǎng)址/wxjssdk.php?url=" + url,dataType: "json",success: function(res) {if (res.code === 200) {wx.config({debug: false,appId: res.data.appId,timestamp: res.data.timestamp,nonceStr: res.data.nonceStr,signature: res.data.signature,jsApiList: ['updateAppMessageShareData','updateTimelineShareData']});wx.ready(function() {wx.updateAppMessageShareData({title: res.data.title,desc: res.data.desc,link: res.data.link,imgUrl: res.data.imgUrl,success: function() {console.log('分享成功');}});wx.updateTimelineShareData({title: res.data.title,link: res.data.link,imgUrl: res.data.imgUrl,success: function() {console.log('分享成功');}})});}} }) </script>

后端代碼

前端需要ajax請求后端進行簽名和獲取token，請求的后端https://你的網(wǎng)址/wxjssdk.php文件代碼如下：

<?php /*** 微信JsSDK* Class JsSDK*/ class JsSDK {private $appId;private $appSecret;private $url;public function __construct($appId, $appSecret, $url) {$this->appId = $appId;$this->appSecret = $appSecret;$this->url = $url;}/*** 簽名* @return array*/public function getSignPackage() {$jsapiTicket = $this->getJsApiTicket();$url = $this->url;$timestamp = time();$nonceStr = $this->createNonceStr();$string = "jsapi_ticket=" . $jsapiTicket . "&noncestr=" . $nonceStr . "&timestamp=" . $timestamp . "&url=" . $url;$signature = sha1($string);return ["appId" => $this->appId,"nonceStr" => $nonceStr,"timestamp" => $timestamp,"url" => $url,"signature" => $signature,"rawString" => $string];}/*** 創(chuàng)建字符串* @param int $length* @return string*/private function createNonceStr($length = 16) {$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";$str = "";for ($i = 0; $i < $length; $i++) {$str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);}return $str;}/*** 獲取JsApiTicket* @return mixed*/private function getJsApiTicket() {$data = json_decode($this->get_php_file("jsapi_ticket.php"));if ($data->expire_time < time()) {$accessToken = $this->getAccessToken();$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=" . $accessToken;$res = json_decode($this->httpGet($url));$ticket = $res->ticket;if ($ticket) {$data->expire_time = time() + 7000;$data->jsapi_ticket = $ticket;$this->set_php_file("jsapi_ticket.php", json_encode($data));}} else {$ticket = $data->jsapi_ticket;}return $ticket;}/*** 獲取AccessToken* @return mixed*/private function getAccessToken() {$data = json_decode($this->get_php_file("access_token.php"));if ($data->expire_time < time()) {$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" . $this->appId . "&secret=" . $this->appSecret;$res = json_decode($this->httpGet($url));$access_token = $res->access_token;if ($access_token) {$data->expire_time = time() + 7000;$data->access_token = $access_token;$this->set_php_file("access_token.php", json_encode($data));}} else {$access_token = $data->access_token;}return $access_token;}/*** GET CURL請求* @param $url* @return bool|string*/private function httpGet($url) {$curl = curl_init();curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);curl_setopt($curl, CURLOPT_TIMEOUT, 500);curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);curl_setopt($curl, CURLOPT_URL, $url);$res = curl_exec($curl);curl_close($curl);return $res;}/*** 讀取文件* @param $filename* @return string*/private function get_php_file($filename) {return trim(substr(file_get_contents($filename), 15));}/*** 寫入文件* @param $filename* @param $content*/private function set_php_file($filename, $content) {$fp = fopen($filename, "w");fwrite($fp, "<?php exit();?>" . $content);fclose($fp);} }$url = $_GET['url']; $JsSDK = new JSSDK("替換成你的公眾號appId", "替換成你的公眾號appSecret", $url); $signPackage = $JsSDK->GetSignPackage();$result = ['code' => 200,'msg' => 'success','data' => ['appId' => $signPackage["appId"],'timestamp' => $signPackage["timestamp"],'nonceStr' => $signPackage["nonceStr"],'signature' => $signPackage["signature"],'title' => '替換成分享的鏈接標(biāo)題','desc' => '替換成分享的鏈接描述','link' => $url,'imgUrl' => 'https://你的網(wǎng)址/share.png'] ];header('content-type:application/json'); echo json_encode($result);exit;

因為這里的 access_token 和 jsapi_ticket 都是存儲在文件中，所以這里你需要創(chuàng)建兩個文件，代碼如下：

// access_token.php 文件 <?php exit();?> {"access_token":"","expire_time":0} // jsapi_ticket.php 文件 <?php exit();?> {"jsapi_ticket":"","expire_time":0}

當(dāng)然你也可以把 access_token 和 jsapi_ticket 存儲在數(shù)據(jù)庫中。

填坑

如果依然無法實現(xiàn)，那么注意以下幾點：

確保服務(wù)器IP增加到了IP白名單中

確保開發(fā)者ID（AppID）和開發(fā)者密碼（AppSecret）正確，開發(fā)者密碼（AppSecret）復(fù)制的時候可能會復(fù)制失敗，需要手動復(fù)制。

確保分享的網(wǎng)頁域名已經(jīng)增加到JS接口安全域名

由于微信內(nèi)置瀏覽器有緩存，建議更換手機或刷新微信內(nèi)瀏覽器緩存后再次查看效果，微信內(nèi)瀏覽器清理緩存方法如下：
在微信中打開鏈接debugmm.qq.com/?forcex5=true 然后關(guān)閉，再打開debugtbs.qq.com 和 debugx5.qq.com 來清理微信瀏覽器緩存。

如果實在不行建議使用 微信開發(fā)者工具 下載地址：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 在開發(fā)者工具中調(diào)試，記著一定要開啟jssdk中的debug

總結(jié)

以上是生活随笔為你收集整理的最新链接分享给微信好友和微信朋友圈带图标和摘要的方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。