This is my first attempt working with Firebase storage and I'm following this tutorial provided by Firebase:
I've seem to follow the tutorial step-by-step, however, I'm getting the following error and I can't find a solution for it:
firebase-storage.js:3469 Uncaught Error: No Storage Bucket defined in Firebase Options.
at t.ref (firebase-storage.js:3469)
at HTMLInputElement.<anonymous> (myFile.js:18)
When I click on 't.ref' it leads me to the following catch:
catch(error) {
throw new Error(
'Cannot instantiate firebase-storage.js - ' +
'be sure to load firebase-app.js first.'
)
Here's my HTML:
<!doctype html>
<html lang="en">
<head>
<title>...</title>
<link rel="stylesheet" type="text/css" href="stylesheets.css" />
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src=".1.5/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "...",
authDomain: "...",
databaseURL: "...",
projectId: "...",
storageBucket: "",
messagingSenderId: "..."
};
firebase.initializeApp(config);
</script>
<script src=".2.1/jquery.min.js"></script>
</head>
<body>
<nav>...</nav>
<progress value="0" max="100" id="uploader" style="margin-top: 35px;">0%</progress>
<input type="file" value="uploader" id="fileButton" />
<script src="myFile.js"></script>
<script src=".0.0/jquery.min.js"></script>
</body>
</html>
And my corresponding Javascript:
// Get elements
var uploader = document.getElementById('uploader');
var fileButton = document.getElementById('fileButton');
// Listen for file selection
fileButton.addEventListener('change', function(e) {
// Get file
var file = e.target.files[0];
// Create a storage reference
var storageRef = firebase.storage().ref('mover_docs/' + file.name);
// Upload a file
var task = storage.put(file);
// Update progress bar
task.on('state_changed',
function progress(snapshot) {
var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
uploader.value = percentage;
},
function error(err) {
},
function plete() {
}
);
});
I guess my primary question is, is this error occurring since the storageBucket found within the initialize Firebase area has an empty value or am I missing something else?
This is my first attempt working with Firebase storage and I'm following this tutorial provided by Firebase:
https://www.youtube./watch?v=SpxHVrpfGgU
I've seem to follow the tutorial step-by-step, however, I'm getting the following error and I can't find a solution for it:
firebase-storage.js:3469 Uncaught Error: No Storage Bucket defined in Firebase Options.
at t.ref (firebase-storage.js:3469)
at HTMLInputElement.<anonymous> (myFile.js:18)
When I click on 't.ref' it leads me to the following catch:
catch(error) {
throw new Error(
'Cannot instantiate firebase-storage.js - ' +
'be sure to load firebase-app.js first.'
)
Here's my HTML:
<!doctype html>
<html lang="en">
<head>
<title>...</title>
<link rel="stylesheet" type="text/css" href="stylesheets.css" />
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://www.gstatic./firebasejs/4.1.5/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "...",
authDomain: "...",
databaseURL: "...",
projectId: "...",
storageBucket: "",
messagingSenderId: "..."
};
firebase.initializeApp(config);
</script>
<script src="https://ajax.googleapis./ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<nav>...</nav>
<progress value="0" max="100" id="uploader" style="margin-top: 35px;">0%</progress>
<input type="file" value="uploader" id="fileButton" />
<script src="myFile.js"></script>
<script src="http://ajax.googleapis./ajax/libs/jquery/2.0.0/jquery.min.js"></script>
</body>
</html>
And my corresponding Javascript:
// Get elements
var uploader = document.getElementById('uploader');
var fileButton = document.getElementById('fileButton');
// Listen for file selection
fileButton.addEventListener('change', function(e) {
// Get file
var file = e.target.files[0];
// Create a storage reference
var storageRef = firebase.storage().ref('mover_docs/' + file.name);
// Upload a file
var task = storage.put(file);
// Update progress bar
task.on('state_changed',
function progress(snapshot) {
var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
uploader.value = percentage;
},
function error(err) {
},
function plete() {
}
);
});
I guess my primary question is, is this error occurring since the storageBucket found within the initialize Firebase area has an empty value or am I missing something else?
Share Improve this question edited Aug 2, 2017 at 13:58 KENdi 7,7892 gold badges18 silver badges31 bronze badges asked Aug 2, 2017 at 13:39 mur7aymur7ay 8333 gold badges18 silver badges46 bronze badges 1- 1 I noticed I was missing the necessary storage bucket location in the initialization, but I'm trying to figure out the correct path because I'm now getting a 404 error. {code: 404, message: "Not Found. Could not access bucket Buckets/your-storage"} – mur7ay Commented Aug 2, 2017 at 14:10
2 Answers
Reset to default 6What needed to be done is copy the link within the 'storage' tab on your Firebase projected above your empty file. It looks something similar to this:
gs://projectName-ci4w0.appspot./
Now, just remove the gs:// and the last forward slash after .. Place this newly formed link into the rules sections in Firebase for Storage like so:
match /b/projectName-ci4w0.appspot./o {
Finally, place the same new link within the initialization section for Firebase in your code like so:
<script>
var config = {
apiKey: "...",
authDomain: "...",
databaseURL: "...",
projectId: "...",
storageBucket: "projectName-ci4w0.appspot.",
messagingSenderId: "..."
};
firebase.initializeApp(config);
</script>
That's it!
In my case, I simply by inattention added white space at the end of bucket URL. Hope somebody will help this because I spent an half of an hour to find this.
storageBucket: "appname.appspot. "
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745437937a4627695.html
评论列表（0条）