Python自動化之跨域訪問jsonp

時間 2019-12-18

原文原文鏈接

這裏提到了JSONP，那有人就問了，它同JSON有什麼區別不一樣和區別呢，接下咱們就來看看，百度百科有如下說明：

'''javascript

1. JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。它基於JavaScript（Standard ECMA-262 3rd Edition - December 1999）的一個子集。 JSON採用徹底獨立於語言的文本格式，可是也使用了相似於C語言家族的習慣（包括C, C++, C#, Java, JavaScript, Perl, Python等）。這些特性使JSON成爲理想的數據交換語言。易於人閱讀和編寫，同時也易於機器解析和生成(網絡傳輸速度快)。

2. JSONP(JSON with Padding)是JSON的 一種「使用模式」，可用於解決主流瀏覽器的跨域數據訪問的問題。因爲同源策略，通常來講位於 server1.example.com 的網頁沒法與不是 server1.example.com的服務器溝通,而 HTML 的`<script>` 元素是一個例外。利用 <script> 元素的這個開放策略，網頁能夠獲得從其餘來源動態產生的 JSON 資料，而這種使用模式就是所謂的 JSONP。用 JSONP 抓到的資料並非 JSON，而是任意的JavaScript，用 JavaScript 直譯器執行而不是用 JSON 解析器解析。
3. 咱們知道，因爲同源策略的限制，XmlHttpRequest只容許請求當前源（域名、協議、端口）的資源。若要跨域請求出於安全性考慮是不行的，可是咱們發現，Web頁面上調用js文件時則不受是否跨域的影響，並且擁有」src」這個屬性的標籤都擁有跨域的能力，好比<script>、<img>、<iframe>，這時候，聰明的程序猿就想到了變通的方法，若是要進行跨域請求， 經過使用html的script標記來進行跨域請求，並在響應中返回要執行的script代碼，其中能夠直接使用JSON傳遞 javascript對象。即在跨域的服務端生成JSON數據，而後包裝成script腳本回傳，着不就突破同源策略的限制，解決了跨域訪問的問題了麼。

第一種jQuery實現

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>

</head>
<body>
    <h1>後臺獲取的結果</h1>
    {{ result }}
    <h1>js直接獲取結果</h1>
    <input type="button" value="獲取數據" onclick="getContent();" />
    <div id="container"></div>
    <script src="/static/jquery-1.8.2.js"></script>
    <script>
        function getContent(){

            $.ajax({
                url: 'http://www.jxntv.cn/data/jmd-jxtv2.html',
                type: 'POST',
                dataType: 'jsonp',  //數據格式爲jsonp
                jsonp: 'callback',  //函數變量名
                jsonpCallback: 'list'  //函數名稱
            })
        }

        function list(arg){
            console.log(arg);
        }


    </script>
</body>
</html>

第二種XMLHttpRequest實現的

function getContent(){
            
            var xhr = new XMLHttpRequest();
            xhr.open('GET','http://wupeiqi.com:8001/jsonp.html?k1=v1&k2=v2');
            xhr.onreadystatechange = function(){
                console.log(xhr.responseText);
            };
            xhr.send();

            var tag = document.createElement('script');
            tag.src = 'http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list&_=1454376870403';
            document.head.appendChild(tag);
            document.head.removeChild(tag);

Python後端代碼

def jsonp(request):
    func = request.GET.get('callback')
    content = '%s(100000)' %(func,)
    return HttpResponse(content)

1. 跨域訪問之JSONP
2. jsonp 跨域訪問
3. Jsonp跨域訪問
4. JSONP 跨域訪問
5. 跨域訪問 jsonp
6. jsonp跨域訪問
7. jsonp實現跨域訪問
8. JQuery+ajax+jsonp 跨域訪問
9. JSONP詳解（四）JSONP跨域訪問
10. Ajax之跨域訪問與JSONP
更多相關文章...
• Maven 自動化部署 - Maven教程
• Swift 訪問控制 - Swift 教程
• PHP Ajax 跨域問題最佳解決方案
• IntelliJ IDEA中SpringBoot properties文件不能自動提示問題解決

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。