Ajax

#Javascript:Cross Domain AJAX-使用PHP將網頁資訊轉JSONP

其實在使用上篇使用YQL來進行Cross Domain AJAX之前,我是先使用別人寫好的PHP網頁將要抓取之網站資訊轉成JSONP格式回來。

ba-simple-proxy.php

此頁別人寫好的PHP連結在此:ba-simple-proxy.php

簡單來說,這PHP就是當作一個代理網頁,給它網址它就會抓取該網址所指的網頁內容,並用JSONP的格式回傳回來。

使用前先將該頁PHP內的 $enable_jsop = false; 從false改為true,然後上傳到PHP伺服器,接著使用AJAX抓取資料的js部分寫上:

xdomainajax.js
1
2
3
$.getJSON( /* ba-simple-proxy.php所在地 + "?callback=?&url=" + 欲抓資料之網頁所在的網址 */ , function(data){
  /* data.contents即是該網頁內容 */
});

這樣就可以進行Cross Domain AJAX了!

參考資料

  1. Cross Domain AJAX 抓網頁撈過界以及如何整合兩個部落格的標籤:http://user.frdm.info/ckhung/b/js/xdomain.php
  2. Design2U » Cross Domain Ajax 跨網域抓取資料(JSONP):http://design2u.me/blog/936/cross-domain-ajax-cross-domain-data-has-been-retrieved-jsonp
  3. SIMPLE PHP PROXY: GET EXTERNAL HTML, JSON AND MORE!:http://benalman.com/code/projects/php-simple-proxy/docs/files/ba-simple-proxy-php.html

#Javascript:Cross Domain AJAX-使用YQL

在這次撰寫無名備份工具的途中,由於寫的是Web應用程式,我要抓取無名部落格上的資料就必須要使用到AJAX,但是基於安全性的問題,AJAX在回應非JSONP的情況下,僅支援同域名之間的抓取資料,那麼該怎樣才能跨越域名去抓取資料呢?

使用YQL

查了一下發現有人是使用Yahoo所提供的一套API-YQL來進行跨域抓資料的動作,而正好有人也幫你把它包裝起來寫成一個jQuery的plugin,讓你引用該javascript碼後使用$.get就可以直接跨越域名去抓取資料。

底下正是該plugin的github位址(使用此plugin,也必須引入jQuery函式庫):
https://github.com/padolsey/jQuery-Plugins/tree/master/cross-domain-ajax/

引用以上的plugin後,在要做讀取資料的地方寫入底下的Code:

xdomainajax.js
1
2
3
$.get(/* 此處放置欲抓取之資料所在的URL */, function(data){
  /* data.responseText即為所在該URL的網頁內容 */
});

大體上我就是這樣成功的將資料抓進來了!!

參考資料

  1. Cross Domain AJAX 抓網頁撈過界以及如何整合兩個部落格的標籤:http://user.frdm.info/ckhung/b/js/xdomain.php
  2. Cross-domain requests with jQuery:http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
  3. Cross domain mod for jQuery (Github):https://github.com/padolsey/jQuery-Plugins/tree/master/cross-domain-ajax/