PANIMALAR INSTITUTE OF TECHNOLOGY

JAISAKTHI EDUCATIONAL TRUST

(Affiliated to Anna University, Chennai) Bangalore Trunk Road,
Varadharajapuram, Poonamallee, Chennai – 600 123

DEPARTMENT OF
ARTIFICIAL INTELLIGENCE AND DATA SCIENCE

CCS374 – WEB APPLICATION SECURITY

VI SEMESTER – III YEAR
LAB MANUAL
ACADEMIC YEAR 2023-24
 TABLE OF CONTENTS

Ex. No. CONTENTS PAGE No.

- VISION AND MISSION OF THE INSTITUTE iii

- VISION AND MISSION OF THE DEPARMENT iv

- PROGRAM EDUCATIONAL OBJECTIVES v

- PROGRAM OUTCOMES vi

- PROGRAM SPECIFIC OUTCOMES vii

- SYLLABUS viii

ii
 VISION AND MISSION OF THE INSTITUTE

VISION
An Institution of Excellence by imparting quality education and serve as a perennial source of
technical manpower with dynamic professionalism and entrepreneurship having social
responsibility for the progress of the society and nation

MISSION
Panimalar Institute of Technology will strive to emerge as an Institution of Excellence inthe
country by
 Providing state-of-the-art infrastructure facilities for designing and developingsolutions
for engineering problems.
 Imparting quality education and training through qualified, experienced and committed
members of the faculty.
 Inculcating high moral values in the minds of the Students and transforming them into a
well-rounded personality.
 Establishing Industry Institute interaction to make students ready for the industrial
environment.
 Promoting research based projects/activities in the emerging areas of Engineering &
Technology.

iii
 VISION AND MISSION OF THE DEPARTMENT

VISION
To establish a unique standard of quality education by enriching the problem solving
skills that adapt swiftly to the challenges of the society and industry. Producing professionals
who shall be the leaders in technology employing Artificial Intelligence and Data Science
along with core Computer Science.

MISSION
 To create an academic environment for higher learning, academic practices and research
endeavours.
 To educate the students with latest technologies to update their knowledge in the field of AI
and Data science.
 To empower students with knowledge through state-of-art infrastructure and curriculum.
 To produce successful professionals to serve the needs of Industry and society.
 To produce entrepreneurs in Artificial Intelligence and Data Science through excellence in
education and research.

iv
 PROGRAM EDUCATIONAL OBJECTIVES (PEOs)

PEO 1 : To provide graduates with the proficiency to utilize the fundamental knowledge of
basic sciences, mathematics, Artificial Intelligence, data science and statistics to
build systems that require management and analysis of large volume of data.
PEO 2 : To enrich graduates with necessary technical skills to pursue pioneering research in
the field of AI and Data Science and create disruptive and sustainable solutions for
the welfare of ecosystems.
PEO 3 : To enable graduates to think logically, pursue lifelong learning and collaborate with
an ethical attitude in a multidisciplinary team.
PEO 4 : To enable the graduates to design and model AI based solutions to critical problem
domains in the real world.
PEO 5 : To enrich the innovative thoughts and creative ideas of the graduates for effective
contribution towards economy building.

v
 PROGRAM OUTCOMES OF THE DEPARTMENT

Engineering Graduates will be able to:

