阻止了来源为“http://localhost:5173”的框架

Question

我的前端正在 http://localhost:5173 (vue) 上运行 我的后端运行在 http://localhost:8000 (laravel Rest api)

问题：- 当我在 vue 前端的 iframe 中添加 http://localhost:8000 时 （基本上我想使用 iframe 在我的前端显示 laravel 主屏幕） 但问题是，当我尝试访问 iframe 内容的 dom 时，它给我错误，阻止了来源为“http://localhost:5173”的框架 但如果我添加 http://localhost:5173 （前端主屏幕）它工作得很好 我的问题是如何从 Laravel 后端访问我的前端，以便我可以访问前端中的文档

 <iframe
                    v-if="size === 'L' && !isLoading && !error"
                    @click="handlePopup"
                    src="http://localhost:8000"
                    class="!cursor-text scroll-smooth"
                    sandbox="allow-scripts allow-forms allow-same-origin allow-pointer-lock allow-                           presentation allow-popups allow-popups-to-escape-sandbox"
                    style="border: 0; width: 100%; height: 100%"
                    :onLoad="
                        () => {
                            initializeIframe();
                        }
                    "
                    ref="iframeRef"
                    allow-same-origin
                ></iframe>

Answer 1

浏览器为本地主机上运行的 iframe 添加了额外的安全性。解决这个问题的方法是使用您机器的外部 IP 地址。