facebook like chat system using Ajax, mysql and php

Welcome back to shortlearner, today we will learn how to implement a chat system using PHP, AJAX,and MySQL.

before start the tutorial i would like to suggest you to have some basic knowledge of ajax and jquery.

in this tutorial we willl used bootstrap maxcdn class to improve the visual looks of our web page,

we use ajax functionality for quick response of our chat system,  and we will also used mysqli to prevent sql  injections and store the whole conversation in our database.

first of all we would discuss about our database schema.

in the chat system we will make a database with the name of fb_msg, in this database we will create three tables for storing messages and users information.

Advertisement

in the very first table (admin) we will create 4 entities inside it like id, email, password and pic. in the user table we made id field as a auto increment to prevent duplication of data.
in the second table (conversation) we will create 3 entities inside it like id , user_one, and  user_two. in the conversation table we made id field as a unique key for assigning each conversation a unique, non-repetitive conversation id for every user.

in the last table (message) we will create 5 entities inside it like id,conversation_id, user_from,user_to,message . in the message table we will store the id of conversation table , in conversation id, in user_from we will store the id of sender and in user_to we will fetch the id of the receiver.

After Making the database we will make a connection in php to connect with our database.. for makinng connection in php i prefer to make a separate file which contains the code of connecting the database.

config.php

After making connection we will moved into our front end part.

Index.php / Login Page

after hit on login button a sessions is created with email,id,and if the user is authenticated then the session will redirect on message.php page otherwise the session will redirect on index.php again.

in message.php we will fetch all the registered user on the left corner of our chatroom, after click on a specific user a conversation is initiated between both users.

For quick response of conversations we will used ajax script to send or receive message swiftly.

inside the js folder we will created two java script files which contains the sending and receiving process of messages inside it.

in the below ajax code we will create a system to send and receive messages between users with the help of two

pages like post_message_ajax.php and get_message_ajax.php. in  send_message_ajax.php page the message will send to the receiver  and it will get stored in the message table of our database. in receive_message_ajax.php page the stored messages are fetched from the message table of our database and rapidly shown to the receiver with the help of ajax script.

post_message_ajax.php
get_message_ajax.php

Add a Comment

Your email address will not be published. Required fields are marked *