Accessing the database API directly with client-side JS - javascript

I need to build a simple web front-end which will be mostly used to plot some data fetched from a database. The database (namely, InfluxDB) exposes a HTML API which I could just conveniently call directly from my Javascript front-end. I'm putting login service in front of it (AWS Cognito).
However, once a user logs in, they can easily discover my API endpoints in the client-side code, and therefore make arbitrary queries and possibly abuse it or just steal all my data. How can I avoid it? Is it possible to somehow make the API accessible only to the app's front-end? If not, what is the best practice I should follow here?

I'd suggest maybe creating a Node.js based webservice that would wrap your REST API. Using the Express module it's only a few lines to put together a simple REST service and call out to other APIs.
const request = require('request');
const express = require('express');
const app = express();
app.get("/test", function(req, res, next){
res.status(200).send('Hello World');
});
app.get("/testapi", function(req, res, next){
// Read from another API and return result...
var options = {
url: "https://httpbin.org/ip",
method: "get"
};
request(options, function (error, response, body) {
if (error) {
console.error('error:', error);
res.status(500).send(error.message);
} else {
res.status(200).send(body);
}
});
});
let port = process.env.PORT || 3000;
app.listen(port);
console.log(`Express listening on ${port}..`);

If your InfluxDB is also running on EC2, the fastest and safest approach would be to only allow your web application access to the influxdb instance by limiting it in the security group.
Image that your webapp is running on the default VPC with CIDR 172.31.0.0/16 and that influxdb is running on port 8086. Then simply create a security group with an INBOUND rule that port 8086 can only be reached from inside your AWS account (So IP 172.31.0.0/16) and attach it to your Influx EC2 instance. make sure other inbound rules allowing access to 0.0.0.0/0 are removed.

Related

Origin 'http://localhost:3000' is therefore not allowed access Twitter API

