Dateien nach "Abgabe_Mohr" hochladen
This commit is contained in:
@@ -0,0 +1,115 @@
|
|||||||
|
# Chat-Projekt mit zwei Benutzern
|
||||||
|
|
||||||
|
Ein einfaches Chat-System mit zwei Usern, entwickelt mit PHP, JavaScript und Node.js.
|
||||||
|
Das Backend nutzt **XAMPP (Apache + PHP + MySQL)**, während **Node.js** für Echtzeit-Funktionen (z. B. WebSockets) eingesetzt wird.
|
||||||
|
Zusätzlich wird **Composer** für PHP-Abhängigkeiten benötigt.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Funktionen
|
||||||
|
|
||||||
|
* Chat in Echtzeit zwischen zwei Benutzern
|
||||||
|
* Einfache Benutzeroberfläche
|
||||||
|
* Speicherung der Nachrichten in einer MySQL-Datenbank
|
||||||
|
* Klare Trennung zwischen Frontend, Backend und WebSocket-Server
|
||||||
|
* Erweiterbar für mehr Benutzer oder Features
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Voraussetzungen (Requirements)
|
||||||
|
|
||||||
|
Damit das Projekt funktioniert, werden folgende Programme benötigt:
|
||||||
|
|
||||||
|
1. **XAMPP**
|
||||||
|
|
||||||
|
* Apache Webserver
|
||||||
|
* MySQL/MariaDB Datenbank
|
||||||
|
|
||||||
|
2. **Node.js**
|
||||||
|
|
||||||
|
* Für WebSocket-Server oder Event-Handling
|
||||||
|
|
||||||
|
3. **Composer**
|
||||||
|
|
||||||
|
* PHP-Abhängigkeiten / Autoloading
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
### 1. Repository klonen
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone <dein-repo-link>
|
||||||
|
cd projektname
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. XAMPP einrichten
|
||||||
|
|
||||||
|
* Starte **Apache** und **MySQL**
|
||||||
|
* Importiere die Datenbankdatei unter
|
||||||
|
`localhost/phpmyadmin` → *Importieren*
|
||||||
|
|
||||||
|
### 3. Composer installieren
|
||||||
|
|
||||||
|
```bash
|
||||||
|
composer install
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. Node-Module installieren
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### 5. WebSocket-Server starten
|
||||||
|
|
||||||
|
```bash
|
||||||
|
node server.js
|
||||||
|
```
|
||||||
|
|
||||||
|
### 6. Projekt öffnen
|
||||||
|
|
||||||
|
Rufe im Browser auf:
|
||||||
|
|
||||||
|
```
|
||||||
|
http://localhost/<ordnername>/
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Projektstruktur
|
||||||
|
|
||||||
|
```
|
||||||
|
/public → Frontend (HTML, CSS, JS)
|
||||||
|
/php → PHP-Backend
|
||||||
|
/ws → Node WebSocket-Server
|
||||||
|
composer.json → Composer Dependencies
|
||||||
|
package.json → Node Dependencies
|
||||||
|
README.md → Diese Datei
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Technologien
|
||||||
|
|
||||||
|
* **PHP 8+**
|
||||||
|
* **MySQL/MariaDB**
|
||||||
|
* **Node.js**
|
||||||
|
* **HTML/CSS/JavaScript**
|
||||||
|
* **Composer Autoloader**
|
||||||
|
* **WebSockets**
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Lizenz
|
||||||
|
|
||||||
|
Dieses Projekt steht unter der **MIT License**, einer freien Open-Source-Lizenz.
|
||||||
|
Sie erlaubt Nutzung, Veränderung und Weitergabe des Codes ohne Einschränkungen.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Autor
|
||||||
|
|
||||||
|
Projekt von *[Dein Name]*.
|
||||||
|
Verbesserungen und Erweiterungen sind jederzeit willkommen!
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"name": "marco/chat-app",
|
||||||
|
"description": "Spaß mit Websockets",
|
||||||
|
"require": {
|
||||||
|
"cboden/ratchet": "^0.4.4"
|
||||||
|
}
|
||||||
|
}
|
||||||
Generated
+1305
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,12 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
define("PROJEKT_DIR","C:/xampp/htdocs/projekte");
|
||||||
|
define("PROJEKT_VIEW_DIR", PROJEKT_DIR . "/view");
|
||||||
|
define("PROJEKT_URL","http://localhost/projekte/htdocs");
|
||||||
|
define("PROJEKT_JS_URL", PROJEKT_URL."/assets/js");
|
||||||
|
|
||||||
|
define("DB_CONNECTION","localhost");
|
||||||
|
define("DB_PORT","3306");
|
||||||
|
define("DB_DBNAME","chatprojekt");
|
||||||
|
define("DB_USER","root");
|
||||||
|
define("DB_PASS","");
|
||||||
@@ -0,0 +1,99 @@
|
|||||||
|
<?php
|
||||||
|
require __DIR__ . '/vendor/autoload.php';
|
||||||
|
|
||||||
|
use Ratchet\MessageComponentInterface;
|
||||||
|
use Ratchet\ConnectionInterface;
|
||||||
|
|
||||||
|
class ChatServer implements MessageComponentInterface {
|
||||||
|
protected $clients; // Alle Verbindungen
|
||||||
|
protected $users; // Mapping: userId => Connection
|
||||||
|
|
||||||
|
public function __construct() {
|
||||||
|
$this->clients = new \SplObjectStorage;
|
||||||
|
$this->users = [];
|
||||||
|
echo "WebSocket Server gestartet...\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
public function onOpen(ConnectionInterface $conn) {
|
||||||
|
$this->clients->attach($conn);
|
||||||
|
echo "Neue Verbindung: {$conn->resourceId}\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
public function onMessage(ConnectionInterface $from, $msg) {
|
||||||
|
$data = json_decode($msg, true);
|
||||||
|
if (!$data) return;
|
||||||
|
|
||||||
|
switch($data['type']) {
|
||||||
|
case 'init':
|
||||||
|
// UserID mit Verbindung speichern
|
||||||
|
$userId = $data['userId'];
|
||||||
|
$this->users[$userId] = $from;
|
||||||
|
$from->userId = $userId;
|
||||||
|
echo "User $userId registriert.\n";
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'message':
|
||||||
|
$senderId = $data['senderId'];
|
||||||
|
$receiverId = $data['receiverId'];
|
||||||
|
$message = $data['message'];
|
||||||
|
|
||||||
|
// In DB speichern
|
||||||
|
$this->saveMessage($senderId, $receiverId, $message);
|
||||||
|
|
||||||
|
// Nachricht an Empfänger senden, falls verbunden
|
||||||
|
if (isset($this->users[$receiverId])) {
|
||||||
|
$this->users[$receiverId]->send(json_encode([
|
||||||
|
'type' => 'new_message',
|
||||||
|
'senderId' => $senderId,
|
||||||
|
'message' => $message
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Optional: Bestätigung an Sender, falls nötig
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public function onClose(ConnectionInterface $conn) {
|
||||||
|
$this->clients->detach($conn);
|
||||||
|
if (isset($conn->userId)) {
|
||||||
|
unset($this->users[$conn->userId]);
|
||||||
|
}
|
||||||
|
echo "Verbindung {$conn->resourceId} geschlossen.\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
public function onError(ConnectionInterface $conn, \Exception $e) {
|
||||||
|
echo "Fehler: {$e->getMessage()}\n";
|
||||||
|
$conn->close();
|
||||||
|
}
|
||||||
|
|
||||||
|
protected function saveMessage($senderId, $receiverId, $message) {
|
||||||
|
$db = new mysqli("localhost","root","","projekte"); // Passe DB-Daten an
|
||||||
|
if ($db->connect_error) {
|
||||||
|
echo "DB Fehler: " . $db->connect_error;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
$stmt = $db->prepare("INSERT INTO chat (user_sender, user_empfaenger, nachricht) VALUES (?, ?, ?)");
|
||||||
|
$stmt->bind_param("iis", $senderId, $receiverId, $message);
|
||||||
|
$stmt->execute();
|
||||||
|
$stmt->close();
|
||||||
|
$db->close();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Server starten
|
||||||
|
use Ratchet\Server\IoServer;
|
||||||
|
use Ratchet\Http\HttpServer;
|
||||||
|
use Ratchet\WebSocket\WsServer;
|
||||||
|
|
||||||
|
$server = IoServer::factory(
|
||||||
|
new HttpServer(
|
||||||
|
new WsServer(
|
||||||
|
new ChatServer()
|
||||||
|
)
|
||||||
|
),
|
||||||
|
8080 // Port
|
||||||
|
);
|
||||||
|
|
||||||
|
$server->run();
|
||||||
Reference in New Issue
Block a user