ajax - Inline support Chat implementation -
we creating live chat support system. if visitor clicks on live chat button, new window opens , user can talk their. trying accomplish open chat window inline link: http://anantgarg.com/chat/sampleb.php
please note building support chat system not peer chat system above link intends.
the problem facing here how we'll able access database located on different server (our server) , not on server our client's website located. above solution can work fine if on same server. so, please suggest on how overcome hurdle.
thanks.
i think, solve task may use websockets, support cross-domain connections.
in case, may write chat client side , place on cliet's website, request weill processed server db access.
extend
of course can use json websockets json ajax. websockets transport - json content passed transport.
i write code when reserarch websockets (chat lietn side):
function connect(){ var socket; var host = window.location.host; var wsurl = "ws://" + host + "/connect"; try{ var socket = new websocket(wsurl); message('<p class="event">socket status: '+socket.readystate); socket.onopen = function(){ message('<p class="event">socket status: '+socket.readystate+' (open)'); //run "ping-pong" support connection settimeout(pingpong, 5000); } socket.onmessage = function(msg){ //parse server answer string json object var answer = json.parse(msg.data); if (answer.type == 'message') { message('<p class="message">'+answer.user+': '+answer.message); } } socket.onclose = function(){ message('<p class="event">socket status: '+socket.readystate+' (closed)'); } } catch(exception){ message('<p>error'+exception); } function send(){ var text = $('#text').val(); if(text==""){ message('<p class="warning">please enter message'); return ; } try{ //send data via json socket.send('{"type": "message", "message":'+json.stringify(text)+'}'); } catch(exception){ message('<p class="warning">'); } $('#text').val(""); } var token = 0; function pingpong() { token++; try{ var msg = {'type': 'ping', 'token': token}; socket.send(json.stringify(msg)); settimeout(pingpong, 5000); } catch(exception){ message('<p class="warning">'); } } function message(msg){ $('#chatlog').append(msg+'</p>'); }//end message() $('#text').keypress(function(event) { if (event.keycode == '13') { send(); } }); $('#disconnect').click(function(){ socket.close(); }); } $(document).ready(function() { if(!("websocket" in window)){ $('#chatlog, input, button, #examples').fadeout("fast"); $('<p>oh no, need browser supports websockets. how <a href="http://www.google.com/chrome">google chrome</a>?</p>').appendto('#container'); }else{ //the user has websockets connect(); } }); </script> <meta charset=utf-8 /> <style type="text/css"> body{font-family:arial, helvetica, sans-serif;} #container{ border:5px solid grey; width:800px; margin:0 auto; padding:10px; } #chatlog{ padding:5px; border:1px solid black; } #chatlog p{margin:0;} .event{color:#999;} .warning{ font-weight:bold; color:#ccc; } </style> <title>websockets client</title> </head> <body> <div id="wrapper"> <div id="container"> <h1>websockets client</h1> <div id="chatlog"> </div> <p id="examples">e.g. try 'hi', 'name', 'age', 'today'</p> <input id="text" type="text" /> <button id="disconnect">disconnect</button> </div> </div> </body> </html> also can use socketio library it, dont sure cross-domain work.
Comments
Post a Comment