PO 1 : Engineering Knowledge: Apply the knowledge of mathematics, science,
engineering fundamentals, and an engineering specialization to the solution of
complex engineering problems
PO 2 : Problem Analysis: Identify, formulate, review research literature, and analyze
complex engineering problems reaching substantiated conclusions using first
principles of mathematics, natural sciences, and engineering sciences.
PO 3 : Design/Development of Solutions: Design solutions for complex engineering
problems and design system components or processes that meet the specified needs
with appropriate consideration for the public health and safety, and the cultural,
societal, and environmental considerations.
PO 4 : Conduct Investigations of Complex Problems: Use research-based knowledge
and research methods, including design of experiments, analysis and interpretation
of data, andsynthesis of the information to provide valid conclusions.
PO 5 : Modern Tool Usage: Create, select, and apply appropriate techniques, resources,
and modern engineering and IT tools including prediction and modeling of complex
engineering activities with an understanding of the limitations.
PO 6 : The Engineer and Society: Apply reasoning informed by the contextual
knowledge to assess societal, health, safety, legal and cultural issues and the
consequent responsibilities relevant to the professional engineering practice.
PO 7 : Environment and Sustainability: Understand the impact of the professional
engineering solutions in societal and environmental contexts, and demonstrate the
knowledge of, and need for sustainable development.
PO 8 : Ethics: Apply ethical principles and commit to professional ethics and
responsibilities and norms of the engineering practice.
PO 9 : Individual and Team Work: Function effectively as an individual, and as a
member or leader in diverse teams, and in multidisciplinary settings.
PO 10 : Communication: Communicate effectively on complex engineering activities with
the engineering community and with society at large, such as, being able to
comprehend and write effective reports and design documentation, make effective
presentations, and give and receive clear instructions.
PO 11 : Project Management and Finance: Demonstrate knowledge and understanding of
the engineering and management principles and apply these to one’s own work, as a
member and leader in a team, to manage projects and in multidisciplinary
environments.
PO 12 : Life-long Learning: Recognize the need for, and have the preparation and ability
to engage in independent and life-long learning in the broadest context of
technological change.

vi
 PROGRAM SPECIFIC OUTCOMES OF THE DEPARTMENT

PSO 1 : Graduates should be able to evolve AI based efficient domain specific processes
for effective decision making in several domains such as business and governance
domains.
PSO 2 : Graduates should be able to arrive at actionable Fore sight, Insight , hind sight
from data for solving business and engineering problems.
PSO 3 : Graduates should be able to create, select and apply the theoretical knowledge of AI
and Data Analytics along with practical industrial tools and techniques to manage
and solve wicked societal problems.
PSO 4 : Graduates should be capable of developing data analytics and data visualization
skills, skills pertaining to knowledge acquisition, knowledge representation and
knowledge engineering, and hence capable of coordinating complex projects
PSO 5 : Graduates should be able to carry out fundamental research to cater the critical
needs of the society through cutting edge technologies of AI.

vii
 SYLLABUS

CCS374 – WEB APPLICATION SECURITY L T P C

2 0 2 3
OBJECTIVES:
 To understand the fundamentals of web application security
 To focus on wide aspects of secure development and deployment of web applications
 To learn how to build secure APIs
 To learn the basics of vulnerability assessment and penetration testing
 To get an insight about Hacking techniques and Tools

LIST OF THE EXPERIMENTS

1. Install wireshark and explore the various protocols

a. Analyze the difference between HTTP vs HTTPS

b. Analyze the various security mechanisms embedded with different protocols.

2. Identify the vulnerabilities using OWASP ZAP tool

3. Create simple REST API using python for following operation

a) GET

b) PUSH

c) POST

d) DELETE

4. Install Burp Suite to do following vulnerabilities:

a) SQL injection

b) cross-site scripting (XSS)

5. Attack the website using Social Engineering method

OUTCOMES:
CO1: Understanding the basic concepts of web application security and the need for it
CO2: Be acquainted with the process for secure development and deployment of web applications
CO3: Acquire the skill to design and develop Secure Web Applications that use Secure APIs
CO4: Be able to get the importance of carrying out vulnerability assessment and penetration
testing
CO5: Acquire the skill to think like a hacker and to use hackers tool sets
CO4: Apply generative models for data augmentation
CO5: Develop a real world application using suitable deep neural networks

viii
 TABLE OF CONTENTS

PAGE NO.
S.NO. TITLE OF THE EXPERIMENTS

1. INSTALLION OF WIRESHARK 1

2. ANALYZE HTTP PROTOCOL IN WIRESHARK 12

3. ANALYZE HTTPS TRAFFIC USING WIRESHARK 20

IDENTIFY THE VULNERABILITIES USING OWASP ZAP TOOL

4. 30

CREATE SIMPLE REST API USING PYTHON FOR SOME

5. OPERATION 38

INSTALL BURP SUITE TO DO SQL INJECTION AND XSS

6. 41
VULNERABILITIES

7. ATTACK THE WEBSITE USING SOCIAL ENGINEERING METHOD 44

ix
EX NO : 1 INSTALLATION OF WIRESHARK

What is Wireshark?
Wireshark is an open-source packet analyzer, which is used for education, analysis,
software development, communication protocol development, and network
troubleshooting.
It is used to track the packets so that each one is filtered to meet our specific needs. It is
commonly called as a sniffer, network protocol analyzer, and network analyser.

