Gå til innhold

Henting av informasjon fra siden i en iframe

cbastus

Anbefalte innlegg

cbastus

cbastus

Skrevet
Skrevet (endret)

Se for deg følgende kode:

 

<html>
<head/>
<body>
<iframe src="foo.bar.html"/>
</>
</>

 

Er det mulig å hente ut informasjonen om elementene i foo.bar.html?

Målet er å dynamisk endre lokale objekter etter objektene på den eksterne siden.

 

EDIT: Endret overskriften til en mer forståelig en.

Endret av cbastus
Lenke til kommentar
  • 1 måned senere...

Videoannonse

Videoannonse
Annonse
grimjoey

grimjoey

Skrevet
Skrevet

assign en id til iframe taggen.

 

var framedStuff = document.getElementById('iFrameId');

framedStuff.contentDocument.....

// slik får du tilgang til innholdet i iframen. fungerer ikke i IE

// det er mulig IE har en egen måte å gjøre det på men det aner jeg ikke

Lenke til kommentar
cbastus

cbastus

Skrevet
  • Forfatter
Skrevet (endret)

Takker for tipset om contentDocument men jeg tro ikke helt jeg forstår hvordan den fungerer. Jeg vil sette stor pris på litt hjelp med følgende test (Kun testet i Fire Fox foreløpig. Forøvrig ikke uventet om IE ikke støtter en DOM standard.):

 

<html>
<head/>
<body>

<iframe id="hookme" src="http://www.w3schools.com/"></iframe>

<script>
//iframe dokumentets innhold
var iframe = document.getElementById("hookme").contentDocument;

//body til iframe
var ibody = iframe.getElementsByTagName("body")[0]; 

//alle noder under iframe.body
var ibodycildren = ibody.childNodes;

//returnerer 0, hvorfor?
alert(ibodycildren.length);
</script>

</body>
</html>

 

Hvorfor returnerer ibody.children 0 og ikke 2? ibody inneholder et HTMLBodyObject som jeg antar er body til www.w3schools.com element iom. at jeg velger det første elementet i iframe-arrayen som kun inneholder dette ene body-objekt.

 

www.w3schools.com har for øyeblikket 2 tabell-noder under body, så ibodychildren burde vel inneholdt disse to? Burde ikke da alert(ibodychildren.length) gitt 2 og ikke 0?

 

www.w3scools.com kilde:
<html ... >
<head>...</head>
<body>

<table ... >...</table>
<table ... >...</table>

</body>
</html>

 

EDIT: Rettet litt på innlegget.

Endret av cbastus
Lenke til kommentar
grimjoey

grimjoey

Skrevet
Skrevet (endret)

jeg får access denied feilkode 1010 i firebug når jeg tester noe liknende. kanskje det kun er tilgang til å manipulere tomme iframes

 

red:

du kan jo prøve å hente innholdet til iframen via javascript. kan hende du får tilgang da

Endret av grimjoey
Lenke til kommentar
cbastus

cbastus

Skrevet
  • Forfatter
Skrevet
red:

du kan jo prøve å hente innholdet til iframen via javascript. kan hende du får tilgang da

Mulig jeg missforstår hva du mener, for eksempelet over og samtalen så langt har vel dreid seg om JavaScript?

 

Etter å ha sett litt nærmere på dette og det med tilgangsnekten slo det meg at mitt eksempel prøver å hente info fra iframen før dokumentet i iframen har lastet. Det er i tillegg et sikkerhetstiltak ved kryssdomene-forespørsler på klient side som ikke lar seg løse uten Active X, noe som kun kan benyttes i IE og som jeg ikke vil belaste brukeren mine unødvendig med. Mulig det lar seg løse med en tilgangsfil eller noe liknende på det eksterne domenet, så om noen vet noe er det fint om dere gir opplysningene videre.

 

Her er litt mer info om tilgang til iframe.body

Lenke til kommentar
cbastus

cbastus

Skrevet
  • Forfatter
Skrevet
ja, men ettersom src til iframe er definert i dokumentet, kan det hende javascript interpretern nekter deg tilgang. jeg forsøkte å sette src vha javascript og fikk tilgang (dvs ikke feilmeldinger). men alle elementene synes å være tomme.

Tipper du vil få feilmelding om du setter en timout mellom src settes og du forsøker hente elementer. Jeg fikk tomme elementer når jeg hentet ut info før siden i framen var ferdiglastet, dog testet jeg kun dette på body tagen.

 

ajax er vel det du leter etter. snasen måte å hente ut info fra eksterne sider, og det fins fult av rammeverk som hjelper om man vil jukse litt :p f.eks prototype.js

Mulig jeg har missforstått en hel del, men AJAX er vel betegnelsen på samspillet mellom DOM, JS, XML og server side. Så å bruke feks et XMLHttpRequest objekt vil vel ikke endre på tilgangsrettighetene til den eksterne siden iom. at det fortsatt er JavaScript som utfører handlingen?

 

