5

I am developing a query PHP enabled chat, currently am using ajax to pull data from the server and display it in the chatbox but this makes use of multiple ajax requests to the client computer which causes it to slow abit....

This is what I am doing using ajax and yii2

 function getdata() {
    $.get("controller/action").
    done(function(){
       //process json

        $("#chatbox").html(data);
    })
  }

then am using

windows.setInterval(getdata(),1000);

Are there better ways to fetch this son data without using ajax and jquery

I have checked on This link buts its not very helpful

Community
  • 1
  • 1
Geoff
  • 6,277
  • 23
  • 87
  • 197
  • father data ... – Mahi Oct 22 '16 at 20:05
  • What further data #mahi... – Geoff Oct 22 '16 at 20:51
  • 6
    You should use [WebSockets](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications). You can take a look as well on this PHP project [Kraken](https://github.com/kraken-php/framework) and its demo [Kraken Demo Application - Chat](https://github.com/kraken-php/demo-chat) – manRo Oct 27 '16 at 10:53

5 Answers5

5

You can use socket.io or websockets api which is an alternate option to ajax, So, by using socket.io, jquery, php OR nodejs one can build one to one private chat without using ajax, following links will help you out how to build private chat.

socket.io

WebSockets

Private chat reference 1

Private chat reference 2

himeshc_IB
  • 853
  • 4
  • 10
  • 1
    This is a borderline [link-only answer](http://meta.stackexchange.com/q/8231/213671). You should expand your answer to include as much information here, and use the link only for reference. – Kyll Nov 01 '16 at 16:08
2

A better approach is using nodejs instead of php. You can check this link for a really nice implementation of chat which you can use. While php chat has performance issues like you mentioned, nodejs doesn't because instead of polling the messages it pushes them to the client when there is something to push. And also you receive ready to use solution right out of the box (of course you have to modify it) which will save you development time.

But if you still want to go with the php way, then you have these options:

  • jquery + ajax (like you are doing it right now)
  • php sockets - here is an example of php chat using websockets https://www.sanwebe.com/2013/05/chat-using-websocket-php-socket. This approach has its pros and cons. One of the major cons is that is not supported by old browsers and may be the setup process is not that easy. But I'll prefer it over the ajax requests.
krasipenkov
  • 2,031
  • 1
  • 11
  • 13
1

You mention getting data from the database, but one could argue that, for the purpose of a chat application, the database is incidental. Maybe you want to store the chat history and the database is a natural place to do so, but the primary functionality is to transmit messages. So you are using the database as some kind of message buffer.

Websockets seems the best option, as others have mentioned. If you want PHP server-side, in addition to the Kraken framework as mentioned in a comment to your question, you can take a look at the Ratchet library. They have a tutorial for a simple chat in their site: http://socketo.me/docs/hello-world

Basically, you need another server-side process (in addition to your webserver) to receive and broadcast the chat messages. Following that tutorial, in the onMessage method of the Chat class you can do the insert in the database if needed, preferably asynchronously.

Client-side, you will need to connect to the websocket using Javascript. Simple example:

var conn = new WebSocket('ws://localhost:8080');

conn.onopen = function(e) {
    console.log("Connection established!");
};

conn.onmessage = function(e) {
    console.log('Message received: ' + e.data);
    addMessageToChatbox(e.data);
};

$('#yourChatInput').keypress(function(e) {
    if(e.which == 13) { // "enter" was pressed
        conn.send($(this).val());
        $(this).val('');
    }
});

function addMessageToChatbox(message) {
    //
}
alepeino
  • 9,551
  • 3
  • 28
  • 48
0

You can do a trick, suppose data is not json it is javascript file declaring single variable now you have to add it to document such as

below is your data.php(javascript generated by php)

in php

echo 'var x = {"name":"Anshuman"}'

In javascript

  var s = document.createElement( 'script' );
  s.setAttribute( 'src', 'data.php');
  s.onload=callback;
  document.body.appendChild( s );
function callback(){
console.log(x);
}
anshuVersatile
  • 2,030
  • 1
  • 11
  • 18
-6

There aren't any sensible ways. You have to bring the new data in somehow right? The to ways to do that are by reloading the page or by Javascript / Ajax to avoid the reload.

You could make the update one sided so that when Person A writes to person B the request is performed on the submit of the new message. This would mean that no new messages are retrieved unless one is sent. (Not practical)

Another method would be to have a last message time noted somewhere on its own and you could repeatedly check for that. Should that time change you could fetch new data then but that would not fix the amount of requests... only the amount of data being transferred.

I suggest you look at the size of the data from the json/php. Have you ran tests to see how long that is taking or how it is performing?

I could refer you to this post which is using NON jquery requests if you like.

Community
  • 1
  • 1
  • The data takes short period to load but the client user is using google chrome on a windows pc which when i check on the task manager and the chat app is started it uses much memeory, Looking back on the network tab of google chrome there are very many requests happening thats why am worried if there is another option even though not jquery but returning Json data – Geoff Oct 22 '16 at 20:24
  • Example how stack overflow works when a new comment is added there is an automatic reload but no many ajax requests – Geoff Oct 22 '16 at 20:25
  • Yes this is true, however you will not be informed of the new comment unless you reload the page. You can make less frequent request or none if you dont need to. I guess you need to specify the importance of updating. I presume you want live update of new messages. If thats the case you need to check for them, there is no other way. If not, then you only lead to check on page load. Worst case the check could be done by "Check new messages" button or on focus of the chat box – LordRampantHump Oct 22 '16 at 20:34
  • could you have an idea what technology stackoverflow uses for its notifications – Geoff Oct 22 '16 at 20:52
  • Again.... as far as I can tell, there are no live updates on these pages... Only on page load. If thats what you are after then thats easy – LordRampantHump Oct 22 '16 at 20:56
  • @LordRampantHump you're wrong, there are automatic updates on these pages, without load. I'm assuming it uses websockets to push that to the user/browser, but I haven't looked into it. – junkfoodjunkie Oct 28 '16 at 01:32