Rumah >hujung hadapan web >tutorial js >Bercakap secara ringkas tentang kemahiran json cross-domain_javascript

Bercakap secara ringkas tentang kemahiran json cross-domain_javascript

WBOY
WBOYasal
2016-05-16 15:10:541534semak imbas

Artikel ini terutamanya kerana saya pernah mendengar orang lain bercakap tentang json cross-domain dan cross-domain sebelum ini, tetapi saya masih keliru dan hanya tahu satu perkara Jadi dalam kemarahan, saya membaca pelbagai maklumat dan mengetahui jika ada ada yang salah , sila betulkan saya^_^

Pertama sekali, fahami bahawa penyemak imbas mempunyai sekatan keselamatan yang sangat penting, iaitu dasar asal yang sama: skrip klien dalam domain yang berbeza tidak boleh membaca sumber satu sama lain tanpa kebenaran yang jelas. Cross-domain bermaksud sumber yang berbeza~

Ringkasnya, selagi protokol, port dan nama domain berbeza, ia adalah merentas domain!

Walau bagaimanapun, apabila melakukan beberapa pengaturcaraan bahagian hadapan yang mendalam, operasi merentas domain tidak dapat tidak diperlukan Pada masa ini, "dasar asal yang sama" nampaknya terlalu keras.

Penyelesaian:

1. Gunakan jsonp untuk menyelesaikan isu merentas domain: (hanya untuk permintaan GET)

Prinsip pelaksanaan: Teg 855348821b2e8f2cc4b633bf98f064df tidak dihadkan oleh dasar asal yang sama. Ia boleh memuatkan fail JavaScript dari mana-mana sahaja tanpa memerlukan asal yang sama.
Jadi idea JSONP ialah saya bersetuju dengan nama fungsi dengan pelayan, dan apabila saya meminta fail, pelayan mengembalikan sekeping JavaScript. JavaScript ini memanggil fungsi yang kami setujui dan menghantar data sebagai parameter. Secara kebetulan (bukan sebenarnya), format data JSON adalah betul-betul sama dengan format objek dalam bahasa JavaScript. Jadi objek ini boleh digunakan secara langsung dalam fungsi yang kami persetujui.

Gunakan kod JavaScript untuk menyelesaikan

  var eleScript = document.createElement("script"); 
  eleScript.type = "text/javascript"; 
  eleScript.src = "http://example2.com/getinfo.php"; 
  document.getElementsByTagName("HEAD")[0].appendChild(eleScript);

Gunakan jquery untuk menyelesaikan

 $.ajax({ 
    url: http://跨域的dns/document!searchJSONResult.action, 
    type: "GET", 
    dataType: 'jsonp',   //主要是这里和原来的json改变了!
    jsonp: 'jsoncallback', 
 })

2. Gunakan kaedah window.postMessage HTML5 untuk menghantar data merentas domain (hanya serasi dengan IE8+, FireFox, Chrome, Opera dan penyemak imbas lain)

kaedah window.postMessage(message,targetOrigin) ialah ciri HTML5 yang baru diperkenalkan Anda boleh menggunakannya untuk menghantar mesej ke objek tetingkap lain, tidak kira sama ada objek tetingkap milik asal yang sama atau asal yang berbeza.

--------------------- Mari kita perkenalkan kedua-dua penyelesaian ini buat masa ini... Sebenarnya ada banyak lagi, saya akan tambah satu persatu nanti-- ----------- ----

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn