Spaces:

binoubinks
/

ADSP_finalProjectFront

Sleeping

App Files Files Community

albin commited on Nov 28, 2024

Commit

70e9963

1 Parent(s): 0bc5b30

add html and main

Browse files

Files changed (4) hide show

Dockerfile +20 -0
main.py +32 -0
requirements.txt +18 -0
templates/index.html +94 -0

Dockerfile ADDED Viewed

	@@ -0,0 +1,20 @@

+FROM python:3.9
+WORKDIR /code
+COPY ./requirements.txt /code/requirements.txt
+RUN pip install --no-cache-dir --upgrade -r /code/requirements.txt
+RUN useradd -m -u 1000 user
+USER user
+ENV HOME=/home/user \
+ PATH=/home/user/.local/bin:$PATH
+WORKDIR $HOME/app
+COPY --chown=user . $HOME/app
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860"]

main.py ADDED Viewed

	@@ -0,0 +1,32 @@

+#!/usr/bin/env python
+# encoding: utf-8
+from fastapi import FastAPI, Form, Depends, Request
+from fastapi.templating import Jinja2Templates
+from pydantic import BaseModel
+import pickle
+import json
+app = FastAPI()
+templates = Jinja2Templates(directory="templates")
+class Msg(BaseModel):
+    msg: str
+class Req(BaseModel):
+    url: str
+@app.get("/welcomeMessage")
+async def welcome():
+    return {"message": "Hello, Welcome to the final project from Albin Tardivel"}
+@app.get("/")
+async def root(request: Request):
+    return templates.TemplateResponse(
+        "index.html",
+        {
+            "request": request,
+            "label": "",
+        }
+    )

requirements.txt ADDED Viewed

	@@ -0,0 +1,18 @@

+anyio>=3.7.1
+click==8.1.7
+fastapi==0.103.2
+h11==0.14.0
+httptools==0.6.0
+idna==3.4
+pydantic==2.4.2
+python-dotenv==1.0.0
+python-multipart==0.0.6
+PyYAML==6.0.1
+sniffio==1.3.0
+starlette>=0.27.0
+typing_extensions==4.8.0
+uvicorn==0.23.2
+watchfiles==0.20.0
+websockets==11.0.3
+scikit-learn
+jinja2

templates/index.html ADDED Viewed

	@@ -0,0 +1,94 @@

+<!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" />
+    <link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet" />
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+    <title>Prediction URL Legitimate or Phishing</title>
+  </head>
+  <body>
+    <div id="Model1" class="Model bg-gradient-to-r from-purple-400 to-purple-700 text-gray-800">
+      <section class="flex flex-col justify-between item-center p-8 min-h-screen md:flex-row">
+        <main class="bg-white p-16 rounded-lg">
+          <h1 class="text-3xl font-bold mb-8">Test if your URL is Phinshing or Legitimate:</h1>
+          <form enctype="multipart/form-data" class="flex flex-col" id="upload_form">
+            <label for="url" class="mb-2">Write your URL</label>
+            <input type="text" name="url" placeholder="URL" required="required" class="p-4 bg-gray-100 rounded-md" />
+            <button type="submit" class="flex justify-center align-center mt-8 p-4 bg-gradient-to-r from-purple-400 to-purple-700 text-white rounded-md">
+              TEST URL<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right ml-4">
+                <line x1="5" y1="12" x2="19" y2="12"></line>
+                <polyline points="12 5 19 12 12 19"></polyline>
+              </svg>
+            </button>
+          </form>
+        </main>
+        <section class="mt-8 h-full flex-auto rounded-lg md:mt-0 md:ml-8">
+          <div class="bg-white p-16 rounded-lg">
+            <h1 class="text-2xl mb-8">Your URL is:</h1>
+            <h2 class="text-5xl font-bold">$<span id="label">response</span></h2>
+              <div class="mt-8">
+                <p id="respUrl"></p>
+              </div>
+          </div>
+          <div class="flex justify-around p-16 rounded-lg mt-8">
+            <img class="h-24 md:h-28" src="https://elib.its.ac.id/conf/cyberdas/public/assets/img/img_navbar.svg" alt="logo-dts" />
+          </div>
+        </section>
+      </section>
+    </div>
+    <style>
+      .active {
+        background-color: rgb(124 58 237);
+      }
+    </style>
+  </body>
+  <script>
+    function openModel(evt, modelName) {
+      var i, x, tablinks;
+      x = document.getElementsByClassName("Model");
+      for (i = 0; i < x.length; i++) {
+        x[i].style.display = "none";
+      }
+      tablinks = document.getElementsByClassName("tablink");
+      for (i = 0; i < x.length; i++) {
+        tablinks[i].className = tablinks[i].className.replace(" active", "");
+      }
+      document.getElementById(modelName).style.display = "block";
+      evt.currentTarget.className += " active";
+    }
+  </script>
+  <script>
+    $(document).ready(function () {
+        $("#upload_form").submit(function (event) {
+            event.preventDefault();  // Prevent the default form submission
+            // Get the form data
+            var formData = new FormData(this);
+            // Make the Ajax request
+            $.ajax({
+                type: "POST",
+                url: "https://binoubinks-adsp-finalprojectback.hf.space",
+                data: formData,
+                processData: false,
+                contentType: false,
+                success: function (response) {
+                    // Handle the response data
+                    $('#respUrl').html("<strong>Url:</strong> " + response.url);
+                    $('#label').html(response.label);
+                    console.log(response);
+                },
+                error: function (error) {
+                    console.error("Error:", error);
+                }
+            });
+        });
+    });
+  </script>
+</body>
+</html>