Posted By

bcmoney on 12/10/10


Tagged

http proxy html5


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

wirenaught


proxy.html


 / Published in: HTML
 

URL: http://bcmoney-mobiletv.com/blog/2009/05/01/the-server-side-proxy/

Using WebMessaging or WebSocket for cross-site communication in HTML5 rather than a full-blown Proxy: http://www.tutorialspoint.com/html5/html5_websocket.htm

(Recommend using in unison with pysocketserver included in article, or, http://siriux.net/2010/08/php-websocket-server/)

  1. <!DOCTYPE HTML>
  2. <script type="text/javascript">
  3. /*
  4. * log
  5. * Log messages to the console or to the history object
  6. * USAGE:
  7. * log('inside coolFunc',this,arguments);
  8. * @author Paul Irish
  9. * @source http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
  10. */
  11. window.log = function() {
  12. log.history = log.history || []; // store logs to an array for reference
  13. log.history.push(arguments);
  14. document.getElementById('output').innerHTML = Array.prototype.slice.call(arguments).toString().split(":")[1];
  15. if(this.console){
  16. console.log( Array.prototype.slice.call(arguments) );
  17. }
  18. };
  19.  
  20. var notified = false;
  21.  
  22. /**
  23. * crossDomainMessage
  24. * Wraps the WebSocket message sending functionality of HTML5
  25. * NOTE: To use this you must run a WebSocket server, see:
  26. * PHP - https://github.com/nicokaiser/php-websocket
  27. * Python - http://code.google.com/p/pywebsocket/
  28. * Java - https://github.com/TooTallNate/Java-WebSocket
  29. * C# - http://superwebsocket.codeplex.com/
  30. */
  31. function crossDomainMessage() {
  32. var m = document.getElementById('msg').value;
  33. msg = (typeof m == "undefined" || m === null || m == "") ? "test" : m;
  34. if ("WebSocket" in window && !notified) {
  35. log("WebSocket is supported by your Browser: " + navigator.userAgent); notified = true;
  36. }
  37. else if (!("WebSocket" in window) && !notified) {
  38. log("WebSocket NOT supported by your Browser: " + navigator.userAgent); notified = true; // The browser doesn't support WebSocket (so you could fallback to a Flash or JS websocket library)
  39. }
  40. else if ("WebSocket" in window) {
  41. sendWebSocketMsg(msg);
  42. }
  43. else {
  44. alert("You need to use a 'Flash/JS websocket library' to support WebSockets in this browser!");
  45. }
  46. }
  47.  
  48. /**
  49. * sendWebSocketMsg
  50. * Sends a message via a web socket
  51. *@param msg String representing the text-based message to send
  52. *@param _server (optional) String representing the location of a server implementing the WebSocket protocol
  53. */
  54. function sendWebSocketMsg(msg, _server) {
  55. url = (typeof _server != "undefined" && _server !== null && _server !="") ? _server : "ws://localhost:8000/echo";
  56. var ws = new WebSocket(url); // opens a web socket
  57. ws.onopen = function() {
  58. ws.send(msg); // Web Socket is connected, send data using send()
  59. log("Sent the following Message: " + msg);
  60. };
  61. ws.onmessage = function (evt) {
  62. var received_msg = evt.data;
  63. log("The following Message was received: \n" + received_msg);
  64. };
  65. ws.onclose = function() {
  66. log("Connection was closed to server: " + url); // websocket is closed.
  67. };
  68. }
  69. </head>
  70. <body onload="crossDomainMessage();">
  71. <div id="sse">
  72. <label>Message to send: <input type="text" id="msg" name="msg" size="40" maxlength="100" value="test" onfocus="if(this.value='test'){this.value='';}"/></label>
  73. <button onclick="javascript:crossDomainMessage();document.getElementById('msg').value='';">Send Message via WebSocket</button>
  74. <div id="output" style="background:#eee;width:48%;text-align:center;" title="Last message received by the server will be displayed here...">
  75. </div>
  76. </div>
  77. </body>
  78. </html>

Report this snippet  

You need to login to post a comment.