<img src="img.png"/>
I have some images on the site like above. When I try to load them they are loading only half. When I checked the requests in console.
I see that the response is
"206 partial content"
I googled it and it says that if there is a range set in header, it will be like this. But where does these headers actually set? And how to avoid this and load full images?
From user166390’s answer to the question Why does Firebug show a "206 Partial Content" response on a video loading request?
This Partial Content code (206) may be sent from the server when the client has asked for a range (e.g. "give me the first 2MB of video data").
It is vital for downloading data in chunks which avoids fetching unused resources. (I seldom watch a full video online.) Look at the outgoing request for a Range
header.
It's up to the client to put in another call to get the rest of the data (or the next bit). You don't have to do anything, they'll get the full image eventually, even if it takes several http calls.
I had similar problem when loading fonts from different subdomains. In my case I was getting 206 due to crossdomain issues and I solved it just by putting a .htaccess file in my root folder:
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>