I'm using the Firebase JS API in my trigger.io app.
My app must be able to start up and operate in Airplane Mode. Would it be acceptable for me to reference a local copy of the Firebase JS file, or must this always be loaded from the CDN url?
Alternatively, is there a way the file could be cached locally and requested on a scheduled basis to get the latest version, or is there another mechanism I should use that I'm missing out on.
If you referenced a local copy of the firebase.js lib, it would work as well as the remote copy, at least initially. Since Firebase is in beta, changes can be pushed to that lib at any time, making your local copy obsolete.
Utilizing a local copy wouldn't, by itself, solve the issue you are hoping to address. While Firebase will survive temporary outages and spotty coverage, there is no locally stored copy of the data, so you'll need to either connect to Firebase initially and obtain that data, or use set() to create some sort of local default if offline.
More robust offline support is on the Firebase road map.
Some additional and very informative reading can be found here:
using firebase on offline networks
Does Firebase allow an app to start in offline mode?
How to sync offline database with Firebase when device is online?
Related
I am building an application using ReactJS. I am trying to find out how to store data and to edit it. I tried to store it on my computer with 'fs, 'browserify-fs' but it didn't work.
Should I use express, or is there any other alternatives ?
If you are using React you are operating in the browser. Your option for storage is in local storage. This is explained here.
Examples of code are:
// setter
localStorage.setItem('myData', data);
// getter
localStorage.getItem('myData');
// remove
localStorage.removeItem('myData');
// remove all
localStorage.clear();
Note this is stored in the browser and can be easily cleared. You are going to realize that you need a back end solution. This is a server you can send requests to which has an API (a place you send requests to) which executes some form of operation (normally CRUD - Create Read Update Delete via a REST endpoint or GRAPHQL) to serve you back the data you are requesting from a database (MySQL, Postgres, MongoDB). This is a whole different discussion.
To store an array in local storage you will need to make it a string via JSON.stringify. An example would be:
localStorage.setItem("array", JSON.stringify(array));
In developer tools in Chrome you can go to Application -> Storage -> Local Storage and see what is saved. Here is an example:
If you want to share the data along multiple clients you should use server-side solution or if you just want to save the data for a client only you could use client-side solution provided by #diesel.
Create your own web-server
You need to create web server and a database to store your data. Database is used to store data. You could use: MySQL, PostgreSQL, SQLite3, MongoDB, ... You also need to create web service to make secure database calls.
To create web server you could use Express.js to write your web server easily.
Headless Content Management Systems (abbr: CMS)
If you don't want to spent time on creating your own web-server you could install a headless CMS to read/write your data using api endpoints provided by CMSs. Here's list of headless CMS softwares: headlesscms.org. I tried strapi which has lots of features you might need.
Here's some strapi features:
Open-source
Model builder
Extensible (plugin support)
Content editor (eg: to edit articles)
and many more
Firebase
If you don't want to spend your time on installing CMS software to your server and maintaining it regularly you could use Database service provided by Google Firebase. It is also feature rich too. Here's some features supported by Firebase.
NoSQL Database (to store your data)
Authentication (to authenticate users)
Storage (to store files)
Functions (to write serverless functions)
Machine Learning
and many more
I want to upload file into folder from which my Angular app is served while running on localhost. I'm not able to find any solution without using backend.
For example I just want to upload an image file and that file should copy in specified folder of the project. This should be done only with Angular without using any Backend script or hitting any API endpoint.
Depending on your webhost, you can make your assets-folder accessible via FTP.
Making a FTP-call from javascript (angular is javascript) isn't that difficult. And there are plenty of example and questions about it on the internet (like this)
Why you wouldn't do that:
The credentials for your ftp-connection will be accessible in the compiled javascript-code. With a little bit of effort, everyone can find it.
Each gate you open through the webhosts firewall, is a extra vulnerability. Thats why everybody will recommend you to add an API endpoint for uploading files so that you keep holding the strings of what may be uploaded.
Edit:
As I read your question again and all the sub-answers, I (think) figured out that you are building an native-like app with no back-end, just an angular-single page front-end application. An I can understand why (you can run this on every platform in an application that supports javascript), but the problem you are encountering is only the first of a whole series.
If this is the case, I wouldn't call it uploadingas you would store it locally.
But the good news is that you have localstoragefor your use to store temporary data on the HDD of the client. It isn't a very large space but it is something...
The assets folder is one of the statically served folders of the Angular app. It is located on the server so you can't add files to it without hitting the server (HTTP server, API, or whatever else...).
Even when running your app on localhost, there's a web server under the hood, so it behaves exactly the same than a deployed application, and you can't add files to the assets folder via the Angular app.
I don't know what exactly you want to do with your uploaded files, but:
If you want to use them on client side only, and in one user session, then you can just store the file in a javascript variable and do what you want with it
If you want to share them across users, or across user sessions, then you need to store them on the server, and you can't bypass an API or some HTTP server configuration
Based on your clarification in one of your comments:
I'm trying to develop a small speed test application in which user can upload any file from his system to check upload and download speed.
The only way to avoid having you own backend is to use 3rd party API.
There are some dedicated speed test websites, which also provide API access. E.g.:
https://myspeed.today
http://www.speedtest.net
https://speedof.me/api.html
Some more: https://duckduckgo.com/?q=free+speedtest+api
Note, that many of these APIs are paid services.
Also, I've been able to find this library https://github.com/ddsol/speedtest.net, which might indicate that speedtest.net has some kind of free API tier. But this is up to you to investigate.
This question might also be of help, as it shows using speedtest.net in React Native: Using speedtest.net api with React Native
You can use a third party library such ng-speed-test. For instance here is an Angular library which has an image hosted on a third party server (ie GitHub) to test internet speed.
I have a web page that usually suppose to work offline.(without internet connection).
Once a while it's need to connect to the web and grab some data to be used offline.
I'm searching for a way to store the data locally while it connected and still have an access to the data offline.
I checked local storage and the FileSystem-API but both are follows the Same Origin Policy.
Any suggestion will be appreciate
When I was creating offline application to sync with online version I had some JSON file with required information instead of LocalStorage.
Work flow:
User requests new files to be generated (a.k.a. sync with server) using some online interface.
Generate JSON file with needed data and save it along offline files.
User downloads new files and replaces it with old ones.
Offline JS reads JSON file and gets all information.
We were using some JAVA installer (launch4j to generate .jar files and IzPack to make installer)
Firebase storage is based on Google Cloud Platform which allows versioning of files.
In the Firebase console there are no options regarding the GCP bucket, and when accessing the GCP console, there doesn't seem to be a way on enabling versioning in the bucket pertaining to the Firebase project.
Also, the Firebase SDK does not mention how to access previous versions of files even if versioning was enabled.
Is versioning possible with Firebase Storage?
Firebase Storage is built on GCS so many of the features of GCS can be accessed via Firebase Storage. Firebase Storage also shares a GCS bucket named <project-id>.appspot.com (or similar), that can be accessed via both the Firebase console and the Cloud console.
You can enable object versioning on your bucket by using the gsutil tool (probably the easiest way) like so:
gsutil versioning set on gs://<project-id>.appspot.com
That said, there's no way of using the Firebase Storage clients to retrieve anything other than the most recent version. This was intentional, since Firebase Storage provides a simpler, mobile focused subset of the GCS APIs, and we didn't have a super compelling use case for providing an intuitive object versioning story for mobile. Per user data backups (initiated by the user without dev intervention), and document diffs are the two I can think of, but if you've got another, we'd love to hear it :)
We anticipate that a majority of devs will turn this on in order to prevent deletions from being permanent (and indeed, we mention doing this in our delete docs), and will thus use tools like gsutil or their own custom backends to retrieve and restore the appropriate files.
EDIT 10/1: Since these use cases have become more common, we've updated our docs to include more things you can do with Google Cloud Platform in our GCP Integration guide.
After Object Versioning enabled its possible to listing noncurrent object versions.
Get previous object version:
Long previousGeneration = ...;
byte[] previousContent = bucket.getStorage().get(BlobId.of(bucket.getName(), objectName, previousGeneration)).getContent();
I'm planning to create a simple gadget to create a TO DO list application. This is just for practice and to explore Windows Gadget. How can I store the values in the database? As much as possible, I don't want to set up a local http handler file to be a means to store value to file or database.
Note: I tag this with html and javascript since I'm aware it uses such.
Once installed, gadgets run with all the permissions of the logged in user. So you should be able to access the local file system and instantiate COM objects such as ADO to connect to a database.
The chap here wrote a gadget settings persistence manager to allow gadgets to save their settings between being uninstalled and re-installed in the sidebar. He uses the Scripting.FileSystemObject to write out settings to a file:
http://channel9.msdn.com/playground/Sandbox/231595/
This is also worthwhile reading to understand gadget security:
http://msdn.microsoft.com/en-us/library/aa965881(VS.85).aspx