Secure Photo Sharing

Chapter No Content Page No
1.0 1.1Synopsis 1
1.2 Organization Profiles
2.0 System Analysis 7

2.1Existing system
2.2Proposed system
2.3Project description
3.0 System Configuration 15
4.0 System Design 17

4.1Software description
4.2Domain introduction
4.3Diagrams
5.0 Design 42
5.1Frontend design
5.2Backend design
6.0 Sample Coding 53
7.0 Testing 72
8.0 Conclusion 76
9.0 Future Enhancement 78
10.0 References 80
CHAPTER 1
SYNOPSIS
Nowadays, in a ubiquitous world where everything is connected to the Internet
and where social networks play an important role in our lives, security and privacy is a
must. Billions of pictures are uploaded daily to social networks and, with them, parts of
our private life are disclosed. In this work, we propose a practical solution for secure
photo sharing on social network with independence of its architecture which can be either
centralised or distributed. This solution solves the inconsistencies that appear in
distributed social network as a consequence of treating photos and access policies
separately. Specifically, we solve this open problem by attaching an access policy to the
images and thus, each time a photo is re-shared, the access policy will travel together with
the image. As a research says the simple disclosure of date and place of birth of a profile
in Face book can be used to predict the Social Security Number (SSN) of a citizen in the
U.S. Many a times just by simply publishing their friends list, users might be revealing a
large amount of information. For example, through the use of prediction algorithms it is
possible to infer private information that was previously undisclosed. Sometimes
sensitive information even comes embedded in the photo as metadata and may identify
people on the photo by accompanying more information that could be exploited, like
captions, comments and photo tags; marked regions. Even if the individuals in a photo are
not explicitly identified by photo tags, the combination of publicly available information
and face recognition software can be used to infer someone’s identity. These kinds of
problems are defined as collateral damage: users unintentionally put their own privacy or
their friend’s privacy at risk when performing events on SNSs such as Face book [2].
With the ease and need of fulfilling our social needs social interactions, information
sharing, appreciation and respect Social Networking sites have became the integral part of
daily life. With this ease and nature of social media people put more content, including
photos, over OSNs without too much thought on the content.
1.2 ORGANIZATION PROFILES
ABOUT SCION RESEARCH & DEVELOPMENT

Founded in Feb2009, Scion Research & Development is one of the leaders in
advanced technique computer training programmes. Scion Research & Development
Courses covers A to Z in all areas of software, hardware & networking and multimedia.
The courses are designed to keep pace with the changing needs and times. Scion Research
& Development and generates software and hardware professionals. Students have been
given fantabulous computer training and they become extremely computer Savvy and
expertly handle the IT capabilities in their respective fields.
Scion Research & Development courses enable the students to prepare for the
coveted worldwide certifications. Theoretical teaching is reinforced with practical
training again and again. Guest lectures by experts from the group and outside are
periodically arranged for 100% industry exposure.
We do have a R&D group to discover and create new knowledge about scientific
and technological topics for the purpose of uncovering and enabling development of
valuable new products, processes, and services.
MISSION
Our mission is to delight our customers by providing excellence in IT services,
vales and results. This is achieved by building a world class and competitive team with
challenging, rewarding and growth oriented work. Our values include integrity, respect
for the individual, open and honest communication, partnering, innovation and
excellence.
VISION
Scion wish to become a company of world class employees, world class
customers and a desire to be the world leader in offshore consulting services. At scion, we
help turn ideas into reality. Scion stands out by virtue of building our success around one
customer at a time.
SCION OFFERS
 Assistance for Research Scholar
 Assistance for UG/ PG Students Project
 Journal Publications Support
 Corporate Training for Software
 On-Campus Training
 Placement Assistance
 In-plant Training & Industrial Visit
 Soft Skill Development
 Website Creation
DISCIPLINE IS ONE OF THE TOPMOST PRIORITIES IN TRAINING
The student trainee will keep regular attendance; the student will show honesty,
punctuality, courtesy, a cooperative attitude, proper health and grooming habits, good
dress, and a willingness to learn. Students must wearing ID card.
BENEFITS FOR STUDENTS
Providing jobs to campus graduates and professionals .We have partnership with
many marquees IT companies who have signed with us to hire trained talent force. Career
counselling which will help graduates to chose a career which promises growth &
stability.
CHAIRMAN'S MESSAGE
As founder and Chairman of Scion, I want to assure you that we will do
everything in our power to conduct ourselves in a professional manner and be highly
competitive and diligent in providing outstanding service to you in a timely, cost-
effective and quality manner.
We stand behind our contractual commitments to our clients and we will work
diligently to earn your trust and respect and deliver business and IT results with
excellence.
EXCELLENT CORPORATE TRAINING FACULTIES
We have training faculty with good communication skills and sound technical
knowledge. We are team professional, experienced, certified software trainers from a
myriad of industries. Because we came from the trenches and have worked with software
for many versions, we provide real life, practical knowledge to users of all levels. A
natural extension of training, we provide guidance in streamlining processes to save time
and money and eliminate redundancy
CORPORATE TRAINING FOR SOFTWARE
To provide training in software at par with corporate. Scion Research &
Development training covers A to Z in all areas of Software, Hardware & Networking
and Multimedia. The Courses are designed to keep pace with the changing needs and
times. Scion Research &Development and generates software and hardware
professionals.
ADMINISTRATION OFFICE
OFFICE ADDRESS:
No.17/595, 1st Floor Mannar Sarefoji Nagar 2nd Street,Opp.New Bus Stand,
Thanjavur-5.
CONTACT: 04362-228899, 9597754496.
E-MAIL: [email protected].
CHAPTER 2
SYSTEM ANALYSIS
2.1EXISTING SYSTEM
To preserve privacy in photo sharing, most existing focused on designing access
control based approaches, and little work considers the specific sharing scenario. This
existing work requires users to set privacy policy for each photo and hence is not
scalable. Moreover, since setting privacy policy for each photo is tedious and time-
consuming; many users may opt not to share photos, thus missing potential social
opportunities. Some other researchers focus on preserving the privacy of the bystanders
by using some special equipment or tags, which may not be practical.
Disadvantages
1. Lack of security in photo uploading