Jeg har vært borti samme problem i Flash, der er løsningen å legge inne en xml-fil med rettigheter for eksterne domener. Mulig det finnes noe slikt for JavaScript også. Alternativt om siden i iframen kan sende informasjon til den opprinnelige siden uten mellomlagring på server. Det ser ut som denne artikkelen om kryssdomenetilgang er inne på en løsning.

Lenke til kommentar
grimjoey

grimjoey

Skrevet
Skrevet (endret)

skummet så vidt artikkelen. ser ut som du trenger kontroll over dns for at det skal virke, hvilket ikke alltid er tilfelle.

 

har du forresten tilgang til serverside som feks php kan du jo cache innholdet du skal manipulere på det lokale domenet.

Endret av grimjoey
Lenke til kommentar
cbastus

cbastus

Skrevet
  • Forfatter
Skrevet

Stemmer at man må endre DNS for begge domener ja. I dette tilfellet har begge samme eier, så det skulle ikke by på problemer. Spørsmålet blir vel heller om det smaker hva det koster da flere parter må involveres.

 

Jeg har tilgang til serversidescript på den eksterne serveren, kun HTML, scripting og denslags på den lokale så cacheing fungerer nok ikke. Løsningen kan kanskje være å sende info via headere eller URL fra den eksterne siden, men det fordrer jo at URL-endringer eksternt plukkes opp av den lokale iframen ... Uansett så er ikke dette vesentlig viktig, så det blir nok bare et prosjekt for å finne ut om det er mulig.

 

Det er uansett spennende om folk har ideer til løsninger, så post i vei :)

Lenke til kommentar
cbastus

cbastus

Skrevet
  • Forfatter
Skrevet

Jeg kan i alle fall opplyse om at contentDocument ikke støttes av Microsoft før IE8, noe som egentlig er ganske ubegripelig siden denne ble innført med DOM Level 2 i 2000. IE8 kommer vel ikke ut før mot slutten av året, så må man påberegne ett-to års tid før alle er oppdatert. Å sende variablene via adresselinja til den eksterne siden fungerer derfor heller dårlig så langt. I standard-kompatible nettlesere fungerer det utmerket.

 

Digger forøvrig slagordet til IE8 - Put the web at your service. Fantastiske greier.

Lenke til kommentar
luxus

luxus

Skrevet
Skrevet (endret)

Når det gjelder å hente ut innhold fra en IFRAME tag i både FF, Opera og IE kan det gjøres på denne måten:

 

index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="no">
 <head>
<title>Iframe test</title>
<script type="text/javascript">
  //<![CDATA[
  // Litt dårlig måte å gjøre dette på, men.. Burde egentlig bruke addEventListener/attachEvent
  window.onload = function() {
	iframe  = document.getElementById('iframe');

	if ( iframe.contentDocument ) {
	  // W3C
	  innhold = iframe.contentDocument.body;
	} else {
	  // IE
	  innhold = frames[iframe.name].document.body;
	}

	alert("Antall: "+innhold.childNodes.length);
  }
  //]]>
</script>
 </head>
 <body>
<h1>Iframe test</h1>
<iframe id="iframe" name="iframe" src="./iframe.php"></iframe>
 </body>
</html>

 

iframe.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="no">
 <head>
<title>Iframe test</title>
 </head>
 <body>
<h2>Dette kommer fra iframe-en</h2>
<p>Litt tekst</p>
 </body>
</html>

Endret av luxus
Lenke til kommentar
trtrtr

trtrtr

Skrevet
Skrevet
Når det gjelder å hente ut innhold fra en IFRAME tag i både FF, Opera og IE kan det gjøres på denne måten:

 

index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="no">
 <head>
<title>Iframe test</title>
<script type="text/javascript">
  //<![CDATA[
  // Litt dårlig måte å gjøre dette på, men.. Burde egentlig bruke addEventListener/attachEvent
  window.onload = function() {
	iframe  = document.getElementById('iframe');

	if ( iframe.contentDocument ) {
	  // W3C
	  innhold = iframe.contentDocument.body;
	} else {
	  // IE
	  innhold = frames[iframe.name].document.body;
	}

	alert("Antall: "+innhold.childNodes.length);
  }
  //]]>
</script>
 </head>
 <body>
<h1>Iframe test</h1>
<iframe id="iframe" name="iframe" src="./iframe.php"></iframe>
 </body>
</html>

 

iframe.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="no">
 <head>
<title>Iframe test</title>
 </head>
 <body>
<h2>Dette kommer fra iframe-en</h2>
<p>Litt tekst</p>
 </body>
</html>

 

men den løsningen er fortsatt begrenset av "same-origin security policy" (dvs at dersom iframe peker på en annen site vil det ikke fungere).

Lenke til kommentar
luxus

luxus

Skrevet
Skrevet

ah, gikk visst glipp av den detaljen jeg :-( Gikk ut i fra første post da jeg skrev eksempelet der src "foo.bar.htm" ikke var ekstern, men jeg så jo at det sto i teksten under nå.

 

Hvilke data er det forresten som skal hentes fra den eksterne siden?

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...