Interacting with RESTful API's via Javascript? - javascript

to start off, I know C++, C#, Python, some Ruby, and basic Javascript. Anyway, my question revolves around how to interact with RESTful API's via Javascript. I haven't been able to find any good examples on various websites, and so I've come here.
So my basic question is: How do I interact with RESTful API's via JS? And where can I find out how to implement OAuth in JS? I know how to get my keys and such, just not how to actually code them in.
Below is an example of a twitter API status update run from my MAC terminal with curl:
curl -u username:password
-d "my tweet"
http://api.twitter.com/1/statuses/update.json
How can I implement this in Javascript (preferably with OAuth authentication)? This would at least start me going in the right direction.
Thanks so much!!

The problem is that you will need to use AJAX to query the remote REST API, and AJAX is only allowed to query resources on the same domain as the page. So, a request to api.twitter.com will fail because it is on a different domain than your server.
To correct this you will need to code your server to make the request to twitter. You can however create your own AJAX stubs that will accept data directly from your page, and then build / send requests to twitter server-side using data supplied by your client.

Generally Justin's approach is the correct one, however if you must have your client script interact with the REST service then you can do it with JsonP. that's JSON data wrapped in a function call.
see this page how to do it
http://www.ibm.com/developerworks/library/wa-aj-jsonp1/

OAuth version 1.0 in JavaScript is a bad idea because you need to expose your application's secret key, by doing so you may be allowing anyone else to impersonate your application. OAuth 1.0 was intended for use with a server under your control. So your users can send their tokens to your server and then you fire off the request to twitter on their behalf.
OAuth 2.0 solves this though twitter does not support it yet.
If you really want OAuth 1.0 you use my plugin: https://github.com/jpillora/jquery.rest and also make the change specified in this GitHub issue

Related

External API access with Ruby blocked by CloudFlare

I am trying to access the HaveIBeenPwned web API for breached sites and emails, but I am being blocked by cloudflare's anti-DDoS protection. I've found that there are ways to get around this with Python and JavaScript, but I haven't been successful with my React/Rails app.
This post has the following quote: "Currently, they check if the client supports JavaScript, which can be spoofed." I haven't been able to find any other documentation of this behavior.
I need this information in the backend, so calling HIBP from the frontend is not ideal. Any idea how to hit the API from Rails?
If they want it to be used on frontend only, using it on backend can be tricky. You will need to create your own wrapper with, for example, puppeteer. And from Rails side execute command that will do some work in background. But keep in mind, it doesn't work very fast (can take up to 5 seconds per request), and it will block your Rails process.
I would start with single node.js app that will accept command-line parameters. Ruby isn't very good at advanced web scraping, so there are no any gentle solutions. Also, keep in mind that you don't have any guarantees. One day it can just stop working.

How to couple django oauth2 with javascript (reactjs) frontend correctly?

I've got a big problem to correctly implement (couple) oauth2 within Django project with Javascript (reactjs) frontend.
As a backend we are using Django server - this server offers some APIs to store or retrieve data from SQL database.
I am following this guide: Django OAuth Toolkit Documentation and using password based grant type (there are three others at disposal).
What is working for me is that I can access server's API calls via command line using curl. That is, I know how to acquire token using URL like example.com/o/token and then I can call some of my APIs with granted token within header as "Authorization: Bearer acquired_token".
I am new to OAuth within little knowledge on this topic so far.
For information:
all the stuff is running within Docker container. Reactjs is build using webpack. Within first request (clean browser cache - no javascript/reactjs available) django server is contacted and it servers index.html page with all the javascript stuff. Then Reactjs is present in browser and runs the Reactjs frontend which makes calls to APIs to get data from database and show them within some tables, etc.
My problem and question is what needs to be done on frontend side (javascript - reactjs) and in what order.
Yet I am also not sure, what to use actually within OAuth - password or authorization token and also what yet needs to be done on backend side.
Last note: I know there are lot of resources on this topic on the world wide web. However, somehow I could not find clear procedure how to deploy it.
Any good piece of advice on this perhaps with pointers to some resources is welcome and appreciated.

Is it possible to authenticate to Microsoft Graph without a server?

