/ cloudforms 3.x

Menu Plugins for External Sites on CFME


A recent customer expressed the desire to have external web pages framed up inside of the CFME UI. This is a new feature, and a little rough around the edges, but it works nicely if you can avoid some small issues. The following is quick write up on how we got it working, summarized from existing resources and supplemented by our own experiences.

The Basics

What we're after is basically this:


That little "External" menu section. You can name it what you want and fill it with what you want; you could also make multiple sections, but the following steps will make one External menu section and fill it with a link to Red Hat Satellite, Horizon, and Zabbix links.

For this we need to create two directories and some files. Create the following directories:

# mkdir /var/www/miq/vmdb/product/menubar
# mkdir /var/www/miq/vmdb/db/fixtures/miq_product_features

The first file we need defines the section, which is the "External" tab in the picture above. We named ours external_section.yml. This should go in the menubar directory you just created.

type: section
name: External
id: external_menu
feature: external
  feature: external
section_type: big_iframe

You'll often see an additional "href" line in other examples, we'll talk about this later.

Now that we have a tab, we need to fill it with links. The following files will create links to Red Hat Satellite, OpenStack Horizon, and Zabbix, but they could be anything. These also go in the menubar directory.

Red Hat Satellite: (external_item_satellite.yml)

type: item
name: Satellite
id: external_satellite
feature: external_satellite
  feature: external_satellite
parent: external_menu
item_type: big_iframe

OpenStack Horizon: (external_item_horizon.yml)

type: item
name: Horizon
id: horizon
feature: horizon
  feature: horizon
parent: external_menu
item_type: big_iframe

Zabbix: (external_item_zabbix.yml)

type: item
name: Zabbix
id: external_zabbix
feature: external_zabbix
  feature: external_zabbix
parent: external_menu
item_type: big_iframe

Now we need to create a menu file that references all the items we've created so far. This will go in the miq_product_features directory. We named ours menu_external.yml.

:name: External
:description: Access to External Links
:feature_type: node
:parent: everything
:identifier: external
- :name: Satellite
  :description: pub directory on satellite
  :feature_type: node
  :identifier: external_satellite
- :name: Zabbix
  :description: Zabbix UI
  :feature_type: node
  :identifier: external_zabbix
- :name: Horizon
  :description: Horizon Console
  :feature_type: node
  :identifier: horizon

That's it for new files. Now we just have to make a quick adjustment to an existing one. Add the line:

iframe, .iframe { width: 100%; height: 100% }

to the bottom of the file: /var/www/miq/vmdb/app/assets/stylesheets/patternfly_overrides.less

After changing that we'll need to clean out and precompile the rails assets, so navigate to the vmdb directory using the handy, out of the box alias for 'cd /var/www/miq/vmdb':

# vmdb

and then clean and precompile your assets

# RAILS_ENV=production rake assets:clean
# RAILS_ENV=production rake assets:precompile

The fix for this is already upstream, so this step shouldn't be necessary for long. For more context you can look at this bugzilla.

Now we need to restart the service:

# service evmserverd restart

Those are the basics, and after that you might see some working links. The following sections discuss some of the troubleshooting we did to make some of the others work.

The href Property

The section file, (the one with the line "type: section") can take an href property. This creates a link that will get followed when you click the top menu, e.g. the "External" tab. I've seen this property referred to as required. It's not. Here are some thoughts on this:

  • If you follow the convention maintained with the rest of the section items, clicking it will take you to the first item in the drop down list. (e.g. Automate takes you to "explorer", Infrastructure takes you to "providers".) But in this case it doesn't really flow that External should take you to Red Hat Satellite (or whatever you put on top), so that was a little confusing.
  • If you leave the href property for the section blank, that's what you'll get if you click it. A blank white page. To the untrained eye, this could be disconcerting.

Ultimately we left it blank and just avoided clicking it. Down the road as this feature evolves, it would be nice to see a simple splash page listing all the menu items along with the descriptions we provide in the menu file. I'm not sure if those descriptions are being used for anything at the moment, but this could be a good use for them.


If you look around in some other examples you'll see that it's required to have https links. The astute reader will also notice that some of the links above are http. Before your worldview collapses from this apparent inconsistency, we should note that everything *should* be on https, but for our demo we needed to include the customer Horizon and Zabbix, which they ran over http. It's not really a CloudForms problem to get this to work, it's a browser issue. More specifically, your browser is doing it's job and not allowing you to pop a http frame inside of a https connection to protect against nasty man in the middle attacks. For POC and demo purposes, if you need to do this, most browsers have an insecure mode you can run that won't block this. For Chrome on fedora for example you can run:

google-chrome --allow-running-insecure-content

Satellite and X-Frames

Satellite 6 won't work immediately. This is because Satellite has an X-FRAME restriction of SAMEORIGIN. This is the default for most Rails projects, and that would have to change to something like GOFORIT. The code in Foreman that would have to change is here, but that might have security implications I don't understand. For a POC or demo, you can use the Chrome plugin to ignore X-Frame headers (witchcraft!) and that will solve immediate issues with Satellite 6, but this issue is going to be pretty common going forward I suspect.

Mysterious Disappearance

Our little External tab disappeared twice over the course of the POC. It appeared to be related to network issues which resulted in an ungraceful shutdown of Rails. It's quite easy to fix, just follow the clean, precompile, restart steps again and it will come back.

# RAILS_ENV=production rake assets:clean
# RAILS_ENV=production rake assets:precompile
# service evmserverd restart

The Trouble with Orphans

This section is both a warning and a tutorial on how to terrify your co-workers. All the files above reference each other, specifically the "item" files reference a "parent", which is the id in the "section" file. If you have a typo, and there is a child without a parent, when you restart the appliance you will get the login screen as usual, but upon logging in, you will be greeted with this:


That's it. Just a page that says that.

You accidentally CloudForms.

If you look for further information in the logs you'll find something like this:

[----] F, [2015-08-18T07:03:58.890271 #4201:84bea8] FATAL -- :
ActionView::Template::Error (Invalid parent):

Fixing the typo and restarting the service will fix it.

Living the Dream

Obviously everyone is thinking the same thing at this point.

  • CloudForms is HTTPS
  • CloudForms requires SAMEORIGIN, but what if it is?

The answer is yes. All your dreams of filling CloudForms with more CloudForms have just become a reality. Eat your heart out Christopher Nolan.


References and Further Reading

Menu Plugins for External Sites on CFME
Share this