1

Background We have two web applications hosted on different sub-domains. Application 1 is an internal admin system. Application 2 is a helpdesk system.

We can modify the source code of Application 1 but we have no access to modify Application 2.

The Goal To display a link against an order in Application 1 that will open a new window, the URL of which is that of a ticket in Application 2.

The idea being that our staff can see that an order has a helpdesk ticket raised against it and simply needs to click a link on the order to view the ticket and reply to it.

The problem Regardless of how I open the new window (window.open, target="_blank", etc.) the ticket in the new window is unable to make any ajax requests back to the helpdesk system where it is hosted.

The URL of the new window is part of Application 2.

In Google dev tools it tells me "The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "https". Protocols must match." even when I open it using _blank.

If I go to the exact same URL manually everything works... but this doesn't help when I need it to work from the link.

Is there any way to achieve the above?

If not, is there any way I can open a new window that is "detached" from the window that opened it so that same origin policy no longer applies?

Edit 2014-03-28 10:23 I have no access to App2's code at all. I cannot make any changes to App2. Any answer must take this into account.

I am trying to open a new window from my application (App1) where the target URL of that window is a page in App2. That page inside App2 then needs to be able to use ajax to communicate with other areas of App2. This is where the problem lies. Because App1 opened the window the same origin policy is preventing that window from making it's ajax requests.

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
Hades
  • 1,975
  • 1
  • 23
  • 39
  • That application 2, is the helpdesk system? Or the helpdesk system is in another application? Also, I understand that you are able to open the new window, the problem is that the page in the new window can't make a succesful AJAX request to the helpdesk system. Did I understand it correctly? – Oscar Paz Mar 20 '14 at 11:51
  • App2 is the helpdesk. Also, there is no SSL on App2. Yes you understood correctly. – Hades Mar 21 '14 at 12:01
  • duplicate: http://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy – Quentin Mar 27 '14 at 21:52
  • @Quentin this is not a duplicate, it's a very specific question and none of the answers in the post you linked can work in this case because I have no access to the code for app2 – Hades Mar 28 '14 at 10:31
  • This doesn't make sense. If you open a new window from a link or script then that page should work as normal. There is something else happening here. – Parris Mar 28 '14 at 17:46
  • App2 is smarter track enterprise edition. App1 is in-house. All app1 is doing currently is window.open with the target url being the url for a specific ticket. The ticket page has lots of Ajax. Chrome dev tools show the same origin error. Opening the exact same url manually sees everything working. – Hades Mar 29 '14 at 23:36
  • I've also tried using a standard hyperlink with `target="_blank"` and get the same origin error there too. – Hades Apr 01 '14 at 11:11

5 Answers5

2

You could use a proxy server or iframe proxying.

sergiu
  • 389
  • 1
  • 7
2

I suspect that JavaScript on the second (helpdesk) app is trying to access the first app via window.opener (which could lead to the cross-origin error you're seeing) and subsequent JavaScript (fetching stuff via AJAX) is then not getting executed. You can probably narrow things down by setting appropriate breakpoints in the second app.

If this is the cause and you can't modify the source for the helpdesk app, how about going to a URL in the internal domain that would then redirect to the help desk? The redirect should cause the window.opener property to become null (same as manually typing in the URL).

Assuming https://admin.mydomain.co.uk and http://helpdesk.mydomain.co.uk, clicking on the "Help Ticket" link would go to a URL in the internal app, e.g. https://admin.mydomain.co.uk/getHelp?ticketId, which would respond with a 301 response and an appropriate Location: http://helpdesk.domain.uk/help/ticketId header taking the user to the actual helpdesk URL.

Stepan Riha
  • 1,736
  • 14
  • 12
0

Use the following url //app2.mydomain.co.uk without the http or https.

dingdong
  • 169
  • 10
0

It's not only a cross domain problem but a protocol issue : You can't embed https into http page without this warning.

Consider using iframe inside your App1 :

<iframe src="https://app2.mydomain.co.uk" ></iframe>

Or maybe you can use CORS to access data between your two domains ( but i think it's not the point, you want the whole App2 page, isn't it ? )

Edit : By re-reading your question, i'm pretty sure of two thing :

  • You're not looking at the right direction. You say App2 don't use SSL, and that obviously false when Chrome say "Protocols must match"
  • It's not a "attach" or "detached" problem. If you put a link (blank or not) in a page, it can be load the new page without any problem, nor link with the referal page.

So my guess is : Your are calling App2 without SSL ( no https), BUT inside the App2, there is some https involved ( certainly some ajax query). So here is the problem : When you open the page without https, it's seem to load, but when the first https Ajax fires, it fail.

Try using https when calling your App2 url, and give us the result

CtrlX
  • 6,946
  • 1
  • 17
  • 21
  • App2 has no SSL on it. IIS has no SSL bindings and we have no SSL certificate for that site. I've tried the simplest case of a standard hyperlink similar to this: `View Ticket`. If I open the URL directly in the address bar then the ticket loads and the dropdown menus are populated (via ajax). If I click the link from the page rendered by App1 then although the ticket loads none of the dropdowns have any members, the ajax doesn't work and I see the error message in chrome. – Hades Apr 01 '14 at 11:08
  • In the "Network" panel of the Chrome debugger, you can see all AJAX call inside your App2. So after you see your error message, can you look at the panel and find the AJAX call that fire it ? If so, give us what it says about "Request URL" and "Request Method" and "Form Data". It will be a good start because for now, it's like searching in the fog... – CtrlX Apr 02 '14 at 17:32
0

My solution is this: in Application 1 you create a method your method that calling Application 2 on the server side, then you can use AJAX calling your method which will return result of Application 2.

Will Wang
  • 537
  • 5
  • 7