1. 程式人生 > >使用原生Ajax跨域抓取遠端網頁原始碼並抓取其中圖片

使用原生Ajax跨域抓取遠端網頁原始碼並抓取其中圖片

最新修改:有人反饋說用不了的。估計是使用方式不對。按照下圖的步驟使用即可。

即 1.複製網頁路徑 -> 2.用IE開啟檔案(執行使用控制元件) -> 3.貼上路徑獲取原始碼 -> 4.獲取IMG下載地址

(剛使用的gif圖製作工具,分享一波:gif圖製作小工具)

以下是原文:

正文之前先扯點其它的。話說我有一個表弟,年方二八,屬於外表實在,內心悶騷的那種型別,與我極為聊得來。不時會給我科普各種他收集而來的各種有趣的表情包,也不時給我發來一些福利圖或小視訊【不可描述】。對此我們也有屬於老司機間嘿嘿嘿的默契。某天他偶然登入到一網站,看到滿螢幕喜歡的圖片,當即給我說了這個事情,當得知他在一張張的另存為(法1)時,我就想這傻小子也是夠單純的,居然捨得花如此時間做這種事情。又看這小子學習熱情比較濃,遂決定幫他一把,叫他把網址發給我後,幾分鐘後,我便幫他拿到了他所需的所有圖片。小夥子頓時對我大為驚歎,大呼666。 嘿嘿,其實他不知道他表哥也就會那麼一點而已了。

法1:傻表弟將網頁中的每張圖片另存為

法2:使用工具簡單粗暴的獲取所有圖片連線

===============================================分割線===================================================

好啦,正文開始。這個獲取網站原始碼的工具很簡單,只需要直接開啟一個html頁面即可(右鍵->開啟方式->選擇IE瀏覽器)

下面簡單貼一下這個工具的核心程式碼部分 :

1. Html中:

<label>輸入遠端網址:</label>
<input type="text" id="url_id" value="請輸入網址"  style="color: grey;width:190px;" 
onfocus="whenFoucus(this)" 
onblur="whenLeave(this)" 
>
<button onclick="getUrlByInput()">獲取原始碼</button>

2.JS中:

function getUrlByInput(){
showMessage("showMessage_link");
var url = document.getElementById('url_id').value ;
document.getElementById("textArea_id").value = "\r\n-------------正在載入----------------\r\n";
createXmlHttp();
xmlHttp.onreadystatechange = writeAjaxHtml;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}

function createXmlHttp() {
//根據window.XMLHttpRequest物件是否存在使用不同的建立方式
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();                  //FireFox、Opera等瀏覽器支援的建立方式
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE瀏覽器支援的建立方式
}
}

function writeAjaxHtml() {
if (xmlHttp.readyState == 4) {
document.getElementById("textArea_id").value = document.getElementById("textArea_id").value + xmlHttp.responseText;
}
}

function getAll_IMG(){
var allStr = document.getElementById("textArea_id").value;
var reg_img = /http(.*?)(jpg|png)/g;
var result = allStr.match(reg_img);
var show_Str = "";
for(var i = 0;i<result.length; i++){
var temp_img = result[i];
show_Str = show_Str +  temp_img + "\r\n";
}
document.getElementById("textArea_id").value = show_Str ;
}

PS:以上所示的工具只是獲取了當前輸入框中的一個網頁的程式碼,然後抓取其中的圖片地址,將圖片地址複製到迅雷等下載工具中下載即可。

改進後可以抓取某個頁碼範圍內的所有網頁的程式碼,然後可以獲取這些網頁中的任意元素,如視訊,圖片,文字等等。老司機們好像想到了什麼。

好啦,表弟說已經把D盤清空,要開始新的貯備了。

再次祝各位看官們身體棒棒,越戰越勇。