Click to See Complete Forum and Search --> : External IMG not showing


robo
06-01-2003, 10:38 AM
Problem with showing external image
Although I am an experienced programmer I am totally flabbergasted by the following problem. I encountered this before and i miraculous disappeared...
But now on another site it is reappearing..

I use ASP to connect to a database and retrieve the (external) filename of an image. This filename is enclosed in the proper tags (<img) and printed to the html page.
When I view the page, the image is nog showing
When I open the source, and copy the full URL of the image and paste it in a new browser window, the image is showing perfect
When I then reload the original page, the image is not showing when I do a reload/refresh, but is showing when I show that page in a new browser window.
When that image is showing and I do a refresh/reload the image is gone again, and when I press enter at the end of a URL then the image will show again.
I am flabergasted....

It seems a caching problem, but how to solve it....?????

When I save the page, the external image is also saved (which is correct) and the page will ofcourse show perfectly when browsing offline

Greetings,
Rob van Overbruggen

khalidali63
06-01-2003, 10:45 AM
Typically this happens in IE only when you do not pre-load imges.The solution will be to pre-load images and this will go away automatically.

robo
06-01-2003, 11:06 AM
That was my first guess too. but the problem also appears in Netscape 4.03...
Any ideas ?

khalidali63
06-01-2003, 11:13 AM
Thats allright,but my suggestion was..are you preloading iamges?
I am guessing not.
Preload images,I Know it will go away

robo
06-01-2003, 11:39 AM
As you told, I did the preloading of the image...
This is the full code, when viewed by the browser...
The problem is not resolved....
Still flabbergasted......

Sincerely
Rob

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
image1 = new Image();
image1.src = "http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0010.JPG";
// End -->
</script>

<link rel="stylesheet" href="photo.css" type="text/css">
<META NAME="Author" CONTENT="R.v.Overbruggen">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="resource-type" content="document">
<meta http-equiv="pragma" content="cache">
<meta name="revisit-after" content="5 Days">
<meta name="classification" content="Education">
<meta name="description" content="Hypnose hypnotherapie NLP (Neuro Linguistisch Programmeren) en Time Line Therapy (TLT), een site voor therapeuten, coaches, hypnotherapie en NLP, Technieken, methodes en algemene informatie.">
<meta name="keywords" content="hypnose, hypnotherapeut, hypnose ,NLP, coaching, hypnose, hypnotherapie, Neuro Linguistisch NLP, hypnotherapie, NLP, therapie, NLP, therapie, hypnotherapeut, hypnotherapie, training, opleiding, hypnose, Time Line Therapie, hypnose, TLT, hypnotherapeut, hypnotherapeut, hypnotherapy, hypnose, hypnotherapeut, hypnose, hypnotherapie, hypnotherapeut">
<meta name="robots" content="ALL">
<meta name="distribution" content="GLOBAL">
<meta name="rating" content="General">
<meta name="copyright" content="Copyright of Mind-Expansion">
<meta name="language" content="Dutch">
<meta name="doc-type" content="Public">
<meta name="doc-class" content="Completed">
<meta name="doc-rights" content="Public Domain">
</head>
<body bgcolor="#FFFFFF" text="#000000" background="back2.jpg">
<a name="TopOfPage"></a>

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td>


<script language="JavaScript">

var sURL;
sURL = window.location.href;
var lowerurl = sURL.toLowerCase();
lowerurl = lowerurl.substring(0,16);
var spath
if (lowerurl == "http://127.0.0.1")
{
spath= "http://127.0.0.1"
}
else
{
spath = "http://www.mind-expansion.nl/vanoverbruggen"
}
spath = spath +"/resources/userlib/"


function OpenWndLinks(mypage)
{
var w = 400;
var h= 300;
title = "";
LeftPosition=0;
TopPosition=0;
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars=no,location= no,directories=no,status=no,menubar=no,toolbar=no,resizable=no';
win= window.open(mypage,title,settings);
};

function OpenWndLarge(mypage)
{
var w = 700;
var h= 700;
title = "";
LeftPosition=0;
TopPosition=0;
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars=yes,location =no,directories=no,status=no,menubar=no,toolbar=no,resizable=yes';
win= window.open(mypage,title,settings);
};

function redir(mypage)
{


var sLoc;
sLoc = window.location.href;
var Pattern = /&/ig
var sLocReplaced = sLoc.replace(Pattern,"@~@");
window.location.href = mypage + "?callingpage=" + sLocReplaced;
};

</script>
<font size ="-3"><p>Accesslevel: <BR> PhotoAccess: 80</P></font> <font size ="-3"><div align="right"><a href="javascript:OpenWndLinks(spath+'logoff.asp')">Logoff</a></font>
</TD>
</tr>
<tr>
<td colspan="3"><div align="left"><a href="#TopOfPage"> Top </a> | <a href="javascript:history.go(-1);">Back </a> | <a href="default.asp"> Main page </a> </div>
</td></tr>
</table><center><h1></h1></center><center><h1><a href="/vanoverbruggen/resources/photolib/tmppover.asp?PhotoID=2&CatID=1&Index=/vanoverbruggen/resources/photolib/tmpIover.asp?CatID=1"> << </a><a href="/vanoverbruggen/resources/photolib/tmpIover.asp?CatID=1"> Index </a><a href="/vanoverbruggen/resources/photolib/tmppover.asp?PhotoID=4&CatID=1&Index=/vanoverbruggen/resources/photolib/tmpIover.asp?CatID=1"> >> </a></h1></center><center><h1><table width="75%" border="0" bordercolor="#00CC33" cellspacing="0" cellpadding="1" align="center"><TR align=left><td><center><img ALT="foto" src="http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0010.JPG" border="0"><br>100_0010.JPG</center></td></tr></table></h1></center><div align="left"> <a href="#TopOfPage"> Top </a> | <a href="javascript:history.go(-1);">Back </a> | <a href="default.asp"> Main page </a> </div>
<hr>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center"><font size="-2">The Photo Library - Developed bij Mind-Expansion,
Copyright 2000-2003 Rob van Overbruggen<br>
Interested in the software behind it, mail to the webmaster</font></td>
</tr>
</table>
</BODY>
</HTML>