What is a packet?
A packet is a unit of data which is transmitted over a network between the origin and the
destination. Network packets are small, i.e., maximum 1.5 Kilobytes for Ethernet packets and
64 Kilobytes for IP packets. The data packets in the Wireshark can be viewed online and can be
analyzed offline.

Functionality of Wireshark:
Wireshark is similar to tcpdump in networking. Tcpdump is a common packet analyzer
which allows the user to display other packets and TCP/IP packets, being transmitted and
received over a network attached to the computer. It has a graphic end and some sorting and
filtering functions. Wireshark users can see all the traffic passing through the network.

Installation of Wireshark Software

Follow the below steps to install Wireshark on Windows:

Step 1: Visit the official Wireshark website using any web browser.

1
Step 2: Click on Download, a new webpage will open with different installers of Wireshark.

Step 3: Downloading of the executable file will start shortly. It is a small 73.69 MB file that
will take some time.

2
Step 4: Now check for the executable file in downloads in your system and run it.

Step 5: It will prompt confirmation to make changes to your system. Click on Yes.

Step 6: Setup screen will appear, click on Next.

3
Step 7: The next screen will be of License Agreement, click on Noted.

Step 8: This screen is for choosing components, all components are already marked so don’t
change anything just click on the Next button.

4
Step 9: This screen is of choosing shortcuts like start menu or desktop icon along with file
extensions which can be intercepted by Wireshark, tick all boxes and click on Next button.

Step 10: The next screen will be of installing location so choose the drive which will have
sufficient memory space for installation. It needed only a memory space of 223.4 MB.

5
Step 11: Next screen has an option to install Npcap which is used with Wireshark to capture
packets pcap means packet capture so the install option is already checked don’t change
anything and click the next button.

Step 12: Next screen is about USB network capturing so it is one’s choice to use it or not,
click on Install.

6
Step 13: After this installation process will start.

Step 14: This installation will prompt for Npcap installation as already checked so the license
agreement of Npcap will appear to click on the I Agree button.

7
Step 15: Next screen is about different installing options of npcap, don’t do anything click on
Install.

Step 16: After this installation process will start which will take only a minute.

8
Step 17: After this installation process will complete click on the Next button.

Step 18: Click on Finish after the installation process is complete.

9
Step 19: After this installation process of Wireshark will complete click on the Next button.

Step 20: Click on Finish after the installation process of Wireshark is complete.

Wireshark is successfully installed on the system and an icon is created on the desktop as
shown below:

10
Now run the software and see the interface.

Now wireshark has been installed successfully.

11
EX NO: 2 ANALYZE HTTP PROTOCOL IN WIRESHARK

The installed Wireshark can move on to capturing http traffic. Here are the steps to do it:

1. Open your browser – You can use any browser.

2. Clear cache – Before capturing the traffic, you need to clear your browser’s cache. You
can do this if you go to your browser’s settings.

How To Capture HTTP Traffic In Wireshark

Wireshark allows you to analyze the traffic inside your network with various tools. If you want
to see what’s going on inside your network or have issues with network traffic or page loading,
you can use Wireshark. It allows you to capture the traffic, so you can understand what the
problem is or send it to support for further assistance. Keep reading this article, and you’ll learn
how to capture http traffic in Wireshark.

12
Installing Wireshark
Installing Wireshark is an easy process. It’s free tool across different platforms, and here is how
you can download and install it:

Windows & Mac Users

1. Open your browser.
2. Visit https://www.wireshark.org/download.html.
3. Select the version for your device.

4. Wireshark will be downloaded to your device.

5. Install it by following the instructions in the package.

13
Capturing HTTP Traffic in Wireshark

Now that you’ve installed Wireshark on your computer, we can move on to capturing http traffic.
Here are the steps to do it:

1. Open your browser – You can use any browser.

2. Clear cache – Before capturing the traffic, you need to clear your browser’s cache. You
can do this if you go to your browser’s settings.

3. Open Wireshark.

14
4. Tap “Capture.”

5. Tap “Interfaces.” You will now see a pop-up window on your screen.
6. Choose the interface. You probably want to analyze the traffic going through your
ethernet driver.

15
7. Once you’ve selected the interface, tap “Start” or tap “Ctrl + E.”

8. Now go back to your browser and visit the URL you want to capture traffic from.

