Building a Simple File Sharing Application with PHP and JavaScript

In the era of ubiquitous connectivity, seamless file sharing is essential, and building your own file sharing application provides a practical way to master PHP and JavaScript.

1. Introduction

The application should support user authentication, a responsive UI, file upload/download, and file management such as deletion and organization.

2. Setting Up the Environment

Ensure PHP and a web server (e.g., Apache) are installed, then create a project directory with the following structure:

/uploads – stores uploaded files.

/css – stylesheet files.

/js – JavaScript files.

index.php – main entry point.

3. User Authentication

Use PHP sessions and a simple login form to protect the application. Example code:

session_start();
// Check if user is logged in
if (!isset($_SESSION['user_id'])) {
    header("Location: login.php");
    exit;
}

4. Building the Upload Form

Add an HTML form in index.php for file uploads:

<form action="upload.php" method="post" enctype="multipart/form-data">
    <input type="file" name="file" required>
    <button type="submit">Upload</button>
</form>

5. Handling File Uploads with PHP

Create upload.php to move uploaded files to the uploads/ directory and handle duplicate names:

$targetDir = "uploads/";
$targetFile = $targetDir . basename($_FILES['file']['name']);
// Check if file exists
if (file_exists($targetFile)) {
    echo "文件已存在。";
} else {
    move_uploaded_file($_FILES['file']['tmp_name'], $targetFile);
    echo "文件上传成功！";
}

6. Displaying Uploaded Files

Modify index.php to list files in the uploads folder:

$files = glob('uploads/*');
echo "<ul>";
foreach ($files as $file) {
    echo "<li><a href='$file' download>" . basename($file) . "</a></li>";
}
echo "</ul>";

7. File Deletion

Implement additional PHP scripts linked from the HTML to allow users to delete or reorganize files.

8. Styling with CSS and Enhancing with JavaScript

Use CSS to improve the UI and JavaScript (including AJAX) to add dynamic interactions for a smoother sharing experience.

9. Conclusion

You have built a basic file sharing system using PHP and JavaScript, and you can now extend it with more security, scalability, and custom features.