前提・実現したいこと
HTML,Javascriptでコメント、画像投稿できるチャット作成をしたいです。
firebaseを使用中
###実現できていること
名前、コメントの欄で記入した内容の登録がチャット形式でできています。
画像もfirebase storageにUPできるのは確認できています。
###解決したい内容
画像投稿をゴールとしているため、storageへのUPされているものをwebサイト上への投稿としたいです。
###画像がfirebase storageにUPされるコード(HTML)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Realtime Database</title> <script defer src="/__/firebase/4.6.1/firebase-app.js"></script> <script defer src="/__/firebase/4.6.1/firebase-storage.js"></script> <script defer src="/__/firebase/init.js"></script> </head> <body> <input type="file" id="file" /> <button id="upload" type="button">アップロード</button></body> </html><script> document.getElementById('upload').addEventListener('click', function() { files = document.getElementById('file').files; image = files[0]; if(files[0].type.indexOf('image') >= 0) { ref = firebase.storage().ref().child(image.name); ref.put(image).then(function(snapshot) { ref.getDownloadURL().then(function(url){ alert('画像をアップロードしました!'); document.getElementById('image').src = url; }); }); } else { alert('アップロードできるのはjpeg、png、gifの画像だけです'); } }); document.getElementById('delete').addEventListener('click', function() { ref.delete().then(function(){ alert('画像を削除しました!'); }); }); </script>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/05/21 06:22