16
9. Once you’re done, stop capturing traffic. Go back to Wireshark and tap “Ctrl + E.”

10. Save the captured traffic. If you have network issues and want to send the captured
traffic to support, save it into a *.pcap format file.

17
Capturing Packets in Wireshark

Besides capturing http traffic, you can capture whatever network data you need in
Wireshark. Here is how you can do this:

1. Open Wireshark.

2. Select the one you’re interested in. If you want, you can analyze multiple network
connections at once by pressing “Shift + Left-click.”

18
 3. Now you can start capturing packets. You can do this in several ways: The first one is
by tapping the shark fin icon at the top-left corner. The second one is tapping “Capture”
and then tapping “Start.” The third way to start capturing is by tapping “Ctrl + E.”

While capturing, Wireshark will display all the captured packets in real-time. Once you’re
done capturing packets, you can use the same buttons/shortcuts to stop capturing.

19
EX NO: 3 ANALYZE HTTPS TRAFFIC USING WIRESHARK

 One of the main features of HTTPS is that it’s encrypted. While this is an advantage
when you’re shopping online or leaving personal information on a website, it can be a
drawback when you’re tracking to monitor web traffic and analyze your network.
 Since HTTPS is encrypted, there’s no way to read it in Wireshark. But you can display
SSL and TLS packets and decrypt them to HTTPS.

Follow these steps to read SSL and TLS packets in Wireshark:

1. Open Wireshark and choose what you’d like to capture in the “Capture” menu.

2. In the “Packet List” pane, focus on the “Protocol” column and look for “SSL.”

20
 3. Find the SSL or TLS packet you’re interested in and open it.

Decrypt SSL in Wireshark

 Set an environment variable.

 Launch your browser.
 Configure your settings in Wireshark.
 Capture and decrypt session keys.
Set an Environment Variable in Windows
Windows users should follow these steps to set an environment variable:
1. Launch the Start menu.

21
2. Open “Control Panel.”

3. Go to “System and Security.”

22
4. Choose “System.”

5. Scroll down and select “Advanced system settings.”

23
6. Double-check if you’re in the “Advanced” section and press “Environment Variables.”

7. Press “New” under “User variables.”

24
8. Type “SSLKEYLOGFILE” under “Variable name.”

9. Under “Variable value,” enter or browse the path to the log file.

25
 10. Press “Ok.”

Configure Wireshark
After you’ve established your browser is logging pre-master keys in the desired location,
it’s time to configure Wireshark. After configuring, Wireshark should be able to use the keys to
decrypt SSL.

Follow the steps below to do it:

1. Launch Wireshark and go to “Edit.”

26
2. Click on “Preferences.”

3. Expand “Protocols.”

4. Scroll down and select “SSL.”

5. Find “(Pre)-Master Secret log filename” and enter the path you set up in the first step.
6. Press “Ok.”

27
Capture and Decrypt Session Keys
Now that you’ve configured everything, it’s time to check whether Wireshark decrypts
SSL. Here’s what you need to do:

1. Launch Wireshark and start an unfiltered capture session

2. Minimize the Wireshark window and open your browser.

28
3. Go to any secure website to get data.

4. Return to Wireshark and select any frame with encrypted data.

5. Find “Packet byte view” and look at “Decrypted SSL” data. HTML should now be
visible.

29
EX.NO: 4 IDENTIFY THE VULNERABILITIES USING OWASP ZAP TOOL

OWASP ZAP Tool is a free and open-source tool for security testing, and it is easy to use
for penetration testing to find vulnerabilities in web applications. It provides cross-platform
therefore it works on all platforms of OS link Windows, Linux, and Mac. It is reusable, easy to
generate reports as well and easy to use as well.

OWASP Zap Application provides two options like,

 Automated Scan.

 Manual Explore.

Automated Scan:

To start a vulnerability assessment of your web application firstly you need to perform
the automated scan and passive scanning attack functionality. In the Automated Scan option, we
just pass our application URL and click on Attack and its start scanning your application.

To begin with, you need to download and install OWASP ZAP scanner and set it up
correctly. ZAP is platform agnostic so you can install it on Windows, Linux or Mac OS. You
need Java 8+ installed on your Windows or Linux system.

1. Download java from the below link

https://www.java.com/en/download/

2. Download ZAP from the below link