I'm developing a web application that uses the Twitter API REST. I have a page with Twitter accounts and a button for adding a new account. When the button is pressed, the function in the Angular controller is executed:
// Calls token to add a new Twitter user
$scope.callToken = function () {
$http.get('/token')
.then(function (response) {
console.log(response);
});
};
This is the code in the backend to serve de request. It simply redirects to Twitter to add a new user.
// routes.js
var token = express.Router();
token.route('/token')
.get(cuentasCtrl.getToken);
// Account file
exports.getToken = function(req, res) {
twitter.getRequestToken(function(err, requestToken, requestSecret) {
if (err)
res.status(500).send(err);
else {
_requestSecret = requestSecret;
res.setHeader('Access-Control-Allow-Origin', '*');
res.redirect("https://api.twitter.com/oauth/authenticate?oauth_token=" + requestToken);
}
});
};
But I get the next error:
Origin 'http://localhost:3000' is therefore not allowed access Twitter API
My server is running on localhost:3000 and If I put localhost:3000/token in my browser there is no problem. I have read the solutions for using CORS and tested other browsers but it hasn't worked for me. What have i done wrong?
The redirect you are sending in your express response is caught by the http client you use in the frontend and the redirect happens there. You are in a classical CORS situation and of course this is not how you can interact with the Twitter rest APIs.
You have to make http calls to Twitter on the node side (server to server) or use a client side client library for Twitter (https://dev.twitter.com/web/javascript)

Meteor: Get query parameters from url on server? Use case Instagram oAuth

This is easy to do with a client side router or JS on the client. But since window is not an object on the server how would one get a query parameter or even read a url from the server? I checked node examples but couldn't find anything that didn't pertain to express js.
My use case is Instagram, It sends me back a code that needs to be read on the server and then I send a http request with that code from the server to retrieve an access token.
Has to be on page load, not load then send to server via client.
Basically I want to retrieve the query of "code" http://localhost:3000/?code=5e04c2e304f24f8b8380c2ec81202139 on the server.
I read the Instagram instruction for authentication, it seems that you are using the Server-side flow. I do not know why you choose this over the Client-side authentication flow which seems to be more appropriate, I think you should re-consider which method to use. Anyway, to answer your question you could use WebApp package to define a server route in Meteor:
WebApp.connectHandlers.use("/", function(req, res, next) {
if (req._parsedUrl.pathname === '/') {
const code = req.query.code;
console.log(code);
// get ACCESS_TOKEN with code
// if you need to redirect user after authorization
// res.writeHead(302, {
// Location: '/route/after/authorization'
// });
// res.end();
}
// comment this if you redirect to another route
next();
});

Using Express.JS to consume an API

var express = require('express');
var app = express();
var path = require('path');
var api = require('./api');
app.get('/', function(req, res){
res.sendFile(path.join(__dirname + '/index.html'));
})
app.listen(8080)
console.log('Server Running');
I know that we are requiring the express module. We are using the express function, we are requiring the module path and storing the reference in variable path and doing the same with api but beyond that I am a little lost. If I wanted to connect to twitter API how would I go about doing this? Can someone please explain the logic behind it so i can go learn this better and apply it by myself with different API's? I sincerely and greatly appreciate all of your help!
Express is a framework for organising your web application server. You open up certain API's routes to listen on the path and respond to the requests when necessary.
You can open API's only for internal use, i.e. calls from the browser running your app. Or you can expose your API to outer world (for example twitter API is doing that).
To connect to twitter API you need to make an outgoing request from your webserver. There are many ways to go about that, starting from native nodeJS package http https://nodejs.org/api/http.html to much more popular alternative request https://github.com/request/request
One thing to note here is that NodeJS web server are in general less restrictive than other language servers, especially when it comes to organising your app and code architecture. Hence more issues for beginners. Feel free to ask more questions.
Main purpose of app in
var app = express()
is to listen to routes (it is as well used to render pages, adding middleware etc.) and only that.
So assume u have a button on your UI which allows you to connect to twitter API. So on the click you make a GET request to your own server, to /api/twitter/connect .
On your server you listen on this path as follows:
var request = require('request'); //assuming you installed this module
app.get('/api/twitter/connect', function(req, res){
request(TWITTER_API_URL + API_KEYS, function(err, body){
res.json(body); //res is the response object, and it passes info back to client side
});
});
You can use "request" package to send requests. But in case of Cross-Origin-Request you must use "HTTPS" instead of "HTTP". You can configure Your request according to your request type like this..
//Load the request module
var request = require('request');
//Lets configure and request
request({
url: 'https://example.com/abc/demo', //URL to hit
qs: {from: 'example', time: +new Date()}, //Query string data
method: 'GET', // specify the request type
headers: { // speciyfy the headers
'Content-Type': 'MyContentType',
'Custom-Header': 'Custom Value'
},
body: 'Hello Hello! String body!' //Set the body as a string
}, function(error, response, body){
if(error) {
console.log(error);
} else {
console.log(response.statusCode, body);
}
});
Besides this there are others way to do the same. And for twitter you can also checkout the module called "twitter"

Create/configure node.js dispatcher/proxy

I'm working on javascript Single Page Application with Aurelia framework and using simple fake backend(express.js) for prototyping purposes.
Backend runs on localhost:8081 and client app on localhost:9000
There are some Cross Domain issues because these are different ports, and adding cross origin headers to the backend seems cumbersome to me.
What i want is simple dispatcher/proxy that would run on, say, localhost:3000 and redirect incoming calls in this manner (localhost:3000/app => localhost:9000) (localhost:3000/api => localhost:8081) Thus eliminating cross domain issues.
I'm looking for really simple solution, maybe there is some node.js app that suited just for such cases.
If you are using Express, you can add this routes to your app.
You need to install the module 'request' for this example
// At the top
var request = require('request');
And then:
//APP
app.use('/app', function (req, res) { request('http://localhost:9000' + req.originalUrl).pipe(res); });
//API
app.use('/api', function (req, res) { request('http://localhost:8081' + req.originalUrl).pipe(res); });

How can a Node.js library register for HTTP requests on a particular URL path?

I am writing a library for a web service in Node.js. My library needs to handle all HTTP requests with a particular URL prefix (Eg, /_docs/*).
I want people to be able to use my library without changing much of their code.
The API should look something like this:
server = http.createServer(function(req, res) { ... });
...
myLibrary.listen(server, '_docs/');
or
server = new http.Server();
myLibrary.listen(server, '_docs/');
server.on('request', function(req, res) { ... });
If I merely register another event handler on the server object, the user's http request handler will be called on all HTTP requests as well. My code will race with the user's 404 handler.
Socket.io has a similar problem, and they solve it by making their .listen() function move all existing http request handlers into a private array. When HTTP requests come in, if their code doesn't handle the URL it calls the listeners in the array. However, as far as I can tell this wouldn't work in the second example I've shown above.
Whats the best way to make this work?
What about Connect? Router middleware provides rich Sinatra / Express-like routing.
Example
connect.router(function(app){
app.get('/user/:id', function(req, res, next){
// populates req.params.id
});
app.put('/user/:id', function(req, res, next){
// populates req.params.id
});
})
For advanced use look at http://expressjs.com/guide.html#routing.

Categories