2. Did not know your post re-share.
2.2 PROPOSED SYSTEM
In this work, we propose a practical solution for secure photo sharing on social
network with independence of its architecture which can be either centralised or
distributed. This solution solves the inconsistencies that appear in distributed social
network as a consequence of treating photos and access policies separately. Specifically,
we solve this open problem by attaching an access policy to the images and thus, each
time a photo is re-shared, the access policy will travel together with the image.
Advantages
1. Easy to find each time a photo is re-shared

2. Download, screen shot, Print fun– All the functions are disable in this website.
2.3 PROJECT DESCRIPTION
Client End
Front Page – Using web application for the user to interact, download, and upload
images. Module to split the two images into 4 equal parts respectively. Function to apply
hashing technique to enhance the security .Module to overlap the two split images into a
single image. Module to encrypt the overlapped single image into a shared image. Apply
RSA algorithm with a key. This project proposes a system based on novel consensus,
approach to achieve efficiency and privacy at the same time. The main focus is to let each
user only deal with his/her private photo set as the local train data which can be used by
the users to learn out the local training result. Once the local training results are achieved
then it can be exchanged among various users to form a global knowledge.
Server end
Module to provide interface for the user to enter a key to decrypt the shared image.
Module to decrypt the shared image in order to obtain a single image which was
overlapped. Function to split overlapped image as two separate split share of images.
Function to compare the hash values which were generated during the encryption process
Function to obtain back the original confidential images which were initially uploaded
from the client end. Consider, for example, an app that allows users to report bugs
encountered while testing the beta version of a software application. The app will need a
way to store the contact details of each user together with a list of bugs reported by that
user. Each bug report will, in turn, consist of an ID that uniquely identifies the report, a
brief title and a detailed explanation of how to reproduce the problem. At first glance, it
might be tempting to structure the database as outlined in the partial JSON tree diagram
Functionalities
In this work, we propose a practical solution for secure photo sharing on social network
with independence of its architecture which can be either centralised or distributed. This
solution solves the inconsistencies that appear in distributed social network as a
consequence of treating photos and access policies separately. Specifically, we solve this
open problem by attaching an access policy to the images and thus, each time a photo is
re-shared, the access policy will travel together with the image.
CHAPTER 3
SYSTEM CONFIGURATION
Hardware Requirements
Hard disk : 1 TB
RAM : 4 GB
Processor : Core i3
Monitor : 15’’Color Monitor
Software Requirements
Front-End : HTML, CSS, and JS

Back end : PHP, MySQL
Operating System : Windows 10
IDE : Visual studio code
CHAPTER 4
SYSTEM DESIGN
4.1SOFTWARE DESCRIPTION
Front end – HTML, CSS, JS
An overview:
 HTML provides the basic structure of sites, which is enhanced and modified by
other technologies like CSS and JavaScript.
 CSS is used to control presentation, formatting, and layout.
 JavaScript is used to control the behavior of different elements.
