creating our own web chat pulgin onair - javascript

Hi all,
My question was how to create a web chat plugin to be supportive on my companies web site.
1- which protocal is most suitable for this application ??
2-about the coding all client site.
3- about the coding at server side.
4- how the transmission of data takes place from client to server and vice versa.

The easiest approach (not taking into account using all ready existing plugins) would be to use Ajax and a database. This means that the protocol will be HTTP/HTTPS if you want to implement it into your company's website.
The client and server side depends on how you want the chat to function. Try building something similar to IRC with one room for example.
create a database table which will hold the chat
on the client side implement a method which will send a message with Ajax and also recieve all messages posted
for the server side all you need is something which will store the new message and provide them when requested from the client
As I said, this is just a quick example, if you want a more complex chat system you will have to do a bit of research.

Related

ReactJS Messaging Service

Background:
I am building a reactJS application using AWS cognito, dynamo and S3. The application is based in the recruitment sector where employers and employees can post and view jobs respectively. When an employee applies for a job the employer can view the employees profile and decided whether or not to message them. Employees and employers converse via an on-site messaging service.
The Question:
What is the best method to facilitate user chat?
i.e. what is a nice & efficient way to store messages and notify users when they have a new message.
Our current approach is to have a setTimeout() on the site and check for new messages but this will be very inefficient so i'm looking for some guidance.
I would like to stay inside the amazon infrastructure as much as possible but I am open to all suggestions.
I'm currently building something similar for a startup I'm working at. Our React app is served by node.js server, while the API backend is provided by a django API with drf. As in your user chat case, we need to handle some real time data arriving in the frontend.
Our approach
The solution may be split up into inter server and server-browser realtime communication:
We use redis (aws elasticache to be exact) as a publish/ subscribe message queue to push incoming data from the API backend to the nodejs server. Specifically, whenever an instance of the model in question is created due to an HTTP POST call (i.e. in your case a message, which is send to the server), we publish JSON serialized information on a channel specific to the actors of concern.
On the node.js servers, we subscribe to channels of interest and receive information from the backend in real-time. We then use socket.io to provide a websocket connection to the frontend, which may be easily integrated with React.
Limitations of this approach
You cannot simply server your React app as a static website from S3 and have to rely on a node x React approach. react-boilerplat(by Max Stoiber I think) is a great way to start.
What's more, you can also use websockets end to end. We use this approach as our data source isn't a browser but a constrained device.
Hope that helps!

Sending files to users with javascript

