JSONP與跨域的Ajax

jeyhan 發布于2019-08-20 14:28 / 3238人閱讀

摘要：在通常情況下，為了網站的安全性，對象只能訪問到與當前頁面位于同一個域下的資源。由兩部分組成，一部分是回調函數，一部分是所包含的數據。回調函數是請求數據時指定，而數據則是跨域資源返回的數據。

在通常情況下，為了網站的安全性，Ajax對象只能訪問到與當前頁面位于同一個域下的資源。但有時往往需要訪問別的域中的資源，這是就運用到了跨域這個概念，這其中運用最廣泛的就是JSONP。
JSONP，即JSON with padding（填充式的JSON）。JSON由兩部分組成，一部分是回調函數，一部分是所包含的數據。回調函數是請求數據時指定，而數據則是跨域資源返回的JSON數據。
要實現使用JSONP跨域需要三步：
第一步，動態創建一個script元素；
第二步，設置script元素的src為想要跨域請求資源的url，這個url的參數callback為請求到資源后的處理函數；
第三步，定義處理函數，處理返回的對象；
第四步，把script元素添加到頁面中

var scriptEl = document.createElement("script");
scriptEl.src = "http://www.freegeoip.net/json/?callback=handleResponse";
document.body.appendChild(scriptEl);
function handleResponse(response) {
  /*response的類型是Object*/
  alert(response.country_name);
}

但是JSONP也并不是完美的，主要有兩個缺點：
一、由于請求的是其他域中的資源，很有可能這個資源不安全，造成網站的損失。
二、不容易確定資源是否請求成功。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81660.html

web安全一，同源策略與跨域

摘要：可以說同源策略在安全中扮演著及其重要的角色。我把這個領域的東西寫成了一個系列，以后還會繼續完善下去安全一同源策略與跨域安全二攻擊安全三攻擊之所以要將同源策略與跨域寫在一起，是因為存在瀏覽器的同源策略，才會存在跨域問題何為同源策略同源策略是瀏覽器實現的一種安全策略，它限制了不同源之間的文檔和腳本交互的權限。只有同一個源的腳本才會具有操作dom、讀寫cookie、session 、a...

cgspine 2019-08-22 14:56 評論0 收藏0
同源策略與跨域資源共享的糾纏

摘要：扯了這么多，自然不是為了吹水，而是要為了引出前端開發的一個重要的知識點同源策略什么是同源策略出于保護用戶信息安全的目的，現在的瀏覽器都會實施同源策略這個政策，所謂同源策略指的是不同源的客戶端腳本在沒有明確授權情況下，不允許讀寫對方的資源。導語你家的小孩帶了他的朋友來你們的家里玩，你家的小孩如果要在自家屋里拿玩具玩、拿東西吃你自然是不會阻止，但是如果你家小孩的朋友人品不行，亂拿東西吃、...

alighters 2019-08-21 11:17 評論0 收藏0
同源策略與跨域資源共享的糾纏

摘要：扯了這么多，自然不是為了吹水，而是要為了引出前端開發的一個重要的知識點同源策略什么是同源策略出于保護用戶信息安全的目的，現在的瀏覽器都會實施同源策略這個政策，所謂同源策略指的是不同源的客戶端腳本在沒有明確授權情況下，不允許讀寫對方的資源。導語你家的小孩帶了他的朋友來你們的家里玩，你家的小孩如果要在自家屋里拿玩具玩、拿東西吃你自然是不會阻止，但是如果你家小孩的朋友人品不行，亂拿東西吃、...

趙連江 2019-06-27 15:05 評論0 收藏0
ajax跨域，這應該是最全的解決方案了

摘要：關于，強烈推薦閱讀跨域資源共享詳解阮一峰另外，這里也整理了一個實現原理圖簡化版如何判斷是否是簡單請求瀏覽器將請求分成兩類簡單請求和非簡單請求。前言從剛接觸前端開發起，跨域這個詞就一直以很高的頻率在身邊重復出現，一直到現在，已經調試過N個跨域相關的問題了，16年時也整理過一篇相關文章，但是感覺還是差了點什么，于是現在重新梳理了一下。個人見識有限，如有差錯，請多多見諒，歡迎提出iss...

ytwman 2019-08-22 11:21 評論0 收藏0
Web開發之跨域與跨域資源共享

摘要：例外當涉及到同源策略時，有兩個主要的例外授信范圍兩個相互之間高度互信的域名，如公司域名，不遵守同源策略的限制。端口未將端口號加入到同源策略的組成部分之中，因此和屬于同源并且不受任何限制。原文鏈接：http://www.devsai.com/2016/11/24/talk-CORS/ 同源策略（same origin policy） 1995年，同源政策由 Netscape 公司引入瀏...

Eastboat 2019-08-20 12:29 評論0 收藏0