Webpage not loading within custom URL app

Products

• Rally On-Premise
• Rally SaaS

Issue/Introduction

After adding the Custom URL app to a custom page within CA Agile Central, the website defined in the app's settings does not load on the page.  Only a white screen is displayed:

Cause

This could be caused by one (or all) of the issues below:

• The website in question is not accessible via X-Frame/I-Frame.  This is something that is configured by the website. 
• The website is HTTP content, which is inaccessible due to the Block Mixed Content setting in the browser. 
• The website's HTTP header information disallows the page from being loaded outside its originating domain.

Resolution

One can utilize the Web Console to determine what is happening.  Google Chrome's Developer Tools Console has the most descriptive message, so we'll use Chrome to troubleshoot. 

In Chrome: 

1. Navigate to the Custom Page with the Custom URL app

2. Select Chrome's 3 dot icon --> Tools/More Tools --> Developer Tools

3. Select the Console tab:

- Still using Yahoo.com as an example, we can see below, the reason the webpage will not load within the Custom URL app:

Refused to display 'https://www.yahoo.com/' in a frame because it set 'X-Frame-Options' to 'DENY'.

- This means that Yahoo.com cannot be loaded in an X-Frame / I-Frame.  

 

Another setting that could be causing the problem is that your browser is blocking mixed content, meaning it can't display HTTP content from an HTTPS site (like https://rally1.rallydev.com).  By default, mixed content is blocked in Internet Explorer (version 10+), Mozilla Firefox (version 23+) and Google Chrome (version 21+). Generally speaking, bypassing the mixed content block is not recommended. 

You can disable Blocking Mixed Content in your browser by following these steps:  

Internet Explorer

To view mixed content in Internet Explorer:

1. Scroll to the bottom of the screen, and click Show all content.  The page will refresh and display any mixed content.

Mozilla Firefox

To view mixed content in Firefox:

1. At the top of the page, to the left of the address bar, click the shield icon.

2. In the pop-up window that appears, click the down arrow next to "Keep Blocking", and select Disable Protection on This Page. 

3. The page will refresh and display any mixed content. The shield icon will be replaced with a warning symbol to indicate that the page is displaying both secure and non-secure items.

Google Chrome

To view mixed content in Chrome:

1. Click the shield icon on the right side of the address bar.

2. In the icon dialog box, click Load anyway. 

3. The page will refresh and display any mixed content. The URL in the address bar will show https crossed out to indicate that the page is displaying both secure and non-secure items.

 

 

A third potential cause for this error is that the website's HTTP header information disallows the page from being loaded outside its originating domain. If this is the case, the user will see an error in the Console like the example below:

Refused to display 'https://cawiki.ca.com/display/CASupport/Service+Cloud+User+Scripts' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".

Please see the frame-ancestor's directive listed here for more information: https://www.owasp.org/index.php/Content_Security_Policy_Cheat_Sheet#New_in_CSP2.

In conclusion, without changing the header information in the site you want to load within Agile Central, there is no way to load the content from outside the originating domain (using Custom URL app).