前端js 爬取获取网页

时间 2019-11-05

原文原文链接

一、存在问题javascript

same origin policy（同源策略）

页面中的Javascript只能读取，访问同域的网页。这里须要注意的是，Javascript自身的域定义和它所在的网站没有任何关系，只和该Javascript代码所嵌入的文档的域有关。如如下示例代码：php

<!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后，之后的加载将都经过浏览器缓存，从而加快了页面加载速度。html

从这个角度看问题，假如提问者所知的远端指的是互联网上任意的页面，那么不能实现你所指望的功能；若是远端指的是提问者你所拥有控制权的网站，请看下面的Relaxing the same-origin policy；java

Relaxing the same-origin policy

Document.domain：用于子域名的状况。对于多个windows(一个页面有多个iframe)，经过设置document.domain的值为相同的域，使得Javascript能够访问异域window；
Cross-origin resource sharing：经过在服务器端返回头增长Access-Control-

Allow-Origin，该头部包含了全部容许访问的域的列表。支持的浏览器将容许本页面Javascript访问这些域；node

cross-document messaging：该方式和域无关，不一样文档的Javascript能够相互发送接受消息而不受限制，然而不能主动趣读取，调用另外一个文档的方法属性；

若是提问者拥有远端页面的控制权，能够尝试第二种方法。jquery

服务器端抓取

根据提问者的需求，比较可行的方案应该是在服务器端进行处理。借助(http://phantomjs.org/)，你可使用Javascript语法在服务器端进行DOM操做，同时你可使用nodejs进行进一步的分析等，固然，你也可使用Python, php ,Java语言进行后续操做。web

结论：ajax

（1）服务端将网页的跨域限制打开；windows

（2）使用服务度端请求页面api

前端js 爬取 获取网页

same origin policy（同源策略）

Relaxing the same-origin policy

服务器端抓取

前端js 爬取获取网页