I searched the web to see if there was a way to send files (photos, videos, messages) to a user using an app. I couldn't find any clear examples or explanations on how to achieve it.
I have no idea, how to do this. Can anyone tell me how this can be done? Any help will be appreciated. I should also probably mention that the ultimate goal of this app is a messaging application.
Not sure what you mean by "sending files" to a user, but if you want them to download a file using javascript, you could use this excellent jQuery plugin: http://jqueryfiledownload.apphb.com/
Of course, there are many alternatives, such as creating an invisible iframe and then loading the url to the file you want your users to download into that iframe. You can read more about this over here: Download File Using Javascript/jQuery
Hope it helps!
First let me tell you that you can use Kandy js sdk, you can find about it here : https://developer.kandy.io/, I didn't test it but it looks very promising and provides many of the features you need.
In case you want to do it on your own(or you're just curious), WebSockets is the main gamer here.
Http protocol as you should know by now is a request-response protocol, the client make a request to the server and the server responds.
But sometimes we want the server to talk to the client in which we can use SSE(Server-Sent events), in other times we want to create a connection between the server and the client and we want both to be able to send to it and receive from it, that's what WebSockets are made for.
In your usecase you could have two strategies : peer-to-peer or centralized, in centralized strategy when user X wants to send something to user Y it has to first send it to the server and the server sends it to user Y.
For this you need websockets, you create a connection between user X and the server and another between the Server and user Y, you send the file from user X to the connection, the server then sends it through the other connection to user Y, user Y can send a new file to the Server so that the Server sends it to user X, and so on so goes.
From this you can conclude that Websockets has server part and client part, normally we launch websockets server that is different than the web server serving the application(both can be on the same Server computer or in different computers), if you don't want to bring your own server you can look at pusher : https://pusher.com/.
Pusher is a cloud service that provide sdks for many languages including javascript, in case you want to have your own server I can't talk about the server-side part of your problem because your question is a javascript question, for the client-part have a look at socket.io, this provides the client part as well as node server part but you can use the client part in case you don't want to use node for the server.
In case you want to build peer-to-peer connections, you can look at simple-peer.

Real Time Functionlity with php

I am working on attendance system where project management system is also handling using Javascript\Jquery at client side and PHP\MySQL at server side.
A feature in my web app is user message to admin. For this I have applied an ajax request which is made by setTimeout function (after every 15 seconds) to check that is there any new message comes in database if yes then return it to the admin.
It working fine but the drawback is (as you know) continuous request to server which really poor and bad. As I know that real time functionality can solve this problem I have checked some link websocket.io and signlR but there are applicable with Nodejs and asp.net.
So, how can I apply real time functionality with php or I get that new data have reached in to database without continues request with ajax.
There are actually some PHP tools for doing this now. For instance, check out Ratchet.
It's also possible to do bi-directional sockets by creating a simple TCP/IP server. I've done this before for bi-directional communication between a PHP server and a desktop app.
http://php.net/manual/en/sockets.examples.php

php mysql background process

i have developing a website that user can chat with other user if they are online . if one user send a message will notify that receiver on their screen , these checking process are happen in background process , i have an option of using
setinterval method and javascript self execution method
but i am looking much faster background process methods which will check every seconds if message or notification arrived .
could any one give suggestion for this.
You can use HTML5 websockets.
WebSockets is an advanced technology that makes it possible to open an interactive communication session between the user's browser and a server. With this API(JS functions), you can send messages to a server and receive event-driven responses without having to poll the server for a reply.
below is good link to start
http://www.sanwebe.com/2013/05/chat-using-websocket-php-socket
I think the best match for your needs will be http://elephant.io
Elephant.io provides a socket.io client fully written in PHP that should be usable everywhere in your project.
Take a look at the Thruway Project. It's a PHP websocket implementation using the WAMP protocol, which gives you Publish and Subscribe abilities (you can use that for your chat application) as well as RPC.
A good place to start would to take a look at this chat demo (source code) and then use Thruway as the WAMP router.
I'm one of the developers of the thruway project, so if you run into any issues or have any questions, feel free to ask.

Allow two clients interact without server

Is it possible to allow two clients interact directly without a server?
I am referring to websites, for example is it possible to create a chat between two clients that are on the same website using only javascript on the client-side.
If not, what's the minimum server-side to make a chat work between active clients on a website? (eg: one PHP file and no database) ?
My idea:
Storing the conversation would be easily done using localStorage on each client, the problem is how to send some data from client1 to client2 without storing anything (or at most that message) in the database. Also, note that "past" conversations should not visible, so no storage needed for that.
Note that I don't want any nodeJS or websocket solutions, I want something as simple as possible. So, what's the minimum code and files to make a chat between online users?
The WebRTC APIs will allow JavaScript to initiate a direct browser-to-browser connection, but a server is still required to serve the page and coordinate session initiation.
The APIs are still rapidly evolving and only available in bleeding-edge browsers, so it's not yet ready for real production use.
However—to be honest—for what you're trying to do, the easiest option is Node and socket.io:
var http=require('http'), express=require('express'), sio = require('socket.io')
, app=express(), srv = http.createServer(app);
app.use(express.static(__dirname+'/static'));
sio.listen(srv);
srv.listen(80);
...and now you have a working websockets server in 5 lines. Put all your client-side stuff in the static folder and you're good to go.
HTML5 has got a new Web Sockets feature
With this the server intervention is almost nullified..The server and client communicate through the new protocols
ws - Web Sockets protocol
wss - Web Sockets Secure protocol (similar to https)
Live demo
No, It's not possible. If you want a chat box, you have to store the data in the server. And what connects the clients, like display the chat texts and the same things to every client, they come from the server.. So it's not possible like that. Well, even free chat boxes put the data of each sites in their servers.
As for your idea using localStorage, maybe it's possible (But still, using the new WebSocket protocol), but it doesn't work in the time dimension, right? if another user joins, they won't see what has been sent before.

Categories