none
Can not show third party web page - Same Origin Policy RRS feed

  • Question

  • Hi,

    my app needs to communicate with an external API. In order to do so the user must authenticate/ authorize itself on a third party web page during an oauth handshake.

    How can I redirect to or show this page in my Outlook 2013 web app?

    You can reproduce it with a simple javascript:

    window.location.href = "https://www.google.de"; // take google just as an example for the authorization url

    This does not work within an outlook web app.

    It is not possible due to the x-frame-options sameorigin policy. I don't have that much javascript/ web experience. Can someone please point me in the right direction?

    Thanks!


    • Edited by ___Stefan___ Wednesday, September 24, 2014 12:20 PM
    Wednesday, September 24, 2014 9:49 AM

Answers

  • Hi Codelooper,

    >> As the office app runs within an iFrame there seems to be no way to get this work. This is at least what I found out so far.

    How about opening a pop-up windows for end user to log in as a work around?

    	Office.initialize = function (reason) {
    		$(document).ready(function () {
    			app.initialize();
    
    			displayItemDetails();
    			
    			$('#login').click(function(){
    				window.open('http://www.google.de','','width=800,height=600')
    			});
    		});
    	}; 

    Regards,

    Jeffrey


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by ___Stefan___ Monday, September 29, 2014 11:21 AM
    Monday, September 29, 2014 5:48 AM
    Moderator

All replies

  • Hi Codelooper,

    The recommended way to redirect the app inside the iframe is using the document.location.href method. However, we are aware of an issue where this may not work and you may need to use the following workaround. For example:

    function redirect(uri)
    {
    
    …
        document.location.href = constructRedirectUri(uri);
    
    …
    }
    
    function constructRedirectUri(uri) {
        return domain + location.search + location.hash;
    }

    Please try this out and let us know if it worked!

    -AP

    Thursday, September 25, 2014 8:19 PM
  • Well the redirect itself works. The problem is, that the http header received with the target web page prevents the browser from rendering it within an iframe for security reasons.

    As the office app runs within an iframe there seems to be no way to get this work. This is at least what I found out so far.

    Friday, September 26, 2014 7:50 AM
  • Hi Codelooper,

    >> As the office app runs within an iFrame there seems to be no way to get this work. This is at least what I found out so far.

    How about opening a pop-up windows for end user to log in as a work around?

    	Office.initialize = function (reason) {
    		$(document).ready(function () {
    			app.initialize();
    
    			displayItemDetails();
    			
    			$('#login').click(function(){
    				window.open('http://www.google.de','','width=800,height=600')
    			});
    		});
    	}; 

    Regards,

    Jeffrey


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by ___Stefan___ Monday, September 29, 2014 11:21 AM
    Monday, September 29, 2014 5:48 AM
    Moderator
  • I think the proposed workaround is a way I can go and I will accept it as a solution.

    Thank you two guys for your help!


    Regards

    Codelooper


    Monday, September 29, 2014 11:24 AM