Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Publish data from browser app without writing my own server

I need users to be able to post data from a single page browser application (SPA) to me, but I can't put server-side code on the host.

Is there a web service that I can use for this? I looked at Amazon SQS (simple queue service) but I can't call their REST APIs from within the browser due to cross origin policy.

I favour ease of development over robustness right now, so even just receiving an email would be fine. I'm not sure that the site is even going to catch on. If it does, then I'll develop a server-side component and move hosts.

like image 385
Drew Noakes Avatar asked Nov 13 '12 21:11

Drew Noakes


1 Answers

Not only there are Web Services, but nowadays there are robust systems that provide a way to server-side some logic on your applications. They are called BaaS or Backend as a Service providers, usually to provide some backbone to your front end applications.

Although they have multiple uses, I'm going to list the most common in my opinion:

  • For mobile applications - Instead of having to learn an API for each device you code to, you can use an standard platform to store logic and data for your application.

  • For prototyping - If you want to create a slick application, but you don't want to code all the backend logic for the data -less dealing with all the operations and system administration that represents-, through a BaaS provider you only need good Front End skills to code the simplest CRUD applications you can imagine. Some BaaS even allow you to bind some Reduce algorithms to calls your perform to their API.

  • For web applications - When PaaS (Platform as a Service) came to town to ease the job for Backend End developers in order to avoid the hassle of System Administration and Operations, it was just logic that the same was going to happen to the Backend. There are many clones that showcase the real power of this strategy.

All of this is amazing, but I have yet to mention any of them. I'm going to list the ones that I know the most and have actually used in projects. There are probably many, but as far as I know, this one have satisfied most of my news, whether it's any of the previously ones mentioned.

Parse.com

Parse's most outstanding features target mobile devices; however, nowadays Parse contains an incredible amount of API's that allows you to use it as full feature backend service for Javascript, Android and even Windows 8 applications (Windows 8 SDK was introduced a few months ago this year).

How does a Parse code looks in Javascript?

Parse works through classes and objects (ain't that beautiful?), so you first create a specific class (can be done through Javascript, REST or even the Data Browser manager) and then you add objects to specific classes.

First, add up Parse as a script tag in javascript:

<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.1.15.min.js"></script>

Then, through a given Application ID and a Javascript Key, initialize Parse.

Parse.initialize("APPLICATION_ID", "JAVASCRIPT_KEY");

From there, it's all object manipulation

var Person = Parse.Object.extend("Person"); //Person is a class  *cof* uppercase *cof* 
var personObject = new Person();
  personObject.save({name: "John"}, {
  success: function(object) {
    console.log("The object with the data "+ JSON.stringify(object) + " was saved successfully.");
  },
  error: function(model, error) {
    console.log("There was an error! The following model and error object were provided by the Server");
    console.log(model);
    console.log(error);
  }
});

What about authentication and security?

Parse has a User based authentication system, which pretty much allows you to store a base of users that can manipulate the data. If map the data with User information, you can ensure that only a given user can manipulate specific data. Plus, in the settings of your Parse application, you can specify that no clients are allowed to create classes, to ensure innecesary calls are performed.

Did you REALLY used in a web application?

Yes, it was my tool of choice for a medium fidelity prototype.

Firebase.com

Firebase's main feature is the ability to provide Real Time to your application without all the hassle. You don't need a MeteorJS server in order to bring Push Notifications to your software. If you know Javascript, you are half way through to bring Real Time magic to your users.

How does a Firebase looks in Javascript?

Firebase works in a REST fashion, and I think they do an amazing job structuring the Glory of REST. As a good example, look at the following Resource structure in Firebase:

https://SampleChat.firebaseIO-demo.com/users/fred/name/first

You don't need to be a rocket scientist to know that you are retrieve the first name of the user "Fred", giving there's at least one -usually there should be a UUID instead of a name, but hey, it's an example, give me a break-.

In order to start using Firebase, as with Parse, add up their CDN Javascript

<script type='text/javascript' src='https://cdn.firebase.com/v0/firebase.js'></script>

Now, create a reference object that will allow you to consume the Firebase API

var myRootRef = new Firebase('https://myprojectname.firebaseIO-demo.com/');

From there, you can create a bunch of neat applications.

var USERS_LOCATION = 'https://SampleChat.firebaseIO-demo.com/users';
var userId = "Fred"; // Username

var usersRef = new Firebase(USERS_LOCATION);
  usersRef.child(userId).once('value', function(snapshot) {
    var exists = (snapshot.val() !== null);
    if (exists) {
        console.log("Username "+userId+" is part of our database");
    } else {
        console.log("We have no register of the username "+userId);
    }
  });

What about authentication and security?

You are in luck! Firebase released their Security API about two weeks ago! I have yet to explore it, but I'm sure it fills most of the gaps that allowed random people to use your reference to their own purpose.

Did you REALLY used in a web application?

Eeehm... ok, no. I used it in a Chrome Extension! It's still in process but it's going to be a Real Time chat inside a Chrome Extension. Ain't that cool? Fine. I find it cool. Anyway, you can browse more awesome examples for Firebase in their examples page.


What's the magic of these services? If you read your Dependency Injection and Mock Object Testing, at some point you can completely replace all of those services for your own through a REST Web Service provider.

Since these services were created to be used inside any application, they are CORS ready. As stated before, I have successfully used both of them from multiple domains without any issue (I'm even trying to use Firebase in a Chrome Extension, and I'm sure I will succeed soon).

Both Parse and Firebase have Data Browser managers, which means that you can see the data you are manipulating through a simple web browser. As a final disclaimer, I have no relationship with any of those services other than the face that James Taplin (Firebase Co-founder) was amazing enough to lend me some Beta access to Firebase.

like image 144
jjperezaguinaga Avatar answered Sep 26 '22 08:09

jjperezaguinaga