无法将图像上传到Firebase存储
问题描述:
首先,我使用Polymer cli初始化Polymer应用程序抽屉模板,然后将Firebase存储添加到Web应用程序。然后我将文件上传代码添加到其中一个页面(该页面的代码在下面找到)。但是我收到以下错误(这可以防止文件被上传,也不会更新进度条),无法将图像上传到Firebase存储
Uncaught TypeError: Cannot read property 'addEventListener' of null
也
Uncaught TypeError: Cannot read property 'instanceCount' of undefined
这是我的代码。
<link rel="import" href="../bower_components/polymer/polymer.html">
<dom-module id="my-market">
<template>
<style>
:host {
display: block;
padding: 10px;
}
paper-card.top{
margin-top: 8px;
width: 100%;
padding-bottom: 16px;
}
</style>
<paper-card heading="Welcome to the Market!">
<div class="card-content">
<h4>Upload a photo of your item</h4>
<!--uplod image-->
<input type="file" value="upload" id="fileUpload"/>
<progress value="0" max="100" id="uploader">0%</progress>
</div>
</paper-card>
</template>
<script>
//File upload script to Firebase storage
var uploader = document.getElementById('uploader');
var fileButton = document.getElementById('fileUpload');
//File selection listener
fileButton.addEventListener('change', function(a) {
//Get image
var file = a.target.files[0];
//create a storage reference
var storageRef = firebase.storage().ref('images/' + file.name);
//store the image
var task = storageRef.put(file);
//notify the user of upload status
task.on('state_changed',
function progress(snapshot) {
var percentage = (snapshot.bytesTransferred/snapshot.totalBytes)*100;
uploader.value = percentage;
},
function error(err) {
},
function complete() {
}
);
});
</script>
<script>
Polymer({
is: 'my-market'
});
</script>
</dom-module>
我也尝试将Firebase存储的代码放在index.html文件的标记中,但它仍然不起作用。有什么建议么?
答
这是修复。
只需将脚本放入Polymer({})中;功能。
Polymer({
is: 'my-market',
upld: function(a) {
//Get image
var file = a.target.files[0];
//create a storage reference
var storageRef = firebase.storage().ref('images/' + file.name);
//store the image
var task = storageRef.put(file);
}
});
然后为文件输入指定on-change属性为“upld”。
仍然无法正常工作...还有其他想法吗? –
相同的错误讯息? – Carr
是的......任何想法为什么? –