5

I am working on a javascript widget that will allow users to sign-up for a list. This widget will be embeddable on customer websites. Because it is all client-side driven, minus the requests back to the server. I've been trying to come up with ways to make the widget "secure" in essentially a way to limit the widget to be loaded on only approved sites.

Google Maps seems to be able to use the key they provide to you to do a look-up of the site loading the map. Something to that effect would be perfect.

Widget design: Javascript inserts HTML into DOM. Also adds an iframe element. The iframe loads the form from my site to handle the requests. A key is passed to iframe URL to load the form settings.

Not really looking for code, pseudo code is perfect, just lost on the technique.

Seth
  • 659
  • 2
  • 7
  • 21

1 Answers1

0

Your web server would serve the widgets via a GET request, and would expect a key=xyz parameter to be passed. Your server would check that the key is valid before returning the widget response.

The problem is that the customer would need to send the key from the JavaScript on his client's machine. Therefore, all of your customer's clients will know the customer's key. This means it is unreasonable to expect your customers keep their key a secret.

I believe what Google Maps does is it associates each key with a domain. If you are embedding the widgets in an iframe, you should be able to check the Referer header to check that indeed this request is coming from the customer's website, and not some other website that ripped off the customer's key.

That seems quite secure (it would not be possible for any other website to host your widgets without paying for a key). The only remaining question is: what use is the key at all? Why not just use the Referer to authenticate the sites that are allowed to access the widgets, and not make them go through the hassle of providing a key. I can't seem to think of a reason it is needed. Perhaps someone can think of it in the comments.

mgiuca
  • 20,958
  • 7
  • 54
  • 70
  • Generating a key from the host's details and automatically providing/generating it as part of the code they add to their sites is good when you want people to request and use the widget through automated interfaces etc. Then you don't have to be too concerned with who is using the widget but rather that they went through the correct steps to be able to use it. You can thus capture additional info about the hosts initially? – David 'the bald ginger' Jul 29 '11 at 14:52
  • 1
    Referer cannot be used as a security feature, it is an optional header and every client can tamper it – CLod Sep 20 '13 at 03:24
  • 2
    Right, the client can tamper with the Referer header, but it is not possible for a web page to change the Referer header sent by the browser to an embedded iframe. Since the question is about preventing other _sites_ from embedding the widget without permission, checking the Referer should be secure against that. – mgiuca Sep 20 '13 at 21:35