Skip to content
This repository was archived by the owner on Jul 11, 2024. It is now read-only.

Commit b088808

Browse files
authored
v1.0.1
1 parent 1ddc97e commit b088808

File tree

2 files changed

+159
-0
lines changed

2 files changed

+159
-0
lines changed

index.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!DOCTYPE html>
2+
<html prefix="og: https://ogp.me/ns#">
3+
<head>
4+
<title>PHP File Uploader</title>
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<meta property="og:image" content="https://cdn.sappy.ga/img/saplogo.png" />
7+
8+
<meta property="og:description" content="Upload your images to the web." />
9+
10+
<meta property="og:url"content="http://cdn.sappy.ga/" />
11+
12+
<meta property="og:title" content="Sappy's CDN Upload " />
13+
<style>
14+
body {
15+
background-color: #404040;
16+
color: white;
17+
text-align: center;
18+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
19+
}
20+
.mainContent {
21+
padding: 170px 0px;
22+
}
23+
input[type=button],input[type=submit],input[type=reset] {
24+
background-color: #FF0000;
25+
border: none;
26+
color: white;
27+
padding: 16px 32px;
28+
text-decoration: none;
29+
margin: 4px 2px;
30+
cursor: pointer;
31+
32+
transition: 250ms;
33+
}
34+
input[type=file] {
35+
display: none;
36+
}
37+
.uploadButton:hover {
38+
background-color: #333;
39+
}
40+
.uploadButton {
41+
background-color: #555;
42+
border: none;
43+
color: white;
44+
padding: 16px 32px;
45+
text-decoration: none;
46+
margin: 10px 2px;
47+
cursor: pointer;
48+
min-width: %100;
49+
50+
transition: 250ms;
51+
}
52+
.inputButton:hover {
53+
background-color: brown;
54+
}
55+
.loginButton{
56+
padding: 5px 10px;
57+
background-color: #007bff;
58+
border-radius: 2px;
59+
color: white;
60+
text-decoration: none;
61+
transition: 500ms;
62+
}
63+
.loginButton:hover{
64+
background-color: #0069d9;
65+
}
66+
</style>
67+
</head>
68+
<body>
69+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
70+
<div class="mainContent">
71+
<a href="#" class="loginButton">Login</a>
72+
<h1>PHP File Uploader</h1>
73+
<form action="upload.php" method="post" enctype="multipart/form-data">
74+
<label for="fileToUpload" class="uploadButton">Select Your Image To Upload!</label>
75+
<input type="file" name="fileToUpload" id="fileToUpload"><br><br>Your Image:<br><br>
76+
<img id="blah" src="#" alt="" style="max-width: 200px; max-height: 200px;"/>
77+
<br><br>
78+
<input class="inputButton" type="submit" value="Upload Image" name="submit">
79+
</form>
80+
</div>
81+
<script>function readURL(input) {
82+
if (input.files && input.files[0]) {
83+
var reader = new FileReader();
84+
85+
reader.onload = function(e) {
86+
$('#blah').attr('src', e.target.result);
87+
}
88+
89+
reader.readAsDataURL(input.files[0]); // convert to base64 string
90+
}
91+
}
92+
93+
$("#fileToUpload").change(function() {
94+
readURL(this);
95+
});</script>
96+
</body>
97+
</html>

upload.php

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
<style>
2+
body {
3+
background-color: #404040;
4+
color: white;
5+
text-align: center;
6+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
7+
margin: auto;
8+
}
9+
</style>
10+
<?php
11+
$target_dir = "img/";
12+
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
13+
$uploadOk = 1;
14+
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
15+
16+
// Check if image file is a actual image or fake image
17+
if(isset($_POST["submit"])) {
18+
$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
19+
if($check !== false) {
20+
echo "File is an image - " . $check["mime"] . ".";
21+
$uploadOk = 1;
22+
} else {
23+
echo "File is not an image.";
24+
$uploadOk = 0;
25+
}
26+
}
27+
28+
// Check if file already exists
29+
if (file_exists($target_file)) {
30+
echo "Sorry, file already exists.";
31+
$uploadOk = 0;
32+
}
33+
34+
// Allow certain file formats
35+
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
36+
&& $imageFileType != "gif" ) {
37+
echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
38+
$uploadOk = 0;
39+
}
40+
41+
// Check file size
42+
if ($_FILES["fileToUpload"]["size"] > 5000000) {
43+
echo "Sorry, your file is too large.";
44+
$uploadOk = 0;
45+
}
46+
47+
// Check if $uploadOk is set to 0 by an error
48+
if ($uploadOk == 0) {
49+
echo "Sorry, your file was not uploaded.";
50+
// if everything is ok, try to upload file
51+
} else {
52+
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
53+
echo "The file ". htmlspecialchars( basename( $_FILES["fileToUpload"]["name"])). " has been uploaded. Path to your image is https://cdn.sappy.ga/img/". htmlspecialchars( basename( $_FILES["fileToUpload"]["name"])). "";
54+
} else {
55+
echo "Sorry, there was an error uploading your file.";
56+
}
57+
}
58+
?>
59+
<!DOCTYPE html>
60+
<html>
61+
<head><meta name="viewport" content="width=device-width, initial-scale=1"></head>
62+
</html>

0 commit comments

Comments
 (0)