Testing file extension for image linking - html

Question

I am looking for a way to link an tag to a profile picture with the user's id as the file name. However, the extension of the image is dependent on the file extension when it was uploaded by the user.
My question is: how would one go about testing to see if a given image file name exists and cycle through the various file extensions for images.
For example:
Let's say and image is named: 1.jpg, but another is named 2.png.
I would like to implement the following in html:
<img src = "' + userId + '.jpg">
This will work for the furst user, but not the second. How would I go about testing the various image file extensions for the src?
Thanks

Answer 1

"File extensions" (indeed, anything regarding the name of the "file") are meaningless. Especially when it comes to HTTP requests. This URL could just as easily produce an image file:
http://www.example.com/foo.txt
Understand that there is no such thing as "files" in HTTP. There are requests and responses, each of which contain headers and content. A "file" is just a response with a content-disposition header. An "image" is a response with other headers which specify that it contains image data.
If you don't know the URL of the image, it could literally be anything.
the extension of the image is dependent on the file extension when it was uploaded by the user
In that case you should really be storing that information in your database. Whatever record holds the information for the user's profile would include the URL for the user's profile image. Use that data to build the img element.
Either store the data or enforce a convention. If you don't do either then you simply don't have that data.

Answer 2

Assuming you are using PHP & MySql store uploaded images like this
user_data/user_id/image.png
You can use php mkdir() function to create directory with user id
for example
mkdir("user_data/".$user_id,0777);
So your upload script be something like this
<?php
$fileName = $_FILES['uploadedFile']['name'];
if(!file_exists("user_data/".$user_id."/")){
mkdir("user_data/".$user_id,0777);
}
move_uploaded_file($_FILES['uploadedFile']['tmp_name'],user_data/".$user_id."/");
$conn = mysqli_connect($host,$user,$pass,$db_name);//Database connection
$sql = "INSERT INTO uploads(user_id,fileName) VALUES('$user_id','$_FILES['uploadedFile']['name']'";
$query = mysqli_query($conn,$sql) or die("Unable to update to database");
?>
Script for Retrieving Results
<?php
$conn = mysqli_connect($host,$user,$pass,$db_name);//Database connection
$sql = "SELECT * FROM uploads";
$query = mysqli_query($conn,$sql);
$data= mysqli_fetch_array($query);
?>
<img src"user_data/<?php echo "/".$user_id."/". $data['fileName']; ?>
There are some varialbes above like $user_id which you set & get from session variables