Now, let's go over each one individually to help you understand the roles each plays on a
website and then we'll cover how they fit together. Let's start with good of' HTML.
HTML
HTML is at the core of every web page, regardless the complexity of a site or number of
technologies involved. It's an essential skill for any web professional. It's the starting
point for anyone learning how to create content for the web. And, luckily for us, it's
surprisingly easy to learn.
Markup languages work in the same way as you just did when you labeled those content
types, except they use code to do it -- specifically, they use HTML tags, also known as
"elements." These tags have pretty intuitive names: Header tags, paragraph tags, image
tags, and so on.
Every web page is made up of a bunch of these HTML tags denoting each type of content
on the page. Each type of content on the page is "wrapped" in, i.e. surrounded by, HTML
tags.
For example, the words you're reading right now are part of a paragraph. If I were coding
this web page from scratch (instead of using the WYSIWG editor in HubSpot's COS), I
would have started this paragraph with an opening paragraph tag: <p>. The "tag" part is
denoted by open brackets, and the letter "p" tells the computer that we're opening a
paragraph instead of some other type of content.
Once a tag has been opened, all of the content that follows is assumed to be part of that
tag until you "close" the tag. When the paragraph ends, I'd put a closing paragraph tag:
</p>. Notice that closing tags look exactly the same as opening tags, except there is a
forward slash after the left angle bracket. Here's an example:
<p>This is a paragraph.</p>
Using HTML, you can add headings, format paragraphs, control line breaks, make lists,
emphasize text, create special characters, insert images, create links, build tables, control
some styling, and much more.
To learn more about coding in HTML, I recommend checking out our guide to basic
HTML, and using the free classes and resources on codecademy -- but for now, let's move
on to CSS.
CSS
CSS stands for Cascading Style Sheets. This programming language dictates how the
HTML elements of a website should actually appear on the frontend of the page.
If HTML is the drywall, CSS is the paint.
Whereas HTML was the basic structure of your website, CSS is what gives your entire
website its style. Those slick colors, interesting fonts, and background images? All thanks
to CSS. This language affects the entire mood and tone of a web page, making it an
incredibly powerful tool -- and an important skill for web developers to learn. It's also
what allows websites to adapt to different screen sizes and device types.
To show you what CSS does to a website, look at the following two screenshots. The first
screenshot is my colleague's blog post, but shown in Basic HTML, and the second
screenshot is that same blog post with HTML and CSS.
JavaScript
JavaScript is a more complicated language than HTML or CSS, and it wasn't released in
beta form until 1995. Nowadays, JavaScript is supported by all modern web browsers and
is used on almost every site on the web for more powerful and complex functionality.
avaScript is particularly useful for assigning new identities to existing website elements,
according to the decisions the user makes while visiting the page. For example, let's say
you're building a landing page with a form you'd like to generates leads from by capturing
information about a website visitor. You might have a "string" of JavaScript dedicated to
the user's first name. That string might look something like this:
Then, after the website visitor enters his or her first name -- and any other information
you require on the landing page -- and submits the form, this action updates the identity
of the initially undefined "Firstname" element in your code. Here's how you might thank
your website visitor by name in JavaScript:
para.textContent = 'Thanks, ' + First name + "! You can now download your ebook."
In the string of JavaScript above, the "First name" element has been assigned the first
name of the website visitor, and will therefore produce his or her actual first name on the
frontend of the webpage.
Back end – PHP, MySQL

To develop an understanding of how PHP works it is helpful to first explore what
happens when a web page is served to a user's browser.
When a user visits a web site or clicks on a link on a page the browser sends a
request to the web server hosting the site asking for a copy of the web page. The web
server receives the request, finds the corresponding web page file on the file system and
sends it back, over the internet, to the user's browser.
Typically the web server doesn't pay any attention to the content of the file it has
just transmitted to the web browser. As far as the web server is concerned the web
browser understands the content of the web page file and knows how to interpret and
render it so that it appears as the web designer intended.
Now let's consider what kind of web page content a web browser understands.
These days a web page is likely to consist of HTML, XHTML and JavaScript. The web
browser contains code that tells it what to do with these types of content. For example, it
understands the structure HTML in terms of rendering the page and it has a JavaScript
interpreter built in that knows how to execute the instructions in a JavaScript script. A
web browser, however, knows absolutely nothing about any PHP script that may be
embedded in an HTML document. If a browser was served a web page containing PHP it
would not know how to interpret that code.
Given that a web browser knows nothing about PHP in a web page, then clearly
something has to be done with any PHP script in the page before it reaches the browser.
This is where the PHP pre-processing module comes in. The PHP module is, as
mentioned previously, integrated into the web server. The module tells the web server
that when a page is to be served which contains PHP script (identified by special markers)
that it is to pass that script to the PHP pre-processing module and wait for the PHP
module to send it some content to replace that script fragment. The PHP processing
module understands PHP, executes the PHP script written by the web developer and,
based on the script instructions, creates output that the browser will understand. The web
server substitutes the content provided by the PHP pre-processor module in place of the
PHP script in the web page and sends it to the browser where it is rendered for the user to
view.
SQL is a language to operate databases; it includes database creation, deletion,
fetching rows, modifying rows, etc. SQL is an ANSI (American National Standards
Institute) standard language, but there are many different versions of the SQL language.
What is SQL?
SQL is Structured Query Language, which is a computer language for storing,
manipulating and retrieving data stored in a relational database.
SQL is the standard language for Relational Database System. All the Relational
Database Management Systems (RDMS) like MySQL, MS Access, Oracle, Sybase,
Informix, Postgres and SQL Server use SQL as their standard database language.
Also, they are using different dialects, such as −
 MS SQL Server using T-SQL,
 Oracle using PL/SQL,
 MS Access version of SQL is called JET SQL (native format) etc.
Why SQL?
SQL is widely popular because it offers the following advantages −
 Allows users to access data in the relational database management systems.
 Allows users to describe the data.
 Allows users to define the data in a database and manipulate that data.
 Allows embedding within other languages using SQL modules, libraries & pre-
compilers.
 Allows users to create and drop databases and tables.
 Allows users to create view, stored procedure, functions in a database.
4.2 DOMAIN INTRODUCTION
Information Security
Information security, often shortened to infosec, is the practice, policies and
principles to protect digital data and other kinds of information. infosec responsibilities
include establishing a set of business processes that will protect information assets,
regardless of how that information is formatted or whether it is in transit, is being
processed or is at rest in storage.
Generally, an organization applies information security to guard digital information
as part of an overall cyber security program. infosec's three primary principles, called the
CIA(confidentiality, integrity and availability) triad.
In short, infosec is how you make sure your employees can get the data they need,
while keeping anyone else from accessing it. It can also be associated with risk
management and legal regulations.
The CIA infosec triad
The CIA triad: confidentiality, integrity and availability
Principles of information security
The CIA triad
The overall goal of infosec is to let the good guys in, while keeping the bad guys
out. The three primary tenants to support this are confidentiality, integrity and
availability. This is called the CIA triad, or the three pillars or principles of information
security.
Confidentiality is the principle that information should only be available to those
with the proper authorization to that data. Integrity is the principle that information is
consistent, accurate and trustworthy. Availability is the principle that information is easily
accessible by those with proper authorization and will remain so in case of failure to
minimize interruptions to users.
These three principles do not exist in isolation, but they inform and affect one
another. Therefore, any infosec system will involve a balance of these factors. As an
extreme example, information only available as a written sheet of paper stored in a vault
is confidential but not easily available. Information carved into stone displayed in the
lobby has a lot of integrity but is not confidential or available.
4.3 DIAGRAMS
Architecture Diagram
Data Flow Diagram
A data-flow diagram (DFD) is a way of representing a flow of a data of
a process or a system. The DFD also provides information about the outputs and inputs of
each entity and the process itself. A data-flow diagram has no control flow; there are no
decision rules and no loops. Specific operations based on the data can be represented by
a flowchart.
Use Case Diagram
A use case diagram is a graphic depiction of the interaction among the elements of a
system. A Use case diagram is methodology used in system analysis to identify, clarify,
and organize system requirements .the actor, usually individuals involved with system
defined according to their roles.
Class Diagram
Class diagram is the type of static structure diagram that describe the structure of a
system by showing the systems classes, their attributes operations or methods under
relationship among the objects.
Activity Diagram
Activity diagram is another important diagram in UML to describe the dynamic
aspects of the system. Activity diagram is basically a flowchart to represent the flow from
one activity to another activity. The activity can be described as an operation of the
system. The control flow is drawn from one operation to another. This flow can be
sequential, branched, or concurrent. Activity diagrams deal with all type of flow control
by using different elements such as fork, join, etc.
E-R Diagram
An Entity Relationship (ER) Diagram is a type of flowchart that illustrates how
“entities” such as people, objects or concepts relate to each other within a system. ER
Diagrams are most often used to design or debug relational databases in the fields of
software engineering, business information systems, education and research.
CHAPTER 5
DESIGN
5.1 FRONTEND DESIGN
5.2BACKEND DESIGN
DB Design:
SAMPLE CODING
Index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>User Login</title>
<link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="shortcut icon" href="/static/img/logo.png">
<style>
body, html {
height:100%
</style>
</head>
<body >
<div id="loader" style="position:fixed;width:100%;height:100%;background-

color:rgba(106, 17, 203, 1);z-index: 10000;top:0px;display: none;">
<div class="spinner-border" style="color:#fff;position:fixed;top:48%;left:49%;"

role="status">
<span class="sr-only"></span>
</div>
</div>
<section class="gradient-custom h-100">
<div class="container py-1 h-100">
<div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-12 col-md-8 col-lg-6 col-xl-5">
<div class="card" style="border-radius: 1rem;background-color:#f5f5f5;">
<form onsubmit="document.getElementById('loader').style.display='block'"
action="/login.php" method="POST" class="card-body p-4 text-center">
<h2 class="fw-bold mb-4 text-uppercase text-primary" style="font-weight:800">User

Login</h2>
<div class="form-floating mb-3">
<input required type="email" name="email" class="form-control" id="floatingInput"

placeholder="Email">
<label for="floatingInput">Email</label>
</div>
<input required type="password" name="password" class="form-control"

id="floatingInput" placeholder="password">
<label for="floatingInput">Password</label>
</div>
<button class="btn btn-primary btn-lg px-5 mb-2" type="submit">Login</button>
<hr>
Don't you have an Account? <a href="/signup.php">Signup</a>
</div>
</div>
</div>
</div>
</div>
</section>
<style>
.gradient-custom {
background: -webkit-linear-gradient(to right, rgba(106, 17, 203, 1), rgba(37, 117, 252,
1));
background: linear-gradient(to right, rgba(106, 17, 203, 1), rgba(37, 117, 252, 1))
</style>
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
if(urlParams.get('err')){
document.write("<div id='err' style='position:fixed;bottom:30px; right:30px;background-

color:tomato;padding:10px;border-radius:10px;box-shadow:2px 2px 4px
#aaa;color:white;font-weight:600'>"+urlParams.get('err')+"</div>")
}
setTimeout(()=>{
document.getElementById("err").style.display="none"
}, 5000)
if(urlParams.get('msg')){
document.write("<div id='msg' style='position:fixed;bottom:30px;

right:30px;background-color:green;padding:10px;border-radius:10px;box-shadow:2px
2px 4px #aaa;color:white;font-weight:600'>"+urlParams.get('msg')+"</div>")
setTimeout(()=>{
document.getElementById("msg").style.display="none"
}, 5000)
</script>
<script src="/static/js/bootstrap.bundle.js"></script>
</body>
</html>
Login.php
<?php
require("./user/layout/db.php");
$email = $_POST["email"];
$password = $_POST["password"];
$sql = "SELECT * FROM user where email='$email'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
if ($row["password"]==$password) {
if(!isset($_SESSION))
session_start();
$_SESSION["id"] = $row["id"];
header("Location: /user/");
die();
} else {
header("Location: /?err=Email or Password is Wrong !");
die();
}else{
die();
}
?>
Register.php
<?php
$name = $_POST["name"];
$sql="INSERT INTO user(name,email,password)

VALUE('$name','$email','$password')";
$conn->query($sql);
header("Location: /?msg=Signup Successfully!");
die();
?>
Signup.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>User Signup</title>
<style>
body, html {
height:100%
</style>
</head>
<body >


role="status">
</div>
</div>

action="/register.php" method="POST" class="card-body p-4 text-center">

Signup</h2>
<input required type="text" name="name" class="form-control" id="floatingInput"

placeholder="Name">
<label for="floatingInput">Name</label>
</div>

</div>

</div>
<button class="btn btn-primary btn-lg px-5 mb-2" type="submit">Signup</button>
<hr>
Do you have an Account? <a href="/">Login</a>
</div>
</div>
</div>
</div>
</div>
</section>
<style>
.gradient-custom {
1));
</style>
<script>


setTimeout(()=>{
}, 5000)

setTimeout(()=>{
}, 5000)
</script>
</body>
</html>
user/access.php
<?php
require("./layout/db.php");
$id = $_POST["id"];
$conn->query("UPDATE access SET status='OK' WHERE id='$id'");
header("Location: /user/home.php?msg=Access Granded Successfully !");
die();
?>
user/home.php
<?php require("./layout/Header.php") ?>
<?php require("./layout/db.php") ?>
<div class="container mt-3">
<main class="row mt-4">
<?php
session_start();
$sid = $_SESSION["id"];
$result = $conn->query("SELECT * FROM photo WHERE uid='$sid'");
if($result->num_rows > 0){

while($row = $result->fetch_assoc()){
$uid=$row["uid"];
$iid=$row["id"];
$result1 = $conn->query("SELECT * FROM user WHERE id='$uid'");
while($row1 = $result1->fetch_assoc()){
?>
<section class="col-3 card p-2">
<p style="color:gray">Owner: <span style="color:#2b74e2"><?php

echo($row1["name"]) ?></span></p>
<p style="color:gray">Image : <a target="_blank" href="/user/uploads/<?php

echo($row["img"]) ?>" style="color:#2b74e2">Click here</a></p>
<?php
$result2 = $conn->query("SELECT * FROM access WHERE iid='$iid' AND

status='NOT'");
if($result2->num_rows > 0) {
while($row2=$result2->fetch_assoc()){
?>
<form method="post" action="/user/access.php">
<input type="hidden" value="<?php echo($row2["id"])?>" name="id">
<?php
$mid=$row2["uid"];
$result5 = $conn->query("SELECT name from user WHERE id='$mid'");
?>
<label for=""><?php echo($row5["name"]) ?> : </label>
<?php
?>
<button class="btn btn-success">Grant</button>
</form>
<?php
?>
</section>
<?php
}else{
echo("<p style='color:gray;text-align:center'>Nothing Found</p>");
?>
</main>
<script>


color:#FF0000;padding:10px;border-radius:10px;box-shadow:2px 2px 4px
setTimeout(()=>{
}, 3000)
</script>
<script>

right:30px;background-color:#4CAF50;padding:10px;border-radius:10px;box-
shadow:2px 2px 4px
#aaa;color:white;font-weight:600'>"+urlParams.get('msg')+"</div>")
setTimeout(()=>{
}, 3000)
</script>
<?php require("./layout/Footer.php") ?>
user/img.php
<?php
$target_dir = "./uploads/";
$file = strtotime("now").basename($_FILES["image"]["name"]);
$target_file = $target_dir . $file;
session_start();
if (move_uploaded_file($_FILES["image"]["tmp_name"], $target_file)) {
$sql = "INSERT INTO photo(uid,img) VALUE('$sid','$file')";
if ($conn->query($sql) === TRUE) {
$last_id = $conn->insert_id;
$conn->query("INSERT INTO access(uid,iid,status) VALUE('$sid','$last_id','OK')");
header("Location: /user?page=1&msg=Image uploaded Successfully !");
die();
} else {
header("Location: /user?page=1&err=Something went Wrong!");

die();
} else {
die();
?>
user//index.php
<button type="button" style="color:#fff;background-

color:#2b74e2;position:fixed;bottom:50px;right:50px" class="btn" data-bs-
toggle="modal" data-bs-target="#myModal">
</button>
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" style="color:#2b74e2">Upload Image</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>

<div class="modal-body">
enctype="multipart/form-data" action="/user/img.php" method="post">
<div class="form-floating mb-3 mt-3">
<input required type="file" class="form-control" name="image" placeholder="Select

Image">
<label>Select Image</label>
</div>
<div style="display:flex;justify-content:flex-end">
<button class="btn w-25"

style="background-color:#2b74e2;color:#fff">Upload</button>
</div>
</form>
</div>
</div>
</div>
</div>
<?php
session_start();
$result = $conn->query("SELECT * FROM photo WHERE NOT uid='$sid'");
$uid=$row["uid"];
$iid=$row["id"];
?>
<p style="color:gray">User : <span style="color:#2b74e2"><?php

<?php
$result2 = $conn->query("SELECT * FROM access WHERE iid='$iid' AND uid='$sid'");

if($row2["status"]=="OK"){
?>
<a target="_blank" href="/user/uploads/<?php echo($row["img"]) ?>" class="btn btn-

secondary my-2">view</a>
<?php
}else{
?>
<p style="color:gray;text-align:center">Waiting for approval</p>
<?php
}else{
?>
<form method="post" action="/user/request.php">
<input type="hidden" name="id" value="<?php echo($iid)?>">
<button class="btn btn-primary my-2 w-100">Request Access</button>
</form>
<?php
?>
</section>
<?php
}else{
?>
</main>
<script>

setTimeout(()=>{
}, 3000)
</script>
<script>

shadow:2px 2px 4px
setTimeout(()=>{
}, 3000)
</script>
user/request.php
<?php
$iid = $_POST["id"];
session_start();
$conn->query("INSERT INTO access(uid,iid,status) VALUE('$sid','$iid','NOT')");
die();
?>
Db.php
<?php
$servername = "localhost";
$username = "root";
$password = "trysomething";
$db_name = "photo";
$conn = new mysqli($servername, $username, $password,$db_name);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
?>
user/header
<!DOCTYPE html>
<html lang="en">
<head>
<title>User</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="icon" href="/static/images/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="/static/js/moment.js"></script>
</head>
<body>

<nav class="navbar navbar-expand-lg sticky-top" style="background:white;box-

shadow:1px 1px 2px #aaa;">
<div class="container">
<a class="navbar-brand" style="font-size:22px;font-weight:900;color:#2b74e2" href="">
User
</a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link <?php if($_SERVER['PHP_SELF'] == '/user/index.php'){ echo

'active'; } ?>" aria-current="page" href="/user/">Home</a>
</li>
<a class="nav-link <?php if($_SERVER['PHP_SELF'] == '/user/home.php'){ echo

'active'; } ?>" aria-current="page" href="/user/home.php">Library</a>
</li>
<a class="nav-link" onclick="return confirm('Do you want to Logout?')"

href="/">Logout</a>
</li>
</ul>
</div>
</div>
</nav>
User/Footer.php
</body>
</html>
Style.css:
::-webkit-scrollbar {
width: 5px;
}
::-webkit-scrollbar-track {
background: #f1f1f1;
::-webkit-scrollbar-thumb {
border-radius: 20px;
background: #aaa;
::-webkit-scrollbar-thumb:hover {
background: #aaa;
*{
margin:0px;
padding:0px;
font-family: 'Open Sans', sans-serif;
line-height: 1.7;
html,
body {
height: 100%;
}
a.active {
color: #2b74e2 !important;
font-weight: 700;
text-shadow: 1px 1px 1px #aaa;
Index.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>User Login</title>
<style>
body, html {
height:100%
</style>
</head>
<body >

role="status">
</div>
</div>
action="/login.php" method="POST" class="card-body p-4 text-center">

Login</h2>

</div>

</div>
<button class="btn btn-primary btn-lg px-5 mb-2" type="submit">Login</button>
<hr>
Don't you have an Account? <a href="/signup.php">Signup</a>
</div>
</div>
</div>
</div>
</div>
</section>
<style>
.gradient-custom {
1));
</style>
<script>

setTimeout(()=>{
}, 5000)

setTimeout(()=>{
}, 5000)
</script>
</body>
</html>
Login.php
<?php
$sql = "SELECT * FROM user where email='$email'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
if ($row["password"]==$password) {
session_start();
$_SESSION["id"] = $row["id"];
header("Location: /user/");
die();
} else {
die();
}
}else{
die();
?>
Register.php
<?php
$name = $_POST["name"];
$sql="INSERT INTO user(name,email,password)

VALUE('$name','$email','$password')";
$conn->query($sql);
header("Location: /?msg=Signup Successfully!");
die();
?>
Signup.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>User Signup</title>
<style>
body, html {
height:100%
</style>
</head>
<body >


role="status">
</div>
</div>
action="/register.php" method="POST" class="card-body p-4 text-center">

Signup</h2>
<input required type="text" name="name" class="form-control" id="floatingInput"

placeholder="Name">
<label for="floatingInput">Name</label>
</div>

</div>

</div>
<button class="btn btn-primary btn-lg px-5 mb-2" type="submit">Signup</button>
<hr>
Do you have an Account? <a href="/">Login</a>
</div>
</div>
</div>
</div>
</div>
</section>
<style>
.gradient-custom {
1));
}
</style>
<script>

setTimeout(()=>{
}, 5000)

setTimeout(()=>{
}, 5000)
</script>
</body>
</html>
user/access.php
<?php
$id = $_POST["id"];
$conn->query("UPDATE access SET status='OK' WHERE id='$id'");
header("Location: /user/home.php?msg=Access Granded Successfully !");
die();
?>
user/home.php
<?php
{
session_start();
$result = $conn->query("SELECT * FROM photo WHERE uid='$sid'");
$uid=$row["uid"];
$iid=$row["id"];
?>
<p style="color:gray">Owner: <span style="color:#2b74e2"><?php

<p style="color:gray">Image : <a target="_blank" href="/user/uploads/<?php

echo($row["img"]) ?>" style="color:#2b74e2">Click here</a></p>
<?php
$result2 = $conn->query("SELECT * FROM access WHERE iid='$iid' AND

status='NOT'");
while($row2=$result2->fetch_assoc()){
?>
<form method="post" action="/user/access.php">
<input type="hidden" value="<?php echo($row2["id"])?>" name="id">

<?php
$mid=$row2["uid"];
$result5 = $conn->query("SELECT name from user WHERE id='$mid'");
?>
<label for=""><?php echo($row5["name"]) ?> : </label>
<?php
?>
<button class="btn btn-success">Grant</button>
</form>
<?php
?>
</section>
<?php
}else{
?>
</main>
<script>

setTimeout(()=>{
}, 3000)
</script>
<script>

shadow:2px 2px 4px
setTimeout(()=>{
}, 3000)
</script>
user/img.php
<?php
$target_dir = "./uploads/";
$file = strtotime("now").basename($_FILES["image"]["name"]);
$target_file = $target_dir . $file;
session_start();
if (move_uploaded_file($_FILES["image"]["tmp_name"], $target_file)) {
$sql = "INSERT INTO photo(uid,img) VALUE('$sid','$file')";
if ($conn->query($sql) === TRUE) {
$last_id = $conn->insert_id;
$conn->query("INSERT INTO access(uid,iid,status) VALUE('$sid','$last_id','OK')");
die();
} else {
die();
} else {
die();
?>
user//index.php
<button type="button" style="color:#fff;background-

color:#2b74e2;position:fixed;bottom:50px;right:50px" class="btn" data-bs-
toggle="modal" data-bs-target="#myModal">
</button>
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" style="color:#2b74e2">Upload Image</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>

<div class="modal-body">
enctype="multipart/form-data" action="/user/img.php" method="post">
<div class="form-floating mb-3 mt-3">
<input required type="file" class="form-control" name="image" placeholder="Select

Image">
<label>Select Image</label>
</div>
<div style="display:flex;justify-content:flex-end">
<button class="btn w-25"

style="background-color:#2b74e2;color:#fff">Upload</button>
</div>
</form>
</div>
</div>
</div>
</div>
<?php
session_start();
$result = $conn->query("SELECT * FROM photo WHERE NOT uid='$sid'");
$uid=$row["uid"];
$iid=$row["id"];
?>
<p style="color:gray">User : <span style="color:#2b74e2"><?php

<?php
$result2 = $conn->query("SELECT * FROM access WHERE iid='$iid' AND uid='$sid'");
if($row2["status"]=="OK"){
?>
<a target="_blank" href="/user/uploads/<?php echo($row["img"]) ?>" class="btn btn-

secondary my-2">view</a>
<?php
}else{
?>
<p style="color:gray;text-align:center">Waiting for approval</p>
<?php
}else{
?>
<form method="post" action="/user/request.php">
<input type="hidden" name="id" value="<?php echo($iid)?>">
<button class="btn btn-primary my-2 w-100">Request Access</button>

</form>
<?php
?>
</section>
<?php
}else{
?>
</main>
<script>

}
setTimeout(()=>{
}, 3000)
</script>
<script>

shadow:2px 2px 4px
setTimeout(()=>{
}, 3000)
</script>
user/request.php
<?php
$iid = $_POST["id"];
session_start();
$conn->query("INSERT INTO access(uid,iid,status) VALUE('$sid','$iid','NOT')");
die();
?>
Db.php
<?php
$servername = "localhost";
$username = "root";
$password = "trysomething";
$db_name = "photo";
$conn = new mysqli($servername, $username, $password,$db_name);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
?>
user/header
<!DOCTYPE html>
<html lang="en">
<head>
<title>User</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="icon" href="/static/images/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="/static/js/moment.js"></script>
</head>
<body>

<nav class="navbar navbar-expand-lg sticky-top" style="background:white;box-

shadow:1px 1px 2px #aaa;">
<div class="container">
<a class="navbar-brand" style="font-size:22px;font-weight:900;color:#2b74e2" href="">
User
</a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<a class="nav-link <?php if($_SERVER['PHP_SELF'] == '/user/index.php'){ echo

'active'; } ?>" aria-current="page" href="/user/">Home</a>
</li>
<a class="nav-link <?php if($_SERVER['PHP_SELF'] == '/user/home.php'){ echo

'active'; } ?>" aria-current="page" href="/user/home.php">Library</a>
</li>
<a class="nav-link" onclick="return confirm('Do you want to Logout?')"

href="/">Logout</a>
</li>
</ul>
</div>
</div>
</nav>
User/Footer.php
</body>
</html>
Style.css:
::-webkit-scrollbar {
width: 5px;
::-webkit-scrollbar-track {
background: #f1f1f1;
::-webkit-scrollbar-thumb {
border-radius: 20px;
background: #aaa;
::-webkit-scrollbar-thumb:hover {
background: #aaa;
*{
margin:0px;
padding:0px;
font-family: 'Open Sans', sans-serif;
line-height: 1.7;
html,
body {
height: 100%;
a.active {
color: #2b74e2 !important;
font-weight: 700;
text-shadow: 1px 1px 1px #aaa;
}
CHAPTER 7
TESTING
SYSTEM TESTING
The purpose of testing is to discover errors. Testing is the process of trying to

discover every conceivable fault or weakness in a work product. It provides a way to
check the functionality of components, sub assemblies, assemblies and/or a finished
product It is the process of exercising software with the intent of ensuring that the
Software system meets its requirements and user expectations and does not fail in an
unacceptable manner. There are various types of test. Each test type addresses a specific
testing requirement.
TYPES OF TESTS:
Testing is the process of trying to discover every conceivable fault or weakness in

a work product. The different type of testing is given below:
UNIT TESTING:
Unit testing involves the design of test cases that validate that the internal program
logic is functioning properly, and that program inputs produce valid outputs. All decision
branches and internal code flow should be validated. It is the testing of individual
software units of the application .it is done after the completion of an individual unit
before integration.
This is a structural testing, that relies on knowledge of its construction and is invasive.
Unit tests perform basic tests at component level and test a specific business process,
application, and/or system configuration. Unit tests ensure that each unique path of a
business process performs accurately to the documented specifications and contains
clearly defined inputs and expected results.
INTEGRATION TESTING:
Integration tests are designed to test integrated software components to determine

if they actually run as one program. Testing is event driven and is more concerned with
the basic outcome of screens or fields. Integration tests demonstrate that although the
components were individually satisfaction, as shown by successfully unit testing, the
combination of components is correct and consistent. Integration testing is specifically
aimed at exposing the problems that arise from the combination of components.
FUNCTIONAL TEST:
Functional tests provide systematic demonstrations that functions tested are available
as specified by the business and technical requirements, system documentation, and user
manuals.
Functional testing is centered on the following items:
Valid Input : identified classes of valid input must be accepted.
Invalid Input : identified classes of invalid input must be rejected.
Functions : identified functions must be exercised.
Output : identified classes of application outputs must be

exercised.
Systems/ Procedures: interfacing systems or procedures must be invoked.
Organization and preparation of functional tests is focused on requirements, key

functions, or special test cases. In addition, systematic coverage pertaining to identify
Business process flows; data fields, predefined processes, and successive processes must
be considered for testing. Before functional testing is complete, additional tests are
identified and the effective value of current tests is determined.
PERFORMANCE TESTING:
System testing ensures that the entire integrated software system meets requirements.
It tests a configuration to ensure known and predictable results. An example of system
testing is the configuration oriented system integration test. System testing is based on
process descriptions and flows, emphasizing pre-driven process links and integration
points.
WHITE BOX TESTING:

White Box Testing is a testing in which in which the software tester has knowledge
of the inner workings, structure and language of the software, or at least its purpose. It is
purpose. It is used to test areas that cannot be reached from a black box level.
BLACK BOX TESTING:
Black Box Testing is testing the software without any knowledge of the inner workings,
structure or language of the module being tested. Black box tests, as most other kinds of
tests, must be written from a definitive source document, such as specification or
requirements document, such as specification or requirements document. It is a testing in
which the software under test is treated, as a black box .you cannot “see” into it. The test
provides inputs and responds to outputs without considering how the software works.
ACCEPTANCE TESTING:
User Acceptance Testing is a critical phase of any project and requires significant
participation by the end user. It also ensures that the system meets the functional
requirements.
Test Results: All the test cases mentioned above passed successfully. No defects
encountered
CHAPTER 8
CONCLUSION
How the images are being transmitted from one end to other securely, providing
different security methods at different stages are being presented and discussed in this
paper. However there are stages differentiated at both client end and the server end with
appropriate modules. Based on these things we would recommend that this project would
work successfully and efficiently.
CHAPTER 9
FUTURE ENHANCEMENT
In future the work of instant messaging and further module development can be
done which will make our project fully automated and also more reliable software for the
event should be provided.
CHAPTER 10
REFERENCES
[1] Vrinda A, Mr. Arun Anoop M, “Securing Images using Encryption Techniques”,
International Journal of Computing and Technology, Volume 1, Issue 2, March 2014.
[2] Aman Jain, Namita Tiwari, Madhu Shandilya, “Image Based Encryption Techniques”,
International Journal of Computer Science and Information Technologies, Vol. 5 (3),
2014.
[3] Mohammad Sajid Qamruddin Khizrai , Prof.S.T.Bodkhe , ”Image Encryption using

Different Techniques for High Security Transmission over a Network”, International
Journal of Engineering Research and General Science, Volume 2, Issue 4, June-July,
2014.
[4] Xinpeng Zhang, Yanli Ren, Liquan Shen, Zhenxing Qian, and Guorui Feng,
”Compressing Encrypted Images With Auxiliary Information”, IEEE transactions on
multimedia, vol. 16, no. 5, august 2014.

Secure Photo Sharing

Uploaded by

Copyright:

Available Formats

Secure Photo Sharing

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Secure Photo Sharing

Uploaded by

Copyright:

Available Formats

Chapter No Content Page No

2.0 System Analysis 7

3.0 System Configuration 15

4.0 System Design 17

6.0 Sample Coding 53

9.0 Future Enhancement 78

ABOUT SCION RESEARCH & DEVELOPMENT

1. Lack of security in photo uploading

1. Easy to find each time a photo is re-shared

Front-End : HTML, CSS, and JS

If HTML is the drywall, CSS is the paint.

Back end – PHP, MySQL

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="/static/css/bootstrap.min.css">

<link rel="shortcut icon" href="/static/img/logo.png">

<div id="loader" style="position:fixed;width:100%;height:100%;background-

<div class="spinner-border" style="color:#fff;position:fixed;top:48%;left:49%;"

<section class="gradient-custom h-100">

<div class="container py-1 h-100">

<div class="row d-flex justify-content-center align-items-center h-100">

<div class="col-12 col-md-8 col-lg-6 col-xl-5">

<div class="card" style="border-radius: 1rem;background-color:#f5f5f5;">

<h2 class="fw-bold mb-4 text-uppercase text-primary" style="font-weight:800">User

<div class="form-floating mb-3">

<input required type="email" name="email" class="form-control" id="floatingInput"

<div class="form-floating mb-3">

<input required type="password" name="password" class="form-control"

Don't you have an Account? <a href="/signup.php">Signup</a>

const queryString = window.location.search;

const urlParams = new URLSearchParams(queryString);

document.write("<div id='err' style='position:fixed;bottom:30px; right:30px;background-

document.write("<div id='msg' style='position:fixed;bottom:30px;

$sql = "SELECT * FROM user where email='$email'";

while ($row = $result->fetch_assoc()) {

header("Location: /?err=Email or Password is Wrong !");

header("Location: /?err=Email or Password is Wrong !");

$sql="INSERT INTO user(name,email,password)

header("Location: /?msg=Signup Successfully!");

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="/static/css/bootstrap.min.css">

<link rel="shortcut icon" href="/static/img/logo.png">

<div id="loader" style="position:fixed;width:100%;height:100%;background-

<div class="spinner-border" style="color:#fff;position:fixed;top:48%;left:49%;"

<section class="gradient-custom h-100">

<div class="row d-flex justify-content-center align-items-center h-100">

<div class="col-12 col-md-8 col-lg-6 col-xl-5">

<div class="card" style="border-radius: 1rem;background-color:#f5f5f5;">

<h2 class="fw-bold mb-4 text-uppercase text-primary" style="font-weight:800">User

<div class="form-floating mb-3">

<input required type="text" name="name" class="form-control" id="floatingInput"

<div class="form-floating mb-3">

<input required type="email" name="email" class="form-control" id="floatingInput"

<div class="form-floating mb-3">

<input required type="password" name="password" class="form-control"

<button class="btn btn-primary btn-lg px-5 mb-2" type="submit">Signup</button>

Do you have an Account? <a href="/">Login</a>

const queryString = window.location.search;