所以我用 node.js (watch-http-server) 创建了一个本地网络服务器。当我在下面运行时，它在堆栈的片段中完美运行。但是，当我在本地网络上运行它时，问题就来了
SecurityError:访问跨源对象上的属性“href”的权限被拒绝
$(function(){
alert('load');
});body, html{
padding: 0;
margin: 0;
cursor: default;
overflow: hidden;
background: url("../res/background.png") no-repeat;
background-size: cover;
}
.stream-container{
position: fixed;
margin: 0;
padding: 0;
top: 2%;
left: 5%;
}
.chat-container{
position: fixed;
margin: 0;
padding: 0;
top: 33%;
left: 5%;
}<!Doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Twitch Bot </title>
<meta name="author" content="Author">
<link rel="stylesheet" href="../css/styles.css">
</head>
<body>
<div class="stream-container">
<iframe id = "stream-frame" src="https://player.twitch.tv/?channel=dyarambo" height="300px" width="30px" frameborder="0" scrolling="no" allowfullscreen="false"></iframe>
</div>
<div class="chat-container">
<iframe frameborder="0" scrolling="no" id="chat_embed" src="https://www.twitch.tv/lovenpk/chat?darkpopout" height="300px" width="300px"></iframe>
</div>
<!-- Javascripts below -->
<script src="https://code.jquery.com/jquery-3.2.0.min.js"></script>
<script type="text/javascript" scr="../js/index.js"></script>
</body>
</html>有什么想法吗？
最佳答案
cross-origin security policy正在被侵犯。
问题在于您对 iframe 的使用:
<iframe id = "stream-frame" src="https://player.twitch.tv/?channel=dyarambo" height="300px" width="30px" frameborder="0" scrolling="no" allowfullscreen="false"></iframe>
来自 MDN :
Error: Permission denied to access property "x"
There was attempt to access an object for which you have no permission. This is likely an element loaded from a different domain for which you violated the same-origin policy.
由于您的 localhost 由位于与 player.twitch.tv 不同域的服务器提供服务，因此您被禁止访问该服务器上的信息。这是网络内置的浏览器内限制。
此外，您的本地网络应用程序还需要在与服务 player.twitch.tv 的服务器相同的端口上运行。
关于Javascript 安全错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45828598/