XPages : Outputed html tag in IE11 - xpages

I developed XPages application. When loading the page on IE, the outputed html tag is the following.
When loading the page with FQDN or IP Address of the host part,
<HTML lang=en>
When loading the page with the host name(this is defined in hosts file) of the host part,
<html class=" lotusui_ie lotusui_ie7" lang="en">
As a result, the layout is broken in the latter case. I'd like to expect the former tag is outputed in any cases.
Then, I used http-equiv="X-UA-Compatible" but does not work. What causes this issue?

How we set X-UA-Compatible:
<xp:this.beforeRenderResponse><![CDATA[#{javascript:
try {
var response = facesContext.getExternalContext().getResponse();
response.setHeader("X-UA-Compatible", "IE=10");
} catch (e) {
dprint("IE emulation: " + e);
}}]]></xp:this.beforeRenderResponse>

Related

render html from string without affecting formatting [duplicate]

Is there any way to setup Firefox and Chrome to work with escape=false attribute in h:outputText tag. When there is some html that needs to be shown in the browser, Firefox and Chrome show parsed string correctly, but any other links in application are freezed (??).
The example html from db:
<HEAD>
<BASE href="http://"><META content="text/html; charset=utf-8" http-equiv=Content-Type>
<LINK rel=stylesheet type=text/css href=""><META name=GENERATOR content="MSHTML 9.00.8112.16434">
</HEAD>
<BODY><FONT color=#000000 size=2 face="Segoe UI">läuft nicht</FONT></BODY>
Parsed HTML on the page:
läuft nicht
What is very weird, is that in IE everything works (usually it is opposite).
I use primefaces components (v2.2), .xhtml, tomcat 7 and JSF 2.0
You end up with syntactically invalid HTML this way:
<html>
<head></head>
<body>
<head></head>
<body>...</body>
</body>
</html>
This is not right. There can be only one <head> and <body>. The browsers will behave unspecified. You need to remove the entire <head> and the wrapping <body> from that HTML so that you end up with only
<FONT color=#000000 size=2 face="Segoe UI">läuft nicht</FONT>
You'd need to either update the DB to remove unnecessary HTML, or to use Jsoup to parse this piece out on a per-request basis something like as follows:
String bodyContent = Jsoup.parse(htmlFromDB).body().html();
// ...
Alternatively, you could also display it inside a HTML <iframe> instead with help of a servlet. E.g.
<iframe src="htmlFromDBServlet?id=123"></iframe>
Unrelated to the concrete problem:
Storing HTML in a DB is a terrible design.
If the HTML originates from user-controlled input, you've a huge XSS attack hole this way.
The <font> tag is deprecated since 1998.
It seems to me that you're trying to do something that JSF was not really meant to do. Rather than try to insert HTML in your web page, you ought to try having the links already on your page and modifying the "rendered" attribute through an AJAX call.

mathjax is not rendered when my page is on Dropbox

I have some mathjax enhanced WWW pages on Dropbox (e.g., mathjax_test.html), that are rendered like this
while on localhost they are rendered like this
The code of the page is
<html>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<head>
<title>Test of mathjax</title>
<meta http-equiv="content-type" content="text/html;charset=latin-1"></>
</head>
<body>
We analyze the common case in which the dynamic load can
be expressed by a constant load vector \(\boldsymbol r\)
modulated by an adimensional function of time,
\(f(t)\) (e.g., the seismic excitation can be
described in such terms).
</body>
</html>
Is there something that can be done to have mathjax code rendered correctly when the page is fetched from Dropbox?
The problem is that Dropbox only serves content over https but in your source MathJax.js is loaded via src="http://cdn.mathjax.org/....
Browsers block such http calls (see this SO post), hence MathJax is not loaded and accordingly can't render the page.
(You can open the JavaScript console in the developer tools of your browser to see an error message about this.)

JSF does not load css file, error message: "The resource from this URL is not text"

This is my JSF file header:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1"/>
<title>#{txt.TXT_TITLE_LOGIN}</title>
<link rel="stylesheet" type="text/css" href="scripts/styles.css"/>
<link rel="shortcut icon" href="./images/favicon.ico"></link>
<script src="./scripts/scripts.js" type="text/javascript"/>
</h:head>
<body...
When I opent the page, styles are not loaded, looks very ugly, and Firebug shows this:
<link href="scripts/styles.css" type="text/css" rel="stylesheet">
The resource from this URL is not text: http://localhost:8080/EWC/scripts/styles.css
</link>
... but the file is there, at the location /EWC/scripts.
When I open some other page with very same header all is ok. Then I go back to this page and it is ok too. But it happens again when this page is loaded first after clean browser cash.
What went wrong?
Resolved it.
Seams like the problem was conntected to Authorization redirect on session expiration does not work on submitting a JSF form, page stays the same.
The following code did not catch css file requests, so they were forwarded to Login page via gotoLogin() (in case user is not logged in).
if( requestURI.startsWith(req.getContextPath() + ResourceHandler.RESOURCE_IDENTIFIER) )
chain.doFilter(request, response);
return;
else
gotoLogin(null, request, response);
return;
I have added
if( requestURI.endsWith("css") )
chain.doFilter(request, response);
return;
...and it works.
As BalusC said, I hould have used <h:outputStylesheet>, <h:outputScript> and <h:graphicImage> instead of <link>, <script> and <img> in the header, and this would never happen.