I'm trying to create an integration to OneDrive using the Microsoft Graph API. Our app is fully client-side, there's no moving parts on a server, so authentication has to be directly browser to Microsoft.
We have an existing integration with OneDrive that uses the older OneDrive API. That does permit client-flow authentication.
There is an example for AngularJS, but that turns out to require a NodeJS server and have a server-flow authentication, again. NodeJS authentication requires a secret to be passed over, which I obviously can't put in public JS.
I cannot find any examples of authenticating to the graph API without a secret, am I right in saying that client-flow authentication is not supported?
p.s. I have looked at Writing a simple microsoft graph client without using a web server, but this question seems to be asking whether it's possible to make API calls without user interaction, rather than what I'm asking.
If I understand your scenario correctly, you're looking for the implicit grant. I wrote a blog post on using this a while back that might also be helpful.

Securing JavaScript API

I'm currently working on a small JavaScript library which makes requests to a REST web service. Since the server side needs to log incoming request to measure the number of requests, I want to secure it somehow. The library is very similar to the Google Maps API. So my question is now, is there some way to secure it better then just adding an API key to the libraries requests? How can I ensure, if that is even possible, that only the 'right' client uses the key? I guess I could compare the referrer url to a set of valid urls, but this can be spoofed to right? Please keep in mind that is impossible to use some else's authentication method (facebook, google, twitter etc.) since it has to work without user input.
Cheers,
Daniel
A decent RESTful approach would be to require an Authorization header to be supplied by the client, matching some scheme that your server will accept (see Basic Access authentication as an example). Seeing as you only wish to validate that your client is the one making the request, you probably don't need too complex an authorization mechanism.

How to Secure ASP.NET Web API with Cross Domain AJAX Calls?

I want to create an API at www.MyDomain.com that is accessible from public websites www.Customer1.com and www.Customer2.com. These public websites display each customers inventory and do not have any login features. They will use AJAX calls to read data from my API.
How can I secure the API so that it can be accessed via AJAX from different domains but no one can access the API to be able to scrape all of my customers data and all of their inventory?
I have tried thinking of different solutions on my own but they would all either require people to login to the public websites (which isn't an option) or it would require some secret "key" to be displayed publicly in the browser source code which could then be easily stolen.
Any ideas would be greatly appreciated.
Thanks!
P.S. Are their any obstacles that I am going to run into using Javascript & CORS that I need to look into now?
Anything that is accessible without authentication from a browser is by definition insecure, so you can't stop that. Your best bet is to have to have a relationship with the owner of customer1.com and customer2.com - the server apps for those two websites would make an HTTP call to you and authenticate with your service. Going this way also avoids the CORS issues you're talking about.
If you've already designed the client functionality, you can still probably do it without much change to the javascript - have it point to customer1.com for its AJAX call instead of your API, and customer1.com would accept this request and just act as a proxy to your API. Aside from the authentication, the rest of the request and response could just be pass-throughs to your API.
You can use Microsoft.AspNet.WebApi.Cors.
It's just need add ONE line at webapi config to use CORS in ASP.NET WEB API:
config.EnableCors("*","*","*");
View this for detail.
The simplest way to provide a minimum security here is to provide some kind of token system. Each app has its own token, or combination of tokens which it must pass to the server to be verified. How you generate this tokens is up to you and other than being linked to app's access, doesn't have to mean anything.
Provide a way for each API implementer to open an account with you. This way you will know who is accessing what and in some cases you can block/stop service.
For instance, a token can just be an MD5 hash:
7f138a09169b250e9dcb378140907378
In the database, this hash is linked to their account. On each request, they send this token with what they want. It is verified first to be valid, then the request is fore filled. If the token is invalid, then you can decide how to deal with it. Either don't return anything or return an "access denied" (or anything you want).
One thing to avoid is having a single token for everyone, though this can be a starting point. The reason for this is if some unauthorized app gets a hold of this token and exploits it, you have to change the token for everyone, not just the app that somehow leaked the token. You also can't control if someone has access to something or not.
Since you listed ASP.NET, I can also point you to WCF, which is fairly complex but has all the tools that you need to setup a comprehensive web service to service both you and your clients.
I hope this gives you a starting point!
EDIT:
There are security concerns here in the case that someone leaks their token key somehow. Make sure that you setup a way in which the app/your service do not expose the the token in anyway. Also have a flexible way of blocking a token, both by your clients in you, if it so happens that a token is exploited.

Categories