<head>
<script src="https://www.gstatic.com/firebasejs/7.5.2/firebase-app.js">
</script>
<script src="https://www.gstatic.com/firebasejs/7.5.2/firebase-auth.js">
</script>
<script src="https://www.gstatic.com/firebasejs/7.5.2/firebase-database.js">
</script>
<script src="https://www.gstatic.com/firebasejs/7.5.2/firebase-storage.js">
</script>
<script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<input type="file" value="upload" id="fileButton"/>
<progress value="0" max="100" id="uploader">0%</progress>
</body>
</html>
////Inside index.js////
var firebaseConfig = {
apiKey: "***",
authDomain: "***",
databaseURL: "***",
projectId: "***",
storageBucket: "***m",
messagingSenderId: "***",
appId: "***",
};
// Initialize Firebase //
firebase.initializeApp(firebaseConfig);
// Upload File //
var uploader = document.getElementById('uploader');
var fileButton = document.getElementById('fileButton');
fileButton.addEventListener('change', function(e) {
var file = evt.target.files[0];
var storageRef = firebase.storage().ref('files_new/' + file.name);
var task = storageRef.put(file);
task.on('state_changed',
function progress(snapshot) {
var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
uploader.value = percentage;
},
function error(err) {
console.error();
},
function complete() {
console.log('success!');
}
);
});
我在做什么错?文件未上载到存储中,进度条也不起作用。
配置中的所有地址和密钥都正确,因为index.js中的其他功能正在运行,即身份验证
我通过此链接完成了全部操作:https://www.youtube.com/watch?v=SpxHVrpfGgU
我认为引用有误。首先获取存储引用,然后创建一个子代。这是一个有效的示例(至少对我而言):
const storageRef = storage().ref();
const fileRef = storageRef.child(PATHTO/FILE);
const uploadTask = fileRef.put(file);
updloadTask.on('state_changed',
(snapshot) => { /* progress */ },
(error) => { /* error */ },
() => { /* complete */ }
)