詳解微信圖片防盜鏈“此圖片來自微信公眾平臺 未經(jīng)允許不得引用”的解決方案
已經(jīng)獲取微信公眾號發(fā)布的圖片,但不能正常顯示 ,提示:此圖片來自微信公眾平臺 未經(jīng)允許不得引用。
這是怎么回事呢?
遇到這種問題是因為微信公眾平臺對圖片采用了防盜鏈設(shè)置,微信對外提供了API接口,讓我們可以通過授權(quán)的方式獲取到自己公眾號里面的文章,或者你也可以通過爬蟲去抓取微信的文章,但是微信的圖片默認是不允許外部調(diào)用的
那該怎么解決這種問題呢?
這里我找到了兩種方案
第一種
在JS中提前把圖片加載到本地,然后從本地緩存中讀取圖片
var showImg = function (url) {
var frameid = 'frameimg' + Math.random();
window.img = '<img id="img" src=\'' + url + '?' + Math.random() + '\' /><script>window.onload = function() { parent.document.getElementById(\'' + frameid + '\').height = document.getElementById(\'img\').height+\'px\'; }<' + '/script>';
return '<iframe id="' + frameid + '" src="javascript:parent.img;" frameBorder="0" scrolling="no" width="100%"></iframe>';
}
通過各種iframe,form等來跳過防盜鏈機制,但是這種方法,對代碼的結(jié)構(gòu)影響很大,對一些移動類庫兼容性不太好。
第二種
運用用后臺方法
<img class="form_logo" src="{:U('showMpImg')}?url={$vo.url}" style="max-width: none" width="160" height="100">
//顯示圖片
public function showMpImg($url){
header('content_type:image/jpeg');
echo file_get_contents($url);
}
第三種,用php模擬瀏覽器請求
$url = $request->input('url');
$ch = curl_init();
$httpheader = array(
'Host' => 'mmbiz.qpic.cn',
'Connection' => 'keep-alive',
'Pragma' => 'no-cache',
'Cache-Control' => 'no-cache',
'Accept' => 'textml,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8',
'User-Agent' => 'Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.89 Safari/537.36',
'Accept-Encoding' => 'gzip, deflate, sdch',
'Accept-Language' => 'zh-CN,zh;q=0.8,en;q=0.6,zh-TW;q=0.4'
);
$options = array(
CURLOPT_HTTPHEADER => $httpheader,
CURLOPT_URL => $url,
CURLOPT_TIMEOUT => 5,
CURLOPT_FOLLOWLOCATION => 1,
CURLOPT_RETURNTRANSFER => true
);
curl_setopt_array( $ch , $options );
$result = curl_exec( $ch );
curl_close($ch);
header('Content-type: image/jpg');
echo $result;
exit;
可看到結(jié)果,

目前我用第二種方法測試過,代碼簡單易懂,建議使用。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
js使用數(shù)組判斷提交數(shù)據(jù)是否存在相同數(shù)據(jù)
判斷提交數(shù)據(jù)是否存在相同數(shù)據(jù),在本文將為大家介紹使用數(shù)組做到這一點,感興趣的朋友可以參考下2013-11-11
JavaScript中如何讓?x?==?1?&&?x?==?2?&&?x?==?3?等式成立
這篇文章主要介紹了JavaScript中如何讓x==1&&x==2&&x==3等式成立,文章圍繞主題展開詳細的內(nèi)容介紹,具有一定的參考價值,需要的小伙伴可以參考一下2022-07-07
VSCode開發(fā)TypeScript的實現(xiàn)步驟
本文主要介紹了VSCode開發(fā)TypeScript的實現(xiàn)步驟,文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-02-02

