Browserweiche serverseitig

[freezly]

Hallo,

ich habe mit meinen JSF Seiten ein paar Designprobleme, welche auf die verschiedenen Eigenheiten der Browser zurückzuführen ist. Ich habe mich schon etwas mit clientseitigen Browserweichen beschäftigt und bin mit der Realisierung dieser nicht sehr zufrieden.

Ich möchte gern dem Browser die entsprechende(n) CSS Datei(n) mitgeben, die für ihn geschrieben ist. Und nur die, und keine andere. Das würde ich gern Serverseitig machen.

Die Frage ist nun, gibt es bereits Möglichkeiten, wie ich vom Browser abhängig eine CSS Datei mitgebe? Oder wie wäre denn die prinzipielle Vorgehensweise zur Erkennung des Browsers und somit ein umschalten der CSS Datei im

<link rel="stylesheet" type="text/css"

Tag der JSF Seite.

Zur Information:
ich benutze JSF und Facelets mit Tomcat 6

 

[Ralf Ueberfuhr]

Du kannst natürlich den Header "User-Agent" auswerten. Einfacher geht es aber, die Browserweiche im CSS/HTML zu machen. Z.B. durch Kommentare, die nur der IE versteht, oder durch CSS-Syntaxelemente, die der IE nicht versteht. Zumindest ist IE vs. Nicht-IE immer mein Unterscheidungsmerkmal.

 

[freez]

wie werte ich denn den Header im Tomcat aus? brauche ich dazu einen Filter oder kann ich es über den FacesContext in ner Bean machen?

Ja, die clientseitige Browserweichen kenne ich. Mir kommt das irgendwie ziemlich gemurkst vor. Ich empfinde es deutlich besser, wenn ich im Server die Unterscheidung vornehmen kann, und dann die "richtige" CSS Datei angebe. Das kommt natürlich darauf an, wie vermurkst ich das dort realisiert bekomme. Wenn es schlimmer wird, als die clientseitige Geschichte muss ich wohl doch wieder umdenken.

 

[freez]

So, Problem gelöst. Meine serverseitige Browserweiche:

Eine Bean (request scope), welche auf IE6 prüft und die entsprechende Datei setzt:

public class Test {

	private String cssPfad = "";

	public String getCssPfad() {
		FacesContext fc = FacesContext.getCurrentInstance();
		HttpServletRequest re = (HttpServletRequest)fc.getExternalContext().getRequest();
		String browser = re.getHeader("User-Agent");
		if(browser.toLowerCase().indexOf("msie 6.0") != -1)
			cssPfad = "/css/standard_ie6.css";
		else
			cssPfad = "/css/standard_other.css";
		return cssPfad;
	}
	
	public void setCssPfad(String cssPfad) {
		this.cssPfad = cssPfad;
	}
}

in der JSF Datei gebe ich die CSS Dateien so an:

<link rel="stylesheet" type="text/css" href="/css/standard.css" />
		<link rel="stylesheet" type="text/css" href="#{test.cssPfad}" />

Ich habe nun eine standard css Datei für alle Browser, eine in der styles definiert sind, die der IE6 nicht richtig darstellt und eine CSS Datei, für alle anderen Browser.

Übrigens muss ich in meinem Projekt nicht zwischen "IE" und "nicht IE" unterscheiden. Den IE7 zähle ich in meinem Projekt zu anderen Browsern, da er bis jetzt alles so darstellt, wie der FF.