I have a mysql database which stores the paths of some images on a network drive.
I thought that using Ajax, I would be able to dynamically generate image tags to display these images in the browser as each image tag would inovoke a new GET request with the path relative to the browser.
The web server has a small HDD and I don't want to have to duplicate everything - so can't store large numbers of images on the server.
My PHP seems to generate the image tags correctly however the broswer does not show the images.
PHP code:
$sql = "SELECT ID,Link FROM tblStorePictures WHERE StoreNumber = $sto";
$result = mysql_query($sql,$dblink) or die(mysql_error());
$row = mysql_fetch_array($result);
$id = $row['ID'];
echo "<img src='file://".$row['Link']."' alt='Image' id=$id>";
The image tags (as viewed in firebug) end up looking like this:
<img id="57" alt="Image" src="file://x:/Image1.jpg">
I have tried various things but nothing works:
Dynamically generating the image tags with javascript using the document.createElement("img") method and setting attributes for the source etc.
Using javascript to set innerHTML.
In all cases I've got the tags to generate correctly, but I still see nothing in the browser but the alt text.
Any suggestions welcome.
What you are facing is a security feature of your browser. In fact, your browser will not follow links to local web pages (it means file:// urls) because the page you are viewing is not a local one (you are not at file://.../.../page.html). Therefore the browser sees a website on the network trying to access a file on your hard drive, and denies access to it for obvious reasons.
It's not an issue with AJAX but an issue with the link to the file. I can almost guarantee your linking is wrong somehow. If you enter the exact link the the file "file://x:/Image1.jpg" in the url filed of the browser, and nothing shows up, it proves there's an issue with your file links.
Related
I have a script that displays the images via php. www.maindomain.com/image.php?img=test.jpg serve images, and i have other sites, where these images are displayed like this
<img src="www.maindomain.com/image.php?img=test1.jpg">
But this script, for show image is on my www.firstsite.com and www.secondsite.com. Is posibble to log which site is showing image? (put it to database for example).
I know, i can use $_SERVER['HTTP_REFERER'] but it's not 100%. Any other ideas?
The only 100% failsafe way to do it is to share the same image with different URLs. F.i. www.maindomain.com/image.php?test1.jpg&ref=first and www.maindomain.com/image.php?test1.jpg&ref=second. As actually this images are not requested by first or second servers but by visitor's browsers. Having different GET params in URL makes it easy to log data you need.
Using shadowbox, I am displaying my images onto the screen like this:
<img src="images/thumbpic.jpg" width="100px" />
However I am looking for way to mask the image so that the URL path is not displayed. Otherwise the user will be able to access the image directly, by typing the URL into their address bar.
How can I do this?
This is not possible at all, since it's all client side and there's always a way to get that image. Same answer is for CSS & JS.
Disabling a hotlinking wouldn't help you, since this case has nothing to do with it (because you said by typing the URL into their address bar).
You could embed the image directly in the page. You then can't hotlink it and it would only be accessible from that page.
Here's an example: http://www.sweeting.org/mark/blog/2005/07/12/base64-encoded-images-embedded-in-html
Though, I don't believe this is supported on all browsers yet.
To prevent direct access to the images you should restrict the access to the images rather than trying to hide their URL.
To do this you can, for instance, modify your .htaccess file (a tool to generate an .htaccess file for this purpose can be found here).
In any case remember that the user can always (no matter what you do) save the images on his computer, you cannot prevent that, as the image is downloaded on the client when he visits your sites.
I am looking for some help in downloading pics from a website. Here is the problem detail.
URL is basvandenbroek dot com,
suppose when we visit the following page http://www.basvandenbroek.com/nl/product/27341/704/snaarinstrumenten/boston/snarenset_elektrisch.html
we have a thumbnail pic here which when click bring its larger version. I would like to capture the larger image using a php script and download it onto my pc.
Problem is when we inspect the HTML we see the following code for images
../../../../../../../jpg/27000/27341.jpg
../../../../../../../jpg/cache/27000/220_220_27341.jpg
Based on the above code i assume that if i append website address at the start of the
jpg/27000/27341.jpg I could access the pic but its not working it that.
I believe URL is hidden or I might not understanding things properly. I am new to PHP and Scripting and I would like somebody to help me through it situation.
Thank you
For the website you mentioned, if the thumbnail is
http://www.basvandenbroek.com/jpg/cache/27000/220_220_27341.jpg
then the
http://www.basvandenbroek.com/jpg/27000/27341.jpg
So the thumbnail is basically the dimensions (220 x 220) added as a prefix to the original in a different folder. Also, there is nothing like hidden URL. Any link that is valid on a web-page is sure to appear in the source of the html. In chrome and firefox, atleat, you can find this link by right-clicking the link and copying the link address.
In your case you can find the thumbnail's url by right-clicking the thumbnail and the original's url by right-clicking it.
However, if you want to do this automatically using PHP, you will have to write code that can parse the html for the page to determine the urls.
In your example, here would be the larger image:
http://www.basvandenbroek.com/jpg/27000/27341.jpg
The smaller image is at:
http://www.basvandenbroek.com/jpg/cache/27000/220_220_27341.jpg
This means you would need to scrape out the first two underscored parts of the name (220_220) using string manipulation. You would also want to string replace "cache/" with an empty string.
relative urls are relative to the url of the containing document. so if the document you're scraping is located at http://example.com/foo/bar/baz/doc.html, and the image is referenced as
../../omg/wtf/lol/cat.jpeg, its full url is http://example.com/foo/bar/baz/../../omg/wtf/lol/cat.jpeg, or http://example.com/foo/omg/wtf/lol/cat.jpeg.
btw, this has nothing to do with PHP or scripting in general, and is instead firmly a HTTP thing. and there are no "hidden" URLs in HTTP, that would be a contradiction.
edit: your comment makes it look like the problem is with the Referer header or session id sent (or not) in your request.
I'm displaying pieces of an image in a large grid created from divs. I'm using the background-image and background-position to display portions of the image. The problem I'm running in to is that a user can simply open up firebug and see the entire image (which defeats the purpose of the game).
I've attempted to mask the path using a php script as the URL but if the user navigates to the php file, they can still see the image. It would appear that anything I do with the CSS is entirely client side so denying everything outside the localhost in my .htaccess won't work.
Any suggestions?
The over arching goal is to have an automated way to split and display pieces of the image into a grid.
If you deliver the whole image to the browser, the browser holds the image and has every right to show it to a user. I don't think you can prevent the browser from showing it. I'm afraid you will have to deliver the image in pieces, or perhaps write your whole game using <canvas> and play around with images as pixel data. :)
How should i create a preview of image to be uploaded before it is actually submitted using AJAX in PHP?
Without uploading the image, this is going to be impossible in JavaScript as far as I can see, because security limitations are going to prevent you from determining the selected file in the file upload, and embedding that file in an img tag (as it used to be possible five years ago.)
You will be more lucky with Flash-based uploaders. I have seen some that offer the kind of functionality you want.
Update: Here's one that offers a preview function. From what I can see, it base64 encodes the local image and serves it to the surrounding HTML page as a inline data <img> tag. This is great because it might integrate well into your site. It does not work with any version of Internet Explorer, though.
Here's a fully Flash based solution that does previews in all browsers.
you first have to upload the document to server. Than you can show like.
<img src="uploads/file1_12224.jpg" />
The "file" input type doesn't expose the local file location of the file to be uploaded. It does "appear" to because as a user you can see the location, but the web page never knows this value. Without the local file address, you can't show a preview of the image on the web page using plain HTML or JavaScript.