我在我的谷歌浏览器扩展的 popup.html 窗口中使用了 Firebase 给出的聊天示例。弹出窗口效果很好,我可以在输入字段中输入,但它不会发布到服务器。我认为使用 enter 作为输入法可能有问题,所以我将其切换为 html 按钮,但这也不起作用......
我还确保将安全策略粘贴到我的 manifest.json
"content_security_policy": "script-src 'self' https://cdn.firebase.com >https://*.firebaseio.com; object-src 'self'",
并且我的弹出窗口的代码与 Firebase 给出的示例完全相同,只是我更改了“messageDiv”大小并粘贴到我唯一的 Firebase 网址中。
不知道为什么这不起作用,并希望得到一点帮助!如果我需要更具体,请告诉我。
popup.html
<html>
<head>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
<script type='text/javascript' src='https://cdn.firebase.com/v0/firebase-auth- client.js'></script>
<script src="popup.js"></script>
<link rel="stylesheet" type="text/css" href="https://www.firebase.com/css/example.css">
</head>
<body>
<div id='messagesDiv' style='width:450px'></div>
<input type='text' id='nameInput' placeholder='Name'>
<input type='text' id='messageInput' placeholder='Message...'>
</body>
</html>
popup.js
var messagesRef = new Firebase('https://gluedtogether.firebaseio.com/');
$('#messageInput').keypress(function (e) {
if (e.keyCode == 13) {
var name = $('#nameInput').val();
var text = $('#messageInput').val();
messagesRef.push({name:name, text:text});
$('#messageInput').val('');
}
});
messagesRef.limit(10).on('child_added', function (snapshot) {
var message = snapshot.val();
$('<div/>').text(message.text).prepend($('<em/>')
.text(message.name+': ')).appendTo($('#messagesDiv'));
$('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight;
});