[jquery + Firebase] jquery + Firebaseでリアルタイムに変化するWEBページを作成
jquery + Firebaseでリアルタイムに変化するWEBページを作成するには以下のコード
firebaseでtextという項目を作成しておく
<html lang="en">
<head>
<meta charset="utf-8"/>
<script src="https://www.gstatic.com/firebasejs/5.0.4/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "APIKEY",
authDomain: "vauthDomain",
databaseURL: "databaseURL",
projectId: "projectId",
storageBucket: "storageBucket",
messagingSenderId: "messagingSenderId"
};
firebase.initializeApp(config);
</script>
</head>
<body>
<textarea rows="10" cols="60" id='messageInput'></textarea>
<script type='text/javascript'>
var messagesRef = firebase.database().ref('/text');
$( '#messageInput' ).keypress( function ( e ) {
if ( e.which == 13 ) {
submitToFirebase();
$('#messageInput').val('');
}
} );
function submitToFirebase(){
var textMessage = $('#messageInput').val();
messagesRef.push({textMessage});
}
</script>
</body>
</html>
