Blog Layout

XPages ressources in a theme - http vs. https

John Dalsgaard • sep. 14, 2015

I am at the moment moving a site from standard http to https (using Nginx as a proxy in front of Domino - but that is a different story). However, I did run into a small issue. When I looked at the console in Google Chrome this message appeared:


index.xsp:6 Mixed Content: The page at 'https://www.fiskogtast.dk/fangst.nsf/index.xsp' was loaded over HTTPS, but requested an insecure stylesheet '//fonts.googleapis.com/css?family=Actor'. This request has been blocked; the content must be served over HTTPS.


... and when looking at my theme I found this:


<resource>
<content-type>text/css</content-type>
<href>//fonts.googleapis.com/css?family=Actor</href>
</resource>


... and well, yes I had not taken into account that I was going to run SSL when adding that reference a while back. But I have taken on a new habit since then - now I use "protocol relative" urls. That is basically the same that we do when specifying "/db.nsf/..." in our apps as "domain relative" urls. So in this example I could use //fonts.googleapis.com/css?family=Actor. So I changed the href accordingly and refreshed my XPage....


But this did not do what I expected. Now the reference to the external resource was concatenated into an internal reference:


<link rel="stylesheet" type="text/css" href="/fangst.nsf/xsp/.ibmmodres/.css/DTUAqua.css&amp;%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DActor">


I tried to disable "Use runtime optimized Javascript and CSS resources" in the XSP properties - but didn't seem to make a huge difference...


So I did a little more ressource and found (via this link by intec) that you can use the rendered attribute on a resource tag in a theme. So I ended up with this (not so elegant) solution -that seems to work fine:


<resourcerendered="${javascript:context.getUrl().getScheme() != 'https'}">
<content-type>text/css</content-type>
<href>//fonts.googleapis.com/css?family=Actor</href>
</resource>

<resourcerendered="${javascript:context.getUrl().getScheme() == 'https'}">
<content-type>text/css</content-type>
<href>https://fonts.googleapis.com/css?family=Actor</href>
</resource>


Happy coding!

Blog

Af John Dalsgaard 17 Mar, 2023
Dalsgaard Data A/S celebrates 25 years!
25 års jubilæum
Af John Dalsgaard 17 Mar, 2023
Dalsgaard Data A/S fylder 25 år!
Flere indlæg
Share by: