Actually, this looks like the simplest way to do this, since you have to have some protocol over the raw TCP connection. Look up websocket servers in general - plenty of people have done this on Particle devices.
Web App Side:
<!DOCTYPE HTML>
<html>
<head>
<script type = "text/javascript">
function WebSocketTest() {
if ("WebSocket" in window) {
alert("WebSocket is supported by your Browser!");
// Let us open a web socket
var ws = new WebSocket("ws://192.168.2.8:2525/"); // or whatever your IP / port combo is you set on your Photon in WiFi and TCPServer
ws.onopen = function() {
// Web Socket is connected, send data using send()
ws.send("Message to send"); // send either a string cmd or a JSON encoded string cmd here
// also call this same code from your onClick event or however you want to trigger this.
alert("Message is sent...");
};
ws.onmessage = function (evt) {
var received_msg = evt.data; // parse either a string response or a JSON encoded string response here
alert("Message is received...");
};
ws.onclose = function() {
// websocket is closed.
alert("Connection is closed...");
};
} else {
// The browser doesn't support WebSocket
alert("WebSocket NOT supported by your Browser!");
}
}
</script>
</head>
<body>
<div id = "sse">
<a href = "javascript:WebSocketTest()">Run WebSocket</a>
</div>
</body>
</html>