0

I am attempting to develop a bookmarklet that scrapes the user's current web page and stores some data pulled from it. On my own website, my users sign in via the Facebook API.

When my bookmarklet is used, I can successfully present the Facebook login modal, but on sign in the API throws an exception:

The specified URL is not owned by the application.

I am new to this, but presumably this is because the current page that the bookmarklet is accessed from doesn't match my own domain?

I am running the javascript from an external file that is hosted on that domain - should that not suffice?

Alternatively, how might I get address this? Unfortunately I can not offer my own account management functionality and am relying on Facebook for my user management.

Any explanations and creative ideas are appreciated.

Ben Packard
  • 26,102
  • 25
  • 102
  • 183
  • _“I am running the javascript from an external file that is hosted on that domain - should that not suffice?”_ – No. Because that’s only where you _load_ the script from, but it gets _executed_ in the context of the current document. – CBroe Mar 06 '13 at 01:02
  • I see, thanks. Maybe I need to somehow scrape the data, open up a new tab on my domain (ugh) and submit from there? Hopefully someone will suggest something more elegant. – Ben Packard Mar 06 '13 at 01:03

1 Answers1

0

The solution is to host the login step on your own domain within in an iframe on the current page, or in a new tab or new popup window. Anything less would be far too insecure anyway.

Possible steps:

  1. Bookmarklet runs and scrapes data.
  2. Bookmarklet creates iframe with src="http://yourdomain.com/bookmarklet-widget?data=...."
  3. If not logged in already, the widget content page requires a login step first.

If the data is to large to submit with GET, you can use POST. Steps would be like

  1. Bookmarklet runs and scrapes data.
  2. Bookmarklet creates empty iframe with name like "mywidgetframe".
  3. Bookmarklet creates form with method=post target=mywidgetframe and action="http://yourdomain.com/bookmarklet-widget"
  4. Bookmarklet submits the form.
  5. If not logged in already, the widget content page requires a login step first.

If you need direct communication between the iframe/window and the current parent page, check out http://enable-cors.org/

DG.
  • 3,417
  • 2
  • 23
  • 28
  • Thank you this was very helpful. I also found the following link useful http://kathrynbrisbin.blogspot.com/2010/01/how-to-create-bookmarklet-like.html – Ben Packard Mar 06 '13 at 22:02
  • Your link made me notice a mistake I made. The enable-cors link I shared is not about cross-site iframe communication. It is about enabling cross-site AJAX. For cross-site iframe comm, check out the function "postMessage". In the link you shared, he/she is using an older out-dated technique within "giftyHandleMessage". For very simple cases it can be fine. It has advantage of working in older browsers but it has disadvantages as well, such as potentially breaking web pages that use the hash fragment for storing state. – DG. Mar 07 '13 at 05:34