https://www.zaproxy.org/download/

Below steps are mentioned on how to perform the Automated Scan:

 Open the Zap tool.

 Select Any one option from the pop-up window.

 First two options will save your section in your system and the last one will not save the
section on your system. So, I select the third option.

 Click on the start button

30
  Select Automated Scan Option

 Enter your Application URL in the (URL to attack) input bo

 Select the browser from the drop-down menu.
 Click on the attack button.

31
 It starts to scan your application.
 It captures your application all URI you can see those in the spider tab.

 After that it will start performing an active scan and it will try n number of attack methods
on each URL. Like SQL Injection, Cross Site Scripting, Server-Side Code Injection, etc.
 You can see the scanned URL list in the active scan tab.

32
 Once the active scan finishes you can see vulnerable requests or URLs in the alert tab.
 It shows which URLs have a high or low vulnerability, as well as it, gives the solution and
reference links also provided in the right tab

Manual Explore:
In manual explore the need to explore web applications manually that needs to pass the
application URL and click on launch the browser and then need to start exploring the
application. It captures all visited URLs and performs a passive scan on them.
Below steps are mentioned on how to perform the Manual Scan:
 Open the Zap Tool.
 Select the Manual Explore option.
 Enter the URL in the (URL to explore) input box.
 Select the browser.
 Click on launch browser.

33
 It will launch the browser and you can start exploring the application.
 It will capture all visited URLs and perform the passive scan on them.

34
Below steps are mentioned on how to perform the Active Scan:
 Once manual explore is done open the ZAP Tool.
 Expand the site option.

 Select your browser URL folder or you can expand that folder and select the individual
HTTP request.

35
 Right-click on a folder or Induvial HTTP request.
 Select the attack option and click on Active Scan.

 Active Scan pop-up Window will appear then click on Start scan.

36
 It will start scanning and perform several attack types on each URL request.

 It logs the vulnerable HTTP request URL in the alert tab.

37
EX NO: 5 CREATE SIMPLE REST API USING PYTHON FOR SOME
OPERATION

AIM:
To implement a python program using simple REST API for some operations.
GET
GET is one of the most common HTTP methods you’ll use when working with REST
APIs. This method allows you to retrieve resources from a given API. GET is a read-only
operation, so you shouldn’t use it to modify an existing resource.
Program:
import requests
api_url = "https://jsonplaceholder.typicode.com/todos/1"
response = requests.get(api_url)
response.json()

Output:
{'userId': 1, 'id': 1, 'title': 'delectus aut autem', 'completed': False}

response.headers["Content-Type"]
Output:
'application/json; charset=utf-8'

response.status_code
Output:
200

POST:
Requests to POST data to a REST API to create a new resource.
Program:
import requests
api_url = "https://jsonplaceholder.typicode.com/todos"
todo = {"userId": 1, "title": "Buy milk", "completed": False}
response = requests.post(api_url, json=todo)
response.json()

38
Output:
{'userId': 1, 'title': 'Buy milk', 'completed': False, 'id': 201}

PUT
Beyond GET and POST, requests provides support for all the other HTTP methods you
would use with a REST API. The following code sends a PUT request to update an existing
todo with new data. Any data sent with a PUT request will completely replace the existing
values of the todo.
Program:
import requests
api_url = "https://jsonplaceholder.typicode.com/todos/10"
response = requests.get(api_url)
response.json()
todo = {"userId": 1, "title": "Wash car", "completed": True}
response = requests.put(api_url, json=todo)
response.json()
Output:
{'userId': 1, 'title': 'Wash car', 'completed': True, 'id': 10}

PATCH:
Use requests.patch() to modify the value of a specific field on an existing todo. PATCH
differs from PUT in that it doesn’t completely replace the existing resource. It only modifies
the values set in the JSON sent with the request.
Program:
import requests
api_url = "https://jsonplaceholder.typicode.com/todos/10"
todo = {"title": "Mow lawn"}
response = requests.patch(api_url, json=todo)
response.json()
Output:
{'userId': 1, 'id': 10, 'title': 'Mow lawn', 'completed': True}

response.status_code

39
Output:
200

DELETE:
If you want to completely remove a resource, then you use DELETE.
Program:
import requests
api_url = "https://jsonplaceholder.typicode.com/todos/10"
response = requests.delete(api_url)
response.json()
Output:
{}

