I have a site that has multiple images being displayed on a page.
These are all varying in size but are in the region of 9MB-15MB.
They are all loading fine except for one. I get a 206 Partial content status.
I have done some research and found on StackOverflow a couple of questions relating to this, but they talk about it in relation to loading a video. But my problem is with an image.
The annoying thing is that all other images are loading just fine, even ones from the same directory and the same page.
Things, that I have checked:
The image is definitely there in the directory.
The image has full 777 privilege as does its folder.
It is 10.6MB, but as I have said, I have other images of this size and bigger which are loading with no problem.
I am able to open the image on the computer (as I am on my local).
Image is being loaded in a standard img tag.
This should only happen if you are sending a Range header in your HTTP request. Does this happen, too, if you are using another browser? If so, this is probably some sort of misconfiguration or bug on the server side. If not, your browser seems to be messy, then I would try to delete the cache or, if this doesn't help, to restart.
Related
In my web page I have the same image used ~5000 times in different places.
I always heard that browser will automatically cache images and I should not worry about it, yet, when I profiled my page load in Chrome, it does not seem to be the case. Please find attached screenshot of profiling result:
All the marked red areas is downloading the same image over and over again. It is marked as "Receive Data", so I assume it is indeed downloading it every time.
When I check Resource URL being downloaded, each instance has additional unique id added, like: "https://localhost:44344/images/MenuNode.png?1588089781084", which is not present in my code.
All those downloads are adding up to a noticeable chunk of time.
Is there a way to only download this image once, to speed up overall page load time?
Ok, I found it, for some reason a library I was using to draw charts was detecting all images inside it's nodes html and adding unique identifier to them...
I have been using a dev tools network tab to check out the loading of resources within a HTML email, because sometimes some of the images do not load properly.
Now I am trying to understand if the email client will always execute the html code in a top to bottom approach, or if there are conditions which can change this.
So I have a tracking pixel and it is located at the very bottom of my email. This pixel does a lot of things which causes it to take about 15 seconds to load. However, because it is at the bottom of my email, it should not interfere with the images being loaded above it. That was what I thought all the time until I checked out the Network tab.
Within the email, a lot of the images are dynamically injected. In the network tab, these images normally have a status of 302 - moved temporarily. It then looks like these images are then reloaded after the tracking pixel has started its request, which could be the cause of some images not loading properly.
I was really hoping for some advice as to whether my theory could be correct, or if I am missing the point altogether?
Thanks
I have quite the conundrum. Background- I have a webpage I made for fun as an easter egg for an internal site on my company's network. The index page isn't rendering the images and it's giving off a 404 not found error, even though I've triple checked and they're in the appropriate directory and I can open them up and view up without issue.
Pages that are linked to the index page DO get their pictures rendered. The webpages and the pictures are both in their own directories so I'm really not sure what could be going on. The tag is correct as well as the file name.
For example-
On my index page I have <img src="pics/opslogo.jpg"> which should point to http://[internal site]/html/Old_Ops_Website/pics/opslogo.jpg, which it does according to the page source, but it doesn't render even though I know the picture is in there.
On a separate page I have <img src="pics/connection.jpg"> which should point to http://[internal site]/html/Old_Ops_Website/pics/connection.jpg, which it does, and it DOES render correctly.
Interestingly enough the pictures that won't render when hitting the site from the network DO render correctly on the host machine itself.
Here are the paths, taken from "copy-shortcut", to the images from the non-working page and a working one, respectively-
http://[internal site]/html/Old_Ops_Website/pics/ops-logo.jpg
http://[internal site]/html/Old_Ops_Website/pics/connection.jpg
Given those pieces of information, I'm absolutely bewildered as to why this isn't working.
Not sure if it makes any difference but the actual root of the website is located in "C:\Program Files\Apache Software Foundation\Tomcat 8.0\webapps\ROOT" while the page I'm working on is located in "C:\Program Files\Apache Software Foundation\Tomcat 8.0\webapps\ROOT\html\Old_Ops_Website". Both directories have index files.
I tried changing the index file to "test.html" and hitting it via "http://[internal site]/html/Old_Ops_Website/test.html" with the same results.
Also tried "<img src="./pics/opslogo.jpg"/>", just in case, but no-go still.
Next steps taken-
Ok so I tried it with the images that I know for sure to be working on other pages and they show up on the index page as well. I still don't understand why the others won't show up since all the images are located in the exact same directory and when viewing the website from the host server all images render correctly. Next I tried to link the images that aren't working to one of the other pages and they don't work there either. I've triple checked and the images are definitely in the right directory and in the correct format and I can open them up and view them.
What could be causing these specific images to not render on any of my pages, yet they render perfectly from the host machine itself?
Edit, more details-
I went ahead and set the site up on my public dev server- here. As you can see here- pics the photos are in the correct directory, the HTML page is referencing the correct images, but nothing is coming up. FYI - I didn't create this site. This is about 10-15 years old which is why I'm hiding it on our current site as an easter egg for people to get a laugh at.
don't you realize your file name is wrong.
try:
<img src="pics/opslogo.JPG"/>
I have a mediawiki at http://spider.dnsdojo.net running on LAMP. I enabled the use of InstantCommons while trying to setup the UploadWizard extension. Ever since I can't get at least one of my images to show up correctly. It keeps showing the InstantComons image even though I have disabled the use of InstantCommons.
-So far I've
cleared the cache and cookies on chrome
purged the site using index.php?title=3x3x3_LED_Cube&action=purge
delete all images and re-upload
It's driving me crazy, because when I click on the image it takes me to the file page which shows the correct jpg. What am I doing wrong?
I'm not sure if this is a MediaWiki bug or if I was just doing something wrong, but I finally got the proper image showing up. What finally did it, I think, was uploading the image and then uploading it again over top of itself. Maybe this will save someone else a few hours of frustration.
I have a web application, where i am storing all the images in a folder which is totally outside WEB-INF folder or webroot folder. When the jsp to display the image is called, before displaying it, i am moving the concerned image files to WEB-INF/images folder and then setting the path in the html IMG tag. My question is
Is this good design?
Also even though the image is moved to WEB-INF/images folder, the page does not display the image always, it displays sometimes and sometimes it doesnt. I dont know how to debug this problem.
I am using springs and spring security.
This is not a very good design. In many cases, server will cache web application data so if the image was not there it will never find out that it appeared in place. That's, probably, causing the inconsistency that you observe as there may be other factors affecting caching.
The right choice would be to provide a servlet that serves your image data upon request from the file.