Rumah >hujung hadapan web >tutorial js >Mengapa Saya Mendapat 'SecurityError: Akses Bingkai Silang Asal Disekat' dalam JavaScript?

Mengapa Saya Mendapat 'SecurityError: Akses Bingkai Silang Asal Disekat' dalam JavaScript?

Mary-Kate Olsenasal: 2024-12-27 05:51:08508semak imbas

Why Am I Getting a

Ralat Keselamatan: Akses Bingkai Rentas Asal Disekat

Apabila cuba mengakses elemen dalam daripada asal yang berbeza menggunakan JavaScript, anda mungkin menghadapi ralat:</p> <pre class="brush:php;toolbar:false">SecurityError: Blocked a frame with origin "http://www.example.com" from accessing a cross-origin frame.</pre> <p>Ralat ini adalah hasil daripada dasar asal yang sama, langkah keselamatan asas yang dikuatkuasakan oleh penyemak imbas.</p> <p><h3&gt ;Dasar Asal Sama dan Implikasinya</h3></p> <p>Dasar asal sama menghalang skrip daripada mengakses sumber (seperti halaman atau bingkai lain) dengan asal yang berbeza. Asal ditakrifkan oleh protokol (cth., HTTP), nama hos dan port URL. Sebarang perbezaan dalam mana-mana komponen ini merupakan asal yang berasingan.</p> <p>Sebagai contoh, skrip daripada "http://www.example.com" tidak boleh mengakses sumber daripada "https://www.example.com" , "http://www.anothersite.com", atau "http://www.example.com:81".</p> <p><h3>Mengakses Bingkai Silang Asal: Penyelesaian</h3></p> <p>Walaupun akses skrip terus ke bingkai silang asal disekat, terdapat penyelesaian menggunakan window.postMessage dan pendengar acara. Pendekatan ini membolehkan anda menukar data antara halaman utama dan bingkai:</p> <p><strong>Halaman Utama:</strong></p> <pre class="brush:php;toolbar:false">const frame = document.getElementById('your-frame-id'); frame.contentWindow.postMessage(/*variable or object*/, 'https://your-second-site.example');</pre> <p><strong><iframe> Halaman:</strong></p> <pre class="brush:php;toolbar:false">window.addEventListener('message', event => { // Check the origin of the data if (event.origin === 'https://your-first-site.example') { // Data is from the main page, use event.data to process it } });</pre> <p>Ingat bahawa dasar asal yang sama adalah penting untuk keselamatan. Melumpuhkannya dalam penyemak imbas anda untuk tapak tertentu atau secara global hanya perlu dilakukan untuk tujuan pembangunan dan dengan sangat berhati-hati.</p><p>Atas ialah kandungan terperinci Mengapa Saya Mendapat 'SecurityError: Akses Bingkai Silang Asal Disekat' dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!</p></div><div class="nphpQianMsg"><a href="javascript:void(0);">JavaScript</a> <a href="javascript:void(0);">for</a> <a href="javascript:void(0);">while</a> <a href="javascript:void(0);">Error</a> <a href="javascript:void(0);">using</a> <a href="javascript:void(0);">Event</a> <a href="javascript:void(0);">this</a> <a href="javascript:void(0);">http</a> <a href="javascript:void(0);">https</a> <a href="javascript:void(0);">Access</a> <a href="javascript:void(0);">iframe</a> <a href="javascript:void(0);">Other</a><div class="clear"></div></div><div class="nphpQianSheng"><span>Kenyataan：</span><div>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</div></div></div><div class="nphpSytBox"><span>Artikel sebelumnya：<a class="dBlack" title="Bagaimanakah Saya Boleh Menyahkod Entiti HTML dalam JavaScript?" href="https://m.php.cn/ms/faq/1796736494.html">Bagaimanakah Saya Boleh Menyahkod Entiti HTML dalam JavaScript?</a></span><span>Artikel seterusnya：<a class="dBlack" title="Bagaimanakah Saya Boleh Menyahkod Entiti HTML dalam JavaScript?" href="https://m.php.cn/ms/faq/1796736518.html">Bagaimanakah Saya Boleh Menyahkod Entiti HTML dalam JavaScript?</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Artikel berkaitan</h2><em><a href="https://m.php.cn/ms/article.html" class="bBlack"><i>Lihat lagi</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/ms/faq/1609.html" title="Analisis mendalam bagi komponen kumpulan senarai Bootstrap" class="aBlack">Analisis mendalam bagi komponen kumpulan senarai Bootstrap</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/1640.html" title="Penjelasan terperinci tentang fungsi JavaScript kari" class="aBlack">Penjelasan terperinci tentang fungsi JavaScript kari</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/1949.html" title="Contoh lengkap penjanaan kata laluan JS dan pengesanan kekuatan (dengan muat turun kod sumber demo)" class="aBlack">Contoh lengkap penjanaan kata laluan JS dan pengesanan kekuatan (dengan muat turun kod sumber demo)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/2248.html" title="Angularjs menyepadukan UI WeChat (weui)" class="aBlack">Angularjs menyepadukan UI WeChat (weui)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/2351.html" title="Cara cepat bertukar antara Cina Tradisional dan Cina Ringkas dengan JavaScript dan helah untuk tapak web menyokong pertukaran antara kemahiran_javascript Cina Ringkas dan Tradisional" class="aBlack">Cara cepat bertukar antara Cina Tradisional dan Cina Ringkas dengan JavaScript dan helah untuk tapak web menyokong pertukaran antara kemahiran_javascript Cina Ringkas dan Tradisional</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！</p></div><div class="footermid"><a href="https://m.php.cn/ms/about/us.html">Tentang kita</a><a href="https://m.php.cn/ms/about/disclaimer.html">Penafian</a><a href="https://m.php.cn/ms/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body><script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '9']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script></html>