response.status_code
Output:
200

RESULT
Thus the implementation of python program using REST API was executed successful

40
EX NO: 6 INSTALL BURP SUITE TO DO SQL INJECTION AND XSS
VULNERABILITIES

Step 1: Download Burp Suite:

Go to the PortSwigger website (https://portswigger.net/burp) and navigate the Products
section. Select the appropriate Burp Suite version (free or paid) and download the installer
compatible with your computer's operating system (Windows, macOS, or Linux).

Step 2: Install Burp Suite:

Follow the instructions on your screen after you launch the installer you just
downloaded. It's similar to adding new software on your computer.

Identifying SQL Injection Vulnerabilities

Step 1: Configure Burp Suite Proxy:

Configure your web browser to use the Burp Suite proxy. This allows Burp Suite to
intercept and analyze the web traffic between your browser and the target web application.

Step 2: Navigate to the Target Web Application:

Access the target web application through your browser. Burp Suite will capture the
requests and responses in its proxy.

Step 3: Enable Intercept Mode:

Inside Burp Suite, go to the "Proxy" tab and switch on the "Intercept" option. This will
enable you to catch and change individual requests before they get sent to the server.

Step 4: Analyze and Modify Requests:

As you navigate the target web application, Burp Suite will capture requests in the
"Proxy" tab. Analyze the requests and look for input fields or parameters vulnerable to SQL
injection.

Step 5: Craft SQL Injection Payloads:

For each identified input field or parameter, craft SQL injection payloads. These
payloads are designed to manipulate the SQL query executed by the application to retrieve or
modify data. Common SQL injection payloads include `' OR 1=1 --` and `' UNION SELECT
NULL, NULL, NULL --`.

41
Step 6: Test and Observe Responses:
Replace the legitimate values of the input fields or parameters with the crafted SQL
injection payloads in the intercepted requests. Forward the modified requests to the server and
observe the responses in Burp Suite. Look for anomalies, error messages, or unexpected
behavior indicating a successful SQL injection vulnerability.

Step 7: Verify and Report:

After identifying a possible SQL injection weakness, experiment with various SQL
injection methods and input information to verify its authenticity. Keep a thorough log of all
your activities and findings, including the website’s URL, the exact component (parameter)
involved, and potential solutions to the issue.

Identifying Cross-Site Scripting (XSS) Vulnerabilities

Step 1: Configure Burp Suite Proxy:

Make sure your web browser is set up to work with the Burp Suite proxy. This will
allow Burp Suite to intercept and examine the web traffic effectively.

Step 2: Navigate to the Target Web Application:

Access the target web application through your browser, allowing Burp Suite to capture
the requests and responses in its proxy.

Step 3: Enable Intercept Mode:

Navigate to the "Proxy" tab in Burp Suite and enable the "Intercept" toggle, enabling
you to intercept and modify individual requests before they are sent to the server.

Step 4: Identify Input Fields and Parameters:

Analyze the intercepted requests in the "Proxy" tab and identify input fields or
parameters vulnerable to Cross-Site Scripting (XSS). Look for areas where user-supplied data
is being reflected in the response.

Step 5: Craft XSS Payloads:

Craft XSS payloads to identify each input field or parameter. These payloads are
created to insert harmful code that runs in the target's web browser. Common XSS payloads
include:

<script>alert('XSS')</script>

42
 <img src=x onerror=alert('XSS')>

Step 6: Test and Observe Responses:

Replace the legitimate values of the input fields or parameters with the crafted XSS
payloads in the intercepted requests. Forward the modified requests to the server and observe
the responses in Burp Suite. Look for indications that the payload is being executed, such as
pop-up alerts or script execution.

Step 7: Verify and Report:

Once you've identified a potential XSS vulnerability, confirm it by using several XSS
techniques and input data. Report your findings and the procedure in writing. The report must
include specific details like the exact website where the issue is happening, the parameters
involved, and suggestions for resolving it.

43
EX NO: 7 ATTACK THE WEBSITE USING SOCIAL ENGINEERING METHOD

Locate A Website To Clone

Step 1. Identify The Login Page.
Traverse to the website you've decided to clone and locate the login page. For this blog,
we'll focus on cloning a Password Manager.

Step 2. Review The Web Page.

Check the web page source and see if external images, CSS and JavaScript functions
include relative paths or are hardcoded. E.g. this Password Manager's external references are
mostly hardcoded. Also check to see if the webpage source looks quite empty. E.g. does it
contain many of the HTML elements you’d expect to see from the loaded page? If not, then
that could indicate that the webpage is being dynamically loaded through various JavaScript
functions.

44
Step 3. Download The Web Page Source.
Depending on whether the web page is statically or dynamically loaded - which is
identified as part of step 2, you'll need to adjust your approach to downloading the web page.
 If the web page is statically loaded.
Download the web page by right clicking anywhere on the page and selecting “Save
As”.

Save as "Webpage, Complete" to your preferred folder.

45
  If the web page is dynamically loaded.
Copy the web page HTML to clipboard by right clicking anywhere on the web page and
clicking “Inspect”.
Under the Elements heading on the Browser Developer Tools, scroll to the top and right
click on the “<html>” HTML object. Select the Copy heading followed by Copy Element

Open your favourite text editor or IDE and copy the HTML contents into an empty page. Then
save this page as a .html filetype (e.g. Password-Manager-Login.html).

46
Step 4. Load Your Copy Of The Web Page.
Load the newly saved copy of the login page in your browser and check to see if the
page loads. If the web page fails to load or presents some form of error message after a few
seconds, then this indicates that there may be a JavaScript function causing the page to fail.
This could be a technique implemented by the service to prevent cloning, but in many
cases it's just an unintended side-effect of cloning. In the case of this Password Manager page,
there is a JavaScript function causing page failure a few seconds after opening.

Step 5. Remove All The JavaScript!

Begin by editing the raw web page HTML to remove all JavaScript references and
scripts. Remove JavaScript progressively and continue refreshing the page to ensure the page
is loading as expected.
If removal of a certain JavaScript function results in page load failure, then revert the
change and continue to the next function or script. The reason we delete JavaScript is because
it may execute code which leaks information back to the original website.
This could include monitoring for activity such as web page cloning or other
monitoring that we don’t want to occur (e.g. Google Analytics tracking, etc.). Instead of
reviewing each script and function line-by-line, the easiest approach is to simply remove it all
together.

47
Step 6. Confirm That The Web Page Loads.
After removing the necessary JavaScript functions and confirming the page loads,
check to see if any images, CSS or other objects fail to load.
These are all indicators that certain page objects may have relative file paths within
their respective HTML elements which need replacing. In the case of this Password Manager,
the panel on the right-hand side of the page has failed to load.

Upon re-inspection of the source website, this is because the right-side panel is being
loaded from an iFrame HTML element.
If the web page has an iFrame.
 An HTML iFrame is typically loaded from an external source. During the cloning
process, this typically causes iFrame elements to fail due to Cross-Origin-Resource-
Sharing (CORS) related issues.

 To remediate an issue such as this, we need to traverse to the iFrame src and then copy
the raw HTML out of this page and save it as another HTML page that we will then
reference in this src.

48
Step 7. Replace HTML Element References.
 Once the page is loading as intended with all images and styles being displayed.
 Go through each .CSS and image file referenced and ensure these are downloaded to
your local desktop.
 Once downloaded, upload these images to a publicly accessible cloud storage location
(e.g. Amazon S3, Azure Blob, CDN service, etc.) and then update the references for
these to point to your copy of these files.
 The reason for this is that service providers such as 1Password will often update or
delete image and .CSS files which will negatively impact our hosted phishing websites
if we still point to these locations to load a resource.

Step 8. Insert Your Own Capture Functions.

 As CanIPhish provides simulated phishing, we need to track user interactions such as
page load events and on-page activity.
 To do this, we insert a JavaScript function which executes on both page load but also
when any input is provided into password or sensitive data fields.
 This is typically best handled through an onkeydown event listener. In the case of
CanIPhish, the moment we track interactions with sensitive data fields, we perform an
immediate redirect to an education website.
 Just prior to this redirect, we forward user activity to an API used for campaign
tracking purposes.

Step 9. Replace Hyperlinks!

 As a final step, load the webpage and ensure any hyperlinks to the legitimate website
are replaced or removed to prevent a target from unintentionally leaving the phishing
website before the interaction is captured.

Step 10. You're All Done!

You phishing website is now operational. All you need to do now is choose a hosting
provider and you can begin conducting simulated phishing attacks.

49