I have a form file upload. When the users goes to upload an image, it displays all files on their computer. How can I make the HTML upload dialog window to only display JPG, GIF and PNGs?
Just add accept to input with file types. This will filter the list of displayed files, but not create ban on download other files. This is convenient, because it is simple.
The file upload dialog in the web browser is outside of your control. You could create a Java applet for uploading images, like Facebook did.
As this hasn't been answered yet; add the following code to your file input
accept="image/x-png,image/gif,image/jpeg"
Related
I have a pdf document, whose path i have hardcoded into my webpage.
I also have a download link, clicking which the user can download the file.
<a href="Path\to\file" download>Click</a> (Works in HTML5)
However instead of having to carry both the webpage code and file separately, is it possible to incorporate the file data into the webpage itself and form a downloadable file whenever the user clicks on the link?
You can try to base64 encode that file and add it as link url:
DOWNLOAD
But adding file source to HTML is worst thing you can do. Why you need that? Your HTML will be loaded very slowly. CTRL + U and console debugging will be extra slow.
Instead of creating an additional text file and provide a link to it, can one embed some texts into an HTML file and provide a link to download it? The solution should work for a static website.
You should be able to base64 encode the file in the link, but you may want to do some cross-browser testing.
See Create a file in memory for user to download, not through server
If I understand correctly, you have a static website and you want to be able to create a link to a HTML page that should be downloaded instead of "viewed" in the browser.
The only way I can think of to solve this is to use the HTML 5 download attribute, like this:
Download
Is there a way to disable a user from downloading a file from a URL?
For example I have a link:
wow.mywebsitedomain.com/templates/filename.svg
I want to disable the user from downloading the filename.svg
These svg files are not just an image, they are editable designs that I have spent countless hours on each. No, I do not care if someone does a screenprint or gets a png etc, as those are not scalable, editable, vector files.
When the user clicks on a png thumbnail my actual link opens my online design editor to allow the user to customize these files, then save to my server, then purchase printed media, and they are not allowed to download any files.
I tried putting the actual files into a password protected folder on my server, but they do not open properly, and I do not want the user to have password access to this folder.
Essentially I need the link to be accessible, just not show the actual link for someone to copy and open/save/download etc.
Hopefully there is a simple solution for a non-programmer with basic html skills?
Thanks
Your can do things like "disabling right-click" and stuff - it may prevent some users from downloading your file, BUT basically you cannot prevent a file which is downloaded and interpreted by the browser from being downloaded to a user's hard drive.
This is not only true for SVGs, but also for music, videos, etc.
Instead, you can convert your SVG file to a PNG on server-side, and show only the PNG to the user. Note that you have the possibility to create PNGs of different sizes on the fly - dependent on the request, user's screen resolution, etc. You can also implement caching of the generated PNGs if needed.
On how to create a PNG from SVG in PHP read here:
Convert SVG image to PNG with PHP
You can choose other raster image format, of course.
If they can view it, they can download it. End of story. If you only want them to see a PNG, make a PNG from it and put that up
My understanding is; if you can see it, you can download it,
I have worked on many web apps that allow a person to upload and display images (like profile images, background image, etc). A problem I have come across is that you usually provide specific formats that the user can use (i.e jpg, png, jpeg, gif, etc).
Problem is, that suppose you have a profile picture, some may upload a jpeg, some png, and some gif. What format should you save the file in? i.e 'profile.jpeg', 'profile.png' or simply 'profile'.
I noticed that you can simply exclude the file extension and the browser opens the image, but is this safe?
The file extension does not determine the file format. You can upload a .gif that ends in a .png and the browser will display it with no difficulties. (You can also use .exe or .foo or whatever, and the image will still display.)
In other words, the extension has nothing to do with security.
On the other hand, I'm not aware of any security risks in passing an unknown file to the browser to display as an image. If you have <img src="virus.exe">, the browser will do nothing because the file is not a valid image file.
If you want to be sure, you could check on the server that the uploaded file is a valid image and discard if it's not.
I have a file upload box and would like the ability to change the file name, but clicking in the box just brings up the Open Dialog. How can I prevent this?
It is kind of security thing that you can't manipulate the upload boxes. Browsers like chrome are entering there a C:/fakepath/yourfile.jpgstring so nobody can spy files on your PC. You can't manipulate it with javascript as well.