khaki
06-01-2003, 11:58 AM
i pasted your code into a web editor...
viewed it in the browser....

and the image appeared for me.

(hey.... did that talking guy put that poor girl to sleep? ;) )

Have you tried viewing your page from another computer?
(cause it works on mine)

;) k

robo
06-02-2003, 06:16 AM
I tried on 2 different machines and it still does not work. It could be that when loading the html directly into a page it works, although online, through the db it doesn't.

you could check this weird behavior at www.vanoverbruggen.nl
then go to fotoalbum and login with username=001, and pw = testing.
"Bekijk de fotos" (show photos)


Greetings
Rob:(

Khalid Ali
06-02-2003, 07:33 AM
Hello Robo,I actually went through all th elogin in stuff to findout,your problem to me seems like preloading.Cus I could not see any code on the page thats preloading images...I could be wrong...but thats what I suggest.."again"..

:-)

robo
06-02-2003, 08:37 AM
Thank you for your patience, I really appreciate it.
The preloading is not on the photo index page, but on the individual photopage.
(when clicking on one of the not shown images)

"<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
image1 = new Image();
image1.src = "http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0009.JPG";
// End -->
</script>
"

Khalid Ali
06-02-2003, 08:40 AM
Help me understand it.

You have a page that has allots of thumbnails...each of which point to a large image page?

robo
06-02-2003, 09:05 AM
Correct.
These thumbnails represent the photoindex, at which point the user can choose to see one in a larger size.
The thumbnails page do not contain the preloading (I wanted first to resolve the error in the individual page). The individual picture page does contain the above pasted preloading..

Cheers.
rob

Khalid Ali
06-02-2003, 09:34 AM
can you point me to one page where you have image preloading and it does not work?

robo
06-02-2003, 09:36 AM
I could do that, but the login works with session cookies, so you still must log in.
When you click on one thumbnail, another page opens with the non-loaded image in the center. This is the page where the preloading is implemented.

as mentioned :
<!-- Begin
image1 = new Image();
image1.src = "http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0009.JPG";
// End -->

Khalid Ali
06-02-2003, 09:50 AM
Here is what you can do.

<img ALT="foto" src="http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0008.JPG" border="0">

the above your code to display an image in the page...give it a id attribute it will look like this

<img id="largeImage" ALT="foto" src="http://snow.prohosting.com/robo2/vano_pho/trouwerij_hans_ank/big/100_0008.JPG" border="0">

now change your body tag as follows

<body onload="loadImage();">

now in the javascript section where you pre load image add the following code right belowimage pre loading code

function loadImage(){
document.getElementById("largImage").src = image1.src;
}

EDIT
I missed the a parenthesis above earlier..the code above is updated.

robo
06-02-2003, 04:04 PM
we are a little closer to tackling this... I included the script as you told me to do and now the page does know the size of the image, although it is not shown....

robo
06-03-2003, 03:33 AM
It showed the new size a couple of times, but now it aint...:confused:

robo
06-03-2003, 08:24 AM
now the format is wrong again....
I lost all logic out of this... any suggestions?:confused:

robo
06-03-2003, 08:28 AM
This might have to do with the sollution :

free.prohosting.com :
>>Can I store files in my account for other sites?
Technically, no. You're not supposed to use your account as a storage space and refer to the stuff in your account from another, non-ProHosting site. This is because they wouldn't be able to show their ads, even though you're using their resources. Generally, you actually can't access some content stored on ProHosting's server from other sites. The server will not serve the content.

Although this is still weird, as downloading the page works fine, any workarounds ?:eek:

AdamGundry
06-03-2003, 08:36 AM
Yes, you actually can't access some content stored on ProHosting's server from other sites means it won't work. You can download pages because that is accessing the server normally, but they presumably have server-side code to prevent you externally linking files.

I don't know any workarounds, and any that exist would almost certainly violate their terms of service.

Adam

robo
06-03-2003, 08:45 AM
Cool... Interesting how they managed to do that. As the image or file is directly referenced. Do you know HOW they manage to do this. Do they use CGI scripting, or a server plugin, how does the system distinguish between an externally viewed file and a downloaded file (where he does download the image)
:confused:

AdamGundry
06-03-2003, 09:02 AM
When a browser requests an image, it submits the domain of the requesting page in the HTTP headers (I think). The server then has a plugin/module/etc. which checks this field, and if it is not for their own domain refuses to serve the image. Thus files are available through direct access, but not if externally linked.

Adam

robo
06-03-2003, 09:05 AM
Cool (and damn effective) protection.
Thanks