How can I HTML escape in Erazor?

I'm new to Haxe, and I'm trying to experiment with Ufront.
I got a problem using Erazor templates: I don't understand how to escape HTML when outputting variables.
With this simple template:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Users list</title>
</head>
<body>
<ul>
#for(user in users)
{
<li>#user.name</li>
}
</ul>
</body>
</html>
If any of the users has name '<script>', then the template will simply output <script> for its name.
How can I properly HTML escape in Erazor?
How to HTML escape view arguments
In order to HTML escape an argument in your Erazor views,
you could simply use the HTML helper method encode().
Supposing your argument is called pageContent and its value is:
<script>
alert("BAD things could happens if you don't properly escape!!");
</script>
You can escape it using following code:
#Html.encode(pageContent)
Your template will be safely rendered as
<script>
alert("BAD things could happens if you don't properly escape!!");
</script>
Html.encode() internally uses StringTools.htmlEscape() in order to escape its argument.
Thanks to the kindly help of Franco, I've written a page on the Ufront site to explain how to HTML escape in Ufront.
Ufron automatically includes the helper class that contains the desired method:
<li>#Html.encode(user.name)</li>

How to make a meta tag the first one in the <head> section?

I'm using JSF2, GlassFish 3.1, PrimeFaces 2.x.
I'm having strange rendering problems on IE9. I'm supposed to be able to force IE9 to render as IE9 by inserting the following:
<html>
<head>
<!-- Enable IE9 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=9" />
...
But the thing is, it's not working because (I'm told) the meta tag MUST be the first tag in the section.
When I do this in my XHTML file ...
<html ...>
<f:view contentType="text/html" locale="#{loginHandler.currentLocale}">
<h:head>
<!-- Enable IE9 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=9" />
The resulting HTML looks like this, where JSF/PrimeFaces has inserted a bunch of "link" and "script" tags before my new meta tag.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type="text/css" rel="stylesheet" href="/orcf-webui/javax.faces.resource/jquery/ui/jquery-ui.css.jsf?ln=primefaces&v=2.2" />
<link type="text/css" rel="stylesheet" href="/orcf-webui/javax.faces.resource/wijmo/wijmo.css.jsf?ln=primefaces&v=2.2" />
<script type="text/javascript" src="/orcf-webui/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&v=2.2"></script>
<script type="text/javascript" src="/orcf-webui/javax.faces.resource/jquery/ui/jquery-ui.js.jsf?ln=primefaces&v=2.2"></script>
<!-- Enable IE9 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=9" />
Is there any way to get my meta tag in the right place so it will work? (Or an alternative way to make this IE9 problem go away?
The meta tag must go before all PrimeFaces stuff:
http://blogs.msdn.com/b/cjacks/archive/2012/02/29/using-x-ua-compatible-to-create-durable-enterprise-web-applications.aspx
HTTP Header and HTML HEAD are completly different things.
In PrimeFaces 3.0 the new facet was added to h:head:
http://blog.primefaces.org/?p=1433
So the solution would be:
<h:head>
<f:facet name="first">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
</f:facet>
</h:head>
I think best solution is to create JSF PhaseListener which adds X-UA-Compatible header to HTTP response
public class UACompatibleHeaderPhaseListener implements PhaseListener {
private static final long serialVersionUID = 1L;
#Override
public PhaseId getPhaseId() {
return PhaseId.RENDER_RESPONSE;
}
#Override
public void beforePhase(PhaseEvent event) {
final FacesContext facesContext = event.getFacesContext();
final HttpServletResponse response = (HttpServletResponse) facesContext.getExternalContext().getResponse();
response.addHeader("X-UA-Compatible", "IE=edge");
}
#Override
public void afterPhase(PhaseEvent event) {
}
}
and register it in faces-config.xml
<faces-config xmlns="http://java.sun.com/xml/ns/javaee" version="2.0">
<lifecycle>
<phase-listener>com.example.UACompatibleHeaderPhaseListener</phase-listener>
</lifecycle>
</faces-config>
Another option would be to create servlet Filter and register it in web.xml.
Why is this needed?
Imagine your web application is deployed on a domain (or sub-domain) which is on IE compatibility list here: http://ie9cvlist.ie.microsoft.com/ie9CompatViewList.xml so you need to use X-UA-Compatible header to switch IE back to latest mode.
Imagine your web application is deployed on WebLogic server (which uses mojarra 2.0.4) so you cannot change JSF implementation.
mojarra
You can create Filter which adds header:
X-UA-Compatible: IE=9
to response object.
Source
Just to comment on your answer and previous comments:
HTTP Header and HTML Head are not completly different things (effectively) if you view page on IE8 as shown by diagram here. If you set HTTP header, but not HTML Head, the directive from HTTP header is still taken into account.
I don't know how IE9 behaves, but I guess that in a similar way.
You might want to switch from Mojarra to MyFaces. Looking at the source code of MyFaces' HEAD renderer - first gets rendered the content of the element and then other resources. Mojarra is doing this probably other way around. If you don't want to switch JSF implementations you can just implement your own HEAD element renderer.
However I would suggest just to find out why IE9 is not working without the X-UA-Compatible meta tag. It is supposed to make newer versions to behave like older versions.

Resources