Studio Browser is a plugin for Studio which enables browser direct access (rpc) to your services.
If you dont know Studio, you will need to read about it here to unleash the REAL power of micro services in node, it is really easy to use, enforces good practices, and as advantage lets you cluster your application without ANY configuration, real time metrics, and even more. Your services are built to scale since thay one.
To use Studio Browser you also need to add Studio Browser as a dependency to your server side project.
This plugin is really simple to use as it lets you access your server the exact same way you do on server-to-server Studio service call.
Are using Studio or any related project. Let us know, we would love to hear your feedback.
Wants to learn more???? Click here to join our slack channel
You probably already know Studio and how it can help you to create and manage micro services without even thinking about it. You probably already know how to clusterize Studio your services without configuration and all the advantages you can take from a micro services created to be easy to use since they one.
Now its time to take one step further and use a really simple interface to access your services from the browser. Now is time to Studio Browser.
To use Studio browser Client you will need to install add the js file to your html file availabler on browser folder or install through npm using your build process (supports browserify), you can also use rawgit cdn and add the following file to your scripts tag https://cdn.rawgit.com/ericholiveira/studio-browser-client/master/browser/studio-browser-client-with-dependecies.js
Installing from npm:
npm install studio-browser-client --save
Now you're ready to acess your server services from browser.
Here is a hello world example using Studio Browser: To run this example you will need to install Studio ,Studio Browser, socket io and express . Im using express ONLY to deliver the html file.
On your server:
var Studio = require('studio');
var StudioBrowser = require('studio-browser');
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
});
http.listen(3000, function(){
console.log('listening on *:3000');
});
/*
Usually you dont need to pass your own socketIO reference, if you dont pass any, Studio Browser creates it to you
on port 3000. But as we want to deploy everything together we are just sharing the http server between socket io and express.
*/
Studio.use(StudioBrowser({socketIO:io}));
Studio(function sayHello(){
return 'Hello World From Server';
}).browserPublic();
/* Calling .browserPublic() makes your service available for direct access from browser*/
Studio(function somePrivateFunction(){
return 'foo';
});
/* If you dont call .browserPublic() your service cant be accessed directly from browser*/And on your browser you can create the followind index.html file:
<html>
<head>
<title>Studio Browser example</title>
</head>
<body>
<h1 id="result"></h1>
<script src="https://raw.githubusercontent.com/ericholiveira/studio-browser-client/master/browser/studio-browser-client-with-dependecies.js"></script>
<script type="text/javascript">
Studio.use(Studio.plugin.client({ip:'http://localhost:3000/'}));//the server address
var sayHelloService = Studio('sayHello');
sayHelloService().then(function(message){
document.getElementById('result').innerHTML = message;
});
</script>
</body>
</html>Now you just have to run your server with node, and open your browser on http://localhost:3000
Thats it... Is that simple to access your services from the browser... You dont even need to understand what is a request nor anything related. We just handle it to you.
For those interested on contributing or undenstand how the code works checkout our documentation folder.
To build the project you have to run:
npm install
npm test
This is going to install dependencies, lint and test the code
Run test with:
npm test
The MIT License (MIT)
Copyright (c) 2016 Erich Oliveira ericholiveira.com
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.