1、存在問題
same origin policy(同源策略)
頁面中的Javascript只能讀取,訪問同域的網頁。這里需要注意的是,Javascript自身的域定義和它所在的網站沒有任何關系,只和該Javascript代碼所嵌入的文檔的域有關。如以下示例代碼:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>This is a webpage came from http://localhost:8000</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<div id="test">123</div>
<script type="text/javascript"> console.log($('#test').text()); </script>
</body>
</html>
該HTML文檔來源於http://localhost:8000
,這意味着它的域為http://localhost:8000
(域和端口也相關),雖然頁面中的jquery加載自ajax.googleapis.com
,然而該JQuery的域只和它所處的HTML文檔的域有關,從而可以訪問該HTML文檔的屬性,因而以上代碼可以正常運行。
附:使用上述代碼的原因是,開發者將通用的Javascript庫(如JQuery)地址指向公共相同的URL。當用戶加載過一次該JS后,以后的加載將都通過瀏覽器緩存,從而加快了頁面加載速度。
從這個角度看問題,假如提問者所知的遠端
指的是互聯網上任意的頁面,那么不能實現你所期望的功能;如果遠端
指的是提問者你所擁有控制權的網站,請看下面的Relaxing the same-origin policy;
Relaxing the same-origin policy
- Document.domain:用於子域名的情況。對於多個windows(一個頁面有多個iframe),通過設置document.domain的值為相同的域,使得Javascript可以訪問異域window;
- Cross-origin resource sharing:通過在服務器端返回頭增加Access-Control-
Allow-Origin,該頭部包含了所有允許訪問的域的列表。支持的瀏覽器將允許本頁面Javascript訪問這些域;
- cross-document messaging:該方式和域無關,不同文檔的Javascript可以相互發送接受消息而不受限制,然而不能主動趣讀取,調用另一個文檔的方法屬性;
如果提問者擁有遠端
頁面的控制權,可以嘗試第二種方法。
服務器端抓取
根據提問者的需求,比較可行的方案應該是在服務器端進行處理。借助(http://phantomjs.org/),你可以使用Javascript語法在服務器端進行DOM操作,同時你可以使用nodejs進行進一步的分析等,當然,你也可以使用Python, php ,Java語言進行后續操作。
結論:
(1)服務端將網頁的跨域限制打開;
(2)使用服務度端請求頁面