diff --git a/front-js/src/app/api/config/route.ts b/front-js/src/app/api/config/route.ts index bdd53d5..b285b0b 100644 --- a/front-js/src/app/api/config/route.ts +++ b/front-js/src/app/api/config/route.ts @@ -2,6 +2,6 @@ import { NextResponse } from 'next/server'; export async function GET() { return NextResponse.json({ - commonKey: process.env.COMMON_KEY + commonKey: process.env.COMMON_KEY, }); } diff --git a/front-js/src/app/dashboard/page.tsx b/front-js/src/app/dashboard/page.tsx index 5d4c826..47f6d70 100644 --- a/front-js/src/app/dashboard/page.tsx +++ b/front-js/src/app/dashboard/page.tsx @@ -164,6 +164,7 @@ export default function Dashboard() { title="Interface réseau" description="..." image="/modules_assets/scapy.svg" + onClick={() => router.push("/modules/interface_reseau")} /> diff --git a/front-js/src/app/modules/interface_reseau/Cours.tsx b/front-js/src/app/modules/interface_reseau/Cours.tsx new file mode 100644 index 0000000..db6fc46 --- /dev/null +++ b/front-js/src/app/modules/interface_reseau/Cours.tsx @@ -0,0 +1,64 @@ +import Title from "@/components/Title"; +import Text from "@/components/Text"; +import React from "react"; +import Space from "@/components/Space"; +import { Code, solarizedLight } from "react-code-blocks"; + +const Cours: React.FC = () => { + return ( + <> + + Introduction + + L'interface réseau est un composant logiciel ou matériel qui + permet à un ordinateur de se connecter à un réseau. En utilisant la + commande{" "} + (ou{" "} + sur les + systèmes Linux récents), on peut obtenir des informations importantes + comme : + +
    +
  • + L'adresse IP de l'interface +
    • +
  • + L'adresse MAC (identifiant physique) +
    • +
  • + Le masque de sous-réseau +
    • +
  • + L'état de l'interface (active ou non) +
    • +
+ + Sur les systèmes Windows, on peut utiliser la commande{" "} + pour + obtenir ces informations. + + + Interface réseau + + + Chaque interface a une adresse IP unique et une adresse MAC + (identifiant physique). + + L'interface{" "} + est une + interface spéciale qui est utilisée pour les communications internes + de la machine hôte. + + Sur la machine du site, l'interface{" "} + est + l'interface principale de la machine hôte qui est connectée au + réseau internet. Les autres interfaces sont des interfaces virtuelles + qui sont utilisées pour Docker. Elles ne nous intéressent pas pour le + moment. + + + + ); +}; + +export default Cours; diff --git a/front-js/src/app/modules/interface_reseau/InterfaceSandbox.tsx b/front-js/src/app/modules/interface_reseau/InterfaceSandbox.tsx new file mode 100644 index 0000000..51bfb08 --- /dev/null +++ b/front-js/src/app/modules/interface_reseau/InterfaceSandbox.tsx @@ -0,0 +1,85 @@ +import Title from "@/components/Title"; +import Button from "@/components/Button"; +import Space from "@/components/Space"; +import React from "react"; +import { useState } from "react"; +import axios from "@/axiosConfig"; +import Cookies from "js-cookie"; +import { Alert } from "@mui/material"; +import Box from "@/components/Box"; + +const InterfaceSandbox: React.FC = () => { + const [interfaces, setInterfaces] = useState< + Array<{ name: string; mac: string; ip: string }> + >([]); + + const handleInterfaces = async (e: { preventDefault: () => void }) => { + e.preventDefault(); + try { + const response = await axios.get("/scapy/interfaces/", { + headers: { + Authorization: `Bearer ${Cookies.get("access_token")}`, + }, + }); + const data = response.data; + if (response.status === 200) { + const formattedInterfaces = Object.entries(data.interfaces).map( + ([name, details]: [string, any]) => ({ + name, + mac: details.mac, + ip: details.ip, + }), + ); + setInterfaces(formattedInterfaces); + } + } catch (error: unknown) {} + }; + + return ( + <> + +
+ Interface réseau + +