PHP tabanlı bir chat uygulaması oluşturmak, web sitenize interaktif bir özellik eklemenin harika bir yoludur. Bu rehberde, basit bir PHP tabanlı otomatik cevap veren chat uygulamasının nasıl yapılabileceğini adım adım anlatacağım.
Contents
Gereksinimler
- Web sunucusu (Apache, Nginx vb.)
- PHP yüklü sunucu
- Temel PHP bilgisi
Adım 1: Chat Arayüzü Oluşturma
İlk olarak, kullanıcının mesaj yazabileceği ve cevapları görebileceği basit bir HTML ve CSS ile chat arayüzü oluşturun.
HTML (index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Chat Uygulaması</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="chat-container">
<div id="chat-window">
<div id="output"></div>
</div>
<input type="text" id="user-input" placeholder="Mesajınızı yazın...">
<button id="send-btn">Gönder</button>
</div>
<script src="chat.js"></script>
</body>
</html>
CSS (style.css)
#chat-container {
width: 400px;
margin: auto;
background-color: #f4f4f4;
padding: 20px;
border: 1px solid #ddd;
box-shadow: 0 0 10px #ddd;
}
#chat-window {
height: 300px;
border: 1px solid #ddd;
padding: 10px;
overflow-y: auto;
margin-bottom: 10px;
background-color: #fff;
}
#user-input {
width: calc(100% - 90px);
padding: 10px;
}
#send-btn {
width: 80px;
padding: 10px;
}
Adım 2: JavaScript ile Chat Kontrolü
Kullanıcının girdiği mesajları alacak ve PHP script’ine gönderecek JavaScript kodunu yazın.
JavaScript (chat.js)
document.getElementById('send-btn').addEventListener('click', function() {
var userInput = document.getElementById('user-input');
var xhr = new XMLHttpRequest();
xhr.open('POST', 'chat.php', true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function() {
document.getElementById('output').innerHTML += '<p>' + this.responseText + '</p>';
};
xhr.send('message=' + userInput.value);
userInput.value = '';
});
Adım 3: PHP ile Otomatik Cevap Oluşturma
Artık chat uygulamasına basit bir otomatik cevap mekanizması ekleyelim.
PHP (chat.php)
<?php
if(isset($_POST['message'])) {
$userMessage = strtolower(trim($_POST['message']));
$botResponse = '';
// Basit bir cevap mekanizması
switch($userMessage) {
case 'merhaba':
$botResponse = 'Merhaba! Size nasıl yardımcı olabilirim?';
break;
case 'nasılsınız?':
$botResponse = 'İyiyim, teşekkür ederim! Siz nasılsınız?';
break;
case 'teşekkürler':
$botResponse = 'Rica ederim, her zaman yardımcı olmaktan mutluluk duyarım!';
break;
case 'güle güle':
$botResponse = 'Hoşça kalın! Yine bekleriz.';
break;
default:
$botResponse = 'Üzgünüm, anlayamadım. Lütfen farklı bir şey sorun.';
}
echo $botResponse;
}
?>
