suit: MIME-Type einer Ressource per jQuery herrausfinden

SELF-Forum

MIME-Type einer Ressource per jQuery herrausfinden

suit Homepage des Autors
– Informationen zu den Bewertungsregeln

Hallo,

ich bin grade dabei einen "Lightbox-Klon" (jaja, noch einer :D) zu schreiben - funktioniert auch relativ gut.

Allerdings muss man dem Ding per rel-Attribut sagen, was es hinter der Ressource zu erwarten hat. Daraufhin wird dann ein Bild angezeigt oder ein iFrame-Element mit dem Inhalt.

Nun möchte ich aber, dass das automatisch geschieht - aber wie stelle ich das am geschicktesten an?

Nun bin ich auf 2 Probleme gestoßen:
Wenn die Ressource auf einem externen Server liegt komme ich per XMLHttpRequest bzw. den AJAX-Funktionen von jQuery garnicht ran (Same Origin Policy) - und wenn ich rankomme, bekomm ich nur den Quelltext daher, den MIME-Type weiss ich aber immer noch nicht.

Kann mir da jemand auf die Sprünge helfen?

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. MIME-Type einer Ressource per jQuery herrausfinden

    Struppi Homepage des Autors
    +1 Informationen zu den Bewertungsregeln

    Nun bin ich auf 2 Probleme gestoßen:
    Wenn die Ressource auf einem externen Server liegt komme ich per XMLHttpRequest bzw. den AJAX-Funktionen von jQuery garnicht ran (Same Origin Policy) - und wenn ich rankomme, bekomm ich nur den Quelltext daher, den MIME-Type weiss ich aber immer noch nicht.

    Wieso kommst du nur an den Quelltext?
    Es gibt die Methode getAllResponseHeaders() des HTTPRequest Objekts. Ob und wie das jQuery verwendet weiß ich aber nicht.

    Das Problem 1 kannst du mit JS nicht lösen.

    Struppi.

    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln

    1. MIME-Type einer Ressource per jQuery herrausfinden

      suit Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Wieso kommst du nur an den Quelltext?

      Lt. Doku sieht das so so aus: Type of data to be returned [...]: "xml", "html", "script", "json", "jsonp", or "text".

      Es gibt die Methode getAllResponseHeaders() des HTTPRequest Objekts. Ob und wie das jQuery verwendet weiß ich aber nicht.

      Muss ich mir ansehen ob das geht, auf die Schnelle hab ich jetzt aber nichts gefunden - danke für den Tipp.

      Mit dem http://de.selfhtml.org/javascript/objekte/images.htm@title=images-Objekt gibts scheinbar auch keine Möglichkeit das herrauszufinden, ob es ein Bild ist oder nicht. Allerdings scheint folgendes zuverlässig zu funktionieren:

      <!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">  
	<head>  
		<title>images-Objekt-Test</title>  
	</head>  
	<body>  
		<img src="http://de.selfhtml.org/dhtml/beispiele/anzeige/bilderbuch01.gif" alt="" />  
		<script type="text/javascript">  
			/* <![CDATA[ */  
			//testimage = new Image(); testimage.src = "http://de.selfhtml.org/dhtml/beispiele/anzeige/bilderbuch02.gif";  
			testimage = new Image(); testimage.src = "http://de.selfhtml.org/";  
			if (testimage.complete == true) {  
				if(testimage.width == 0 && testimage.height == 0) {  
					alert(testimage.src + ' ist kein Bild');  
				} else {  
					alert(testimage.src + ' ist ein Bild');  
					document.images[0].src = testimage.src;  
				}  
			}  
			/* ]]> */  
		</script>  
	</body>  
</html>

      Der Haken ist allerdings, dass das Bild erst geladen werden muss. Der Internet Explorer 6 erzeugt das images-Objekt scheinbar garnicht wenn es kein Bild ist.

      Bin für weitere Vorschläge offen.

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. MIME-Type einer Ressource per jQuery herrausfinden

        Struppi Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Es gibt die Methode getAllResponseHeaders() des HTTPRequest Objekts. Ob und wie das jQuery verwendet weiß ich aber nicht.

        Muss ich mir ansehen ob das geht, auf die Schnelle hab ich jetzt aber nichts gefunden - danke für den Tipp.

        Ich hab auf die schnelle das gefunden:
        http://binarykitten.jkrswebsolutions.co.uk/2009/01/21/jquery-plugin-ajax-head-request/

        Mit dem http://de.selfhtml.org/javascript/objekte/images.htm@title=images-Objekt gibts scheinbar auch keine Möglichkeit das herrauszufinden, ob es ein Bild ist oder nicht.

        Wieso? Wenn mich nicht alles täuscht, sollte der onerror Event gefeuert werden wenn es kein Bild ist.

        Der Haken ist allerdings, dass das Bild erst geladen werden muss. Der Internet Explorer 6 erzeugt das images-Objekt scheinbar garnicht wenn es kein Bild ist.

        Es gibt auch den onload Event. Der zwar nirgends (soweit ich weiß) dokumentiert ist, aber in allen Browsern funktioniert.

        var img = new Image();  
img.onload = function() {  
// fertig geladen  
};  
img.src = .....

        Struppi.

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. MIME-Type einer Ressource per jQuery herrausfinden

          suit Homepage des Autors
          – Informationen zu den Bewertungsregeln

          var img = new Image();

          img.onload = function() {
          // fertig geladen
          };
          img.src = .....

            
Jep, das funktioniert auch - hat aber ebenfalls denselben Effekt: das Bild muss vollständig geladen um zu bestimmen ob es ein Bild ist.  
  
D.h. wenn ich Kennzeichnen möchte, ob es sich um ein "Popup" mit einem Bild handelt oder einer anderen Ressource handelt, kann ich das entweder per Hand machen (z.B. im rel-Attribut) oder aber ich erzeuge für jedes Bild vorab ein entsprechendes Objekt. Für lokale Ressourcen ist aber der HEAD-Request denkbar - das muss ich mir noch ansehen.  
  
Danke jedenfalls - hast mir sehr geholfen.  
  
btw: fürs Archiv  
  
~~~javascript
  
			testimage = new Image();  
			testimage.onload  = function() { alert('Ist ein Bild'); }  
			testimage.onerror = function() { alert('Ist kein Bild'); }  
			testimage.src = "http://de.wikipedia.org";                                           // kein Bild, aber viel Quelltext  
			//testimage.src = "http://de.selfhtml.org/dhtml/beispiele/anzeige/bilderbuch02.gif"; // kleines Bild  
			//testimage.src = "http://www.pb2rdf.eu/TD/20090830/TD-zitadelle-plan-20.jpg";       // riesiges 40-MP-Bild
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln