how to upload file in firebase storage code example

Example 1: How to get the date and time when uploading image to firebase?

You can use ServerValue.TIMESTAMP provided by the Firebase database server and
store it in a new timestamp field in your database along with the url and
description fields for each image. The Firebase servers write the current
timestamp in UTC milliseconds in place of this value when performing writes. 
This value is a 13-digit numeric value.

 mDatabaseRef.child(uploadID).child("timestamp").setValue(ServerValue.TIMESTAMP);

Example 2: file upload html firebase

<!DOCTYPE html>
<html>
<head>
	<title>Firebase Web Basics</title>

	<link href="https://fonts.googleapis.com/css?family=Raleway:300,400,500,700" rel="stylesheet">

	<script src="https://use.fontawesome.com/939e9dd52c.js"></script>

	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

	<div class="mainDiv" align="right">
		<h1 align="left">Firebase File Upload</h1>
		<progress id="uploader" value="0" max="100">0%</progress>
		<input type="file" id="fileButton" value="upload"/>
	</div>



<script src="https://www.gstatic.com/firebasejs/3.7.4/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
    apiKey: "******************************",
    authDomain: "******************************",
    databaseURL: "******************************",
    storageBucket: "******************************",
    messagingSenderId: "******************************"
  };
  firebase.initializeApp(config);
  //-------------------------------------
  
  var uploader = document.getElementById('uploader');
  var fileButton =         document.getElementById('fileButton');
  fileButton.addEventListener('change', function(e){
  var file = e.target.files[0];
  var storageRef = firebase.storage().ref('img/'+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) {


  },function complete() {

  });
});  
  
  
</script>

<script src="fileup.js">
</script>
</body>
</html>

Tags:

Html Example