Search code examples
javascriptfirebaseopendata

How can I allow public to view/download data from my firebase?


I'm working on an Open Data Project over at www.openwifinder.com/ . We're using firebase to store the data that we'll load to an ESRI map using javascript. Because we're working with the idea of Open Data, we want the public to be able to download our entire point cloud stored in firebase as a .json file. My team originally copied the link from the "Export Data" Button on the data page, but we've found that the link is temporary due to an expiring auth token in the url. We've also tried linking to the "Instance.firebaseio.com" url, but when you click it (in another browser), it says that you're not authorized to view the firebase.

Ideally, we'd like to do something like Firebase has done with it's Open Data Set page. When you click on those open data urls, you get taken to the data page of the open firebase, and you can't do anything but read and export the data. It doesnt necessarily have to be a public link, but even if the user has to sign up for a firebase account to view the data it would be alright. Of course a true public link would be ideal for our purpose.

Any ideas? I've scoured the help page of the website for clues.

Thanks!!


Solution

  • I couldn't figure out a way to use the API to let the user download the data, so I did it programatically using examples found here and elsewhere on the web. It's been a while since I wrote the following code (and for a project based off of the original OpenWifinder code) so I'm not sure exactly where to attribute it to, but I'm posting my solution here so that if others find this question they can get this working. I'm sure it's not as elegant as using the API, but it works.

    Solution may have come from here, but can't tell if this person got it elsewhere or not: https://gist.github.com/AnirbanKundu/26f2ba229174b1915873

    Export.js:

    // JavaScript Document
    var myFirebase = new Firebase("FIREBASEURL");
    var dataJSON;
    var jsonDL;
    require([
          "dojo/dom", 
          "dojo/on", 
          "dojo/_base/lang", "dojo/domReady!"
        ], function(
        dom, 
        on, 
        lang,
        domReady
        )  {
     var exportDataBtn = dom.byId("exportBtn");
          on(exportDataBtn, "click", JSONToCSVConvertor);
    var exportJSONBtn = dom.byId("dlJSON");
          on(exportJSONBtn, "click", DownloadJSON);
    function DownloadJSON(){
        //console.log(JSON.stringify(dataJSON));
        var jsonString = JSON.stringify(dataJSON, null, 4);
        //console.log(jsonString);
      jsonDL = exportJSONBtn;
      jsonDL.download = "BikeThefts.json";
      jsonDL.href = "data:application/json;charset=utf-8," + jsonString;
      jsonDL.innerHTML = "Download data as JSON";
    };
    var dataObject;
        //this function grabs a 'snapshot' of all the data in Firebase, then navigates down to the 'features' child. It then iterates through all the
        //children under 'attributes' and retrieves all attribute data. Then it converts them to strings or numbers and calls addPoint to map them
    myFirebase.on("value", function(snapshot) {
    dataObject = snapshot;
    dataJSON = dataObject.val();
    //console.log(JSON.stringify(dataJSON));
    
    });
    
    function JSONToCSVConvertor() {
        //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
        var arrData = typeof dataJSON != 'object' ? JSON.parse(dataJSON) : dataJSON;
    
        var CSV = '';    
        //Set Report title in first row or line
        var ShowLabel = true;
        var ReportTitle = "Data";
        CSV += ReportTitle + '\r\n\n';
    
        //This condition will generate the Label/Header
        if (ShowLabel) {
            var row = "";
    
            //This loop will extract the label from 1st index of on array
            for (var index in arrData[0]) {
    
                //Now convert each value to string and comma-seprated
                row += index + ',';
            }
    
            row = row.slice(0, -1);
    
            //append Label row with line break
            CSV += row + '\r\n';
        }
    
        //1st loop is to extract each row
        for (var i = 0; i < arrData.length; i++) {
            var row = "";
    
            //2nd loop will extract each column and convert it in string comma-seprated
            for (var index in arrData[i]) {
                row += '"' + arrData[i][index] + '",';
            }
    
            row.slice(0, row.length - 1);
    
            //add a line break after each row
            CSV += row + '\r\n';
        }
    
        if (CSV == '') {        
            alert("Invalid data");
            return;
        }   
    
        //Generate a file name
        var fileName = "BikeTheftIncidents_";
        //this will remove the blank-spaces from the title and replace it with an underscore
        fileName += ReportTitle.replace(/ /g,"_");   
    
        //Initialize file format you want csv or xls
        var uri = 'data:text/csv;charset=utf-8,' + escape(CSV);
    
        // Now the little tricky part.
        // you can use either>> window.open(uri);
        // but this will not work in some browsers
        // or you will not get the correct file extension    
    
        //this trick will generate a temp <a /> tag
        var link = document.createElement("a");    
        link.href = uri;
    
        //set the visibility hidden so it will not effect on your web-layout
        link.style = "visibility:hidden";
        link.download = fileName + ".csv";
    
        //this part will append the anchor tag and remove it after automatic click
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }
    
    });