Debug gwt inside facebook iframe

Question

I'm trying to debug my gwt 2.0 apllication that runs inside facebook iframe.

When i use 'http://127.0.0.1:8888/index.html?gwt.codesvr=127.0.0.1:9997' as "Canvas Callback URL" my app doesn't loading, but when i compile it and use 'http://127.0.0.1:8888' it works perfectly.

Answer 1

127.0.0.1 is a reserved IP address that always resolves to localhost. So when you enter that as a Facebook canvas URL, Facebook tries to access it's own servers. A request never comes to your computer, which is where the application is actually hosted. Of course, when you access it at 127.0.0.1, it works fine, because your localhost is your own machine.

You need to figure out your external IP address, and enter that as the Canvas Callback URL. You can check your router settings, or go to something like http://www.whatismyip.com/. Once you have it, try accessing your application using it directly instead of 127.0.0.1. You might have to change your router or firewall to allow port 8888 through. Once you have it working, enter it as your Canvas Callback URL in your Facebook application settings.

Answer 2

There is a cross site scripting issue with using the GWT debugger within the facebook iframe. I logged this as issue #4468 http://code.google.com/p/google-web-toolkit/issues/detail?id=4468

Within that ticket, I specified the workaround is to edit the hosted.html file thusly:

hosted.html
gwtOnLoad = function(errFn, modName, modBase){
....
  var topWin = window.top;
  var url = topWin.location.href;
...

Workaround if you have one:

  var topWin = window;
  var url = topWin.location.href;