jQuery中的load()函數(shù)是一個非常有用的函數(shù),可以實現(xiàn)異步加載頁面內(nèi)容的功能。但是,有時我們會遇到使用load()函數(shù)時出現(xiàn)“拒絕訪問”的問題,這該如何解決呢?
$(function(){ $('#content').load('http://example.com/data.html'); });
當我們像上面這樣使用load()函數(shù)加載外部網(wǎng)頁時,有時會出現(xiàn)“拒絕訪問”的問題。這是因為跨域訪問的限制導致的,我們可以在控制臺看到如下報錯信息:
XMLHttpRequest cannot load http://example.com/data.html. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
解決這個問題的方法是在服務(wù)器上添加相應(yīng)的響應(yīng)頭信息,允許跨域請求。如果我們沒有控制那個服務(wù)器,我們也可以使用JSONP來繞過跨域限制。
$.ajax({ type: "GET", url: "http://example.com/data.html", dataType: "jsonp", success: function(data){ console.log(data); } });
以上代碼使用了JQuery中的ajax方法實現(xiàn)了異步請求。由于JSONP的實現(xiàn)原理是通過動態(tài)創(chuàng)建script標簽來實現(xiàn)的,并且script標簽不受跨域限制,因此可以繞過跨域限制問題。不過,這種方法也有一些限制,比如只能實現(xiàn)GET請求等。
總之,在使用load()函數(shù)時,如果遇到了“拒絕訪問”的問題,可以考慮使用JSONP或者在服務(wù)器端添加響應(yīng)頭信息來解決。