Sending phaser image over websockets - javascript

So basically I want to send an image loaded by phaser over websockets. (socket.io) However it seems that an image has some kind of recursive/circular structure in it and therefore I can't send it (or convert it to a string).
Now I think I have already found the point where the problem occurs but I don't know how to avoid it.
Part of the structure of a picture:
snippet out of the console in chrome
Code:
Game.prototype = {
preload: function(){
let me = this;
console.log("loading images...");
me.game.load.image('dragon', '/dragon.png');
me.game.load.image('kraken', '/kraken.png');
me.game.load.image('godzilla', '/godzilla.png');
me.game.load.image('alien', '/alien.png');
},
Is it somehow possible to send an image over websockets like this or do I have to get the key of the picture out of the structure and send it?
EDIT:
Did it by getting the key, which is a better solution anyways i guess.

You should open a WebSocket (ws) before anything else. The ws promotion will use a different schema (ws://) over the same TCP/IP connection. Use the Dev Console to watch the network transactions.
Socket.io must be used on both the server and client-side of the WebSocket "tube". Quote from "Phaser Multiplayer Gaming Systems" page 84, “Socket.IO is not a WebSocket library with fallback options to other real-time protocols. It is a custom real-time transport protocol implementation on top of other real-time protocols. Its protocol negotiation parts cause a client supporting standard WebSocket to not be able to contact a Socket.IO server. And a Socket.IO implementing client cannot talk to a non-Socket.IO based WebSocket or Long Polling Comet server. Therefore, Socket.IO requires using the Socket.IO libraries on both client and server side.”

Related

Socket server on client side js?

I have node.js server, and I need to create dynamically updated web page with updating data. So, I thought that sockets are way to go.
But there's one problem. I need to send data from the server to client(to browser).
From my research, it is not really possible to create socket server with the client side JS. It is easy to do it the other way, but to send data only from server to client?
What would be best and easiest way to do that?
You create a webSocket or socket.io connection from your client to your server and your server is the webSocket or socket.io server. Once that connection is established, you can then freely send data either way across the connection, from client to server or from server to client.
This type of architecture is ideal for sending data from your server to a web page to dynamically update the web page as new data arrives.
webSocket is the base transport. socket.io is a layer on top of webSocket that adds a bunch of useful features such as auto-reconnect and structured messages. You can use either from a browser. webSocket support is built-in to the browser. If you want to use the additional features of socket.io, then you include the socket.io client library in your web page.
Here's a listing of some of the additional features socket.io offers over a plain webSocket: Moving from socket.io to raw websockets?.
I am not sure I have fully understood your question.
But, if I got it correctly, in order to have a "socket connection" you need to have two sides - a server and a client.
Use socket.io lib with a lightweight node.js server.
You can take a look at their docs + examples - will be very straight-forward.
If you still having trouble, write.

html javascript connect to raw socket

I have a c# tcp server, I want to connect to the server via a html client page.
The problem: There is no simple way to create TCP sockets in Javascript on a browser side. Although solutions like Websockets allow to create something that resemble sockets, you can use them to connect only to servers that support Websockets. Not to any random servers that know nothing about HTTP.
so is there a solution to connect to my srver.
No. There just isn't. The browser is a tightly locked down environment. The only socket connection that you can open from JavaScript is WebSocket. Since it's your server, adding WebSocket support shouldn't be too complicated, and there are WebSocket libraries available for C#.
Maybe someone else will have an idea for you, but...
The best solution I can think of is for your server to support websockets.
The situation you described - along with connectivity issues for traffic passing through proxies and routers - is one of the reasons Websockets were introduced in the first place.
Bare in mind that Websockets can send and receive binary data. It's just that javascript make it more comfortable to write text based messages.
Also, many NAT routers, Proxies and firewalls will block raw TCP/IP communication while allowing Http communication to pass through. This is why you have a better chance at connection establishment and retention when implementing the Websocket protocol.

For a push notification, is a websocket mandatory?

I have PHP on the server side, and HTML and javascript on the client side.
I am making an app where a stakeholder types a message that is broadcasted to multiple recievers of a group in real time.
I did some research on google and I understand I need to use WebSockets or Comet for real time push notifications. Is WebSocket or Comet mandatory for sending mass notifications to users?
Is my understanding correct? Any references to start with?
If the client is a browser, then the ONLY two ways a standard browser can connect to a server is via an Ajax (e.g. http) request or a webSocket connection. So, if you want a client to get notified of something from the outside world it has to use one of those two mechanisms.
HTTP requests are transitory. The client makes a request of a server, the server responds. HTTP requests are perfect for the client requesting information from the server. They are not very good at the server sending information to the client because normally the client is not connected. There are hacks and work-arounds where the client "polls" the server on some interval and maybe even the server uses longer running requests to try to simulate a "push" type system, but they are sub-optimal hacks at best.
webSockets are continuous connections. The client connects and the connection remains in place for as long as both sides want. This allows either side the ability to send a message to the other side whenever they want. That means the server can "push" data to the client whenever it wants. webSockets are efficient for push connections and are recommended (this is one of the main things they were designed for).
Comet is a library that was originally built for using HTTP to try to "hack" or "simulate" push before webSockets were invented and then before they were widely supported. I can think of no reason why one would want to use Comet instead of a webSocket unless you had such an old browser that webSocket was not supported.
So, if you are trying to do "realtime server push" to a browser, then you must have a continuously connected socket from the client which means webSocket (or something built on top of webSocket like socket.io).
For phone apps where you have access to the phone SDK, you can use the "push" system built into the OS to push some messages from server to client. This isn't quite the same as the two way webSocket channel, but since you asked about "push notifications", the OS push services available in both Android and IOS could also be an option for pushing notifications from server to client. Here's info on iOS notifications and Google Cloud Messaging
As of 2016, one can also use Server-sent events in all modern browsers except Microsoft browsers (not supported yet in Edge or IE) to push data from server to client. Here's a browser compatibility table. Server-sent events use a long lasting HTTP connection, a special MIME type and a supporting client in order to be able to send events from server to client at any time. Unlike webSockets, server-sent events are one way only (from server to client). A client would then use a traditional Ajax call in order to be able to send data to a server (whereas with a webSocket data can be sent either way over the same webSocket connection).
Here's a good description of how server-sent events work: How do server-sent events actually work?
Is your client application a SPA? (Single Page application)?
It's very important because if not, you have to consider that everytime a client change page, connection with websocket server will be lost.
In this case you have to manage a queue because if stakeholder send a multicast request when one client is disconnected, client won't receive nothing.
Polling won't solve this situation too and it's an orrible solution because mobile clients (for example) with typical internet plan, will consume megabytes for unuseful "ping" traffic.
A real example of polling is a child in a car asking his dad every minute if they are arrived to a destination!
So, Is there a solution without using spa?
Yes, using a "shared storage" between stakeholder and clients, and using websocket only for "wake up" online clients saying: Hey there is something new, go to check!
Everytime a client open a page it will receive from backend also not-read notifications, taken from the storage.
When a stakeholder want to notify something, it will just store the notification message in the shared storage and send a "pulse" to notification server.
Notification server will forward the "pulse" to online clients (just in case someone is stuck reading a page).
If a "pulse" is lost because a client is changing page there is no problem because the client will bring notifications from the storage.
Every page will contain this logic:
Retrive number or unread notifications (server side)
Connect to the notification server after 5 seconds (javascript side).
Hope it helps.
I would suggest that using webSockets is a more efficient way compared to other options, why is this? Well when a client receives a notification that there's a change in the server there is no need to create an AJAX call to the server to get that change, it can be sent to the client with the same webSocket connection more easily than AJAX. This means efficient code and a faster running App!

WebRTC Data Channel server to clients UDP communication. Is it currently possible?

Is it possible to use WebRTC Data Channels on Node.js in a way that mimics the functionality of WebSockets except using UDP?
In essence I want to have a server running Node.js with which browser clients can establish a full duplex bi directional UDP connection via JavaScript.
My question is the same as this one from 8 months ago. I repost it because the only answer was :
Yes, in theory you should be able to to do this. However, you'll need a node module that supports WebRTC data channels, so that you can connect to it like any other peer. Unfortunately, scanning through the current modules, I don't see one that implements the data channel.
Any of you know of such a module ? In my search I found some node modules with the words "webrtc" and "datachannel", but they didn't look like what was needed, they looked like they were meant for specific needs.
This project is very active, and seem to undertake the mission of importing the entire WebRTC stack into node.js
There's also this project but it looks pretty inactive.
Would love to know if that was satisfying and if you're doing such a project (as in the question) please link to github :)
We have implemented the exact same thing: a server/client way of using WebRTC. Besides we also implemented data port multiplexing, so that server would only need to expose one data port for all rtcdata channels.
A quick summary of how it is achieved:
We implemented in nodejs, using wrtc library. But the same principal could be applied to other implementations.
The server exposes a control port, so that the client will exchange SDPs with the server for establishing their data channel.
To support data port multiplexing, At the server, we modify both peer's SDK, so that
Client will always connect to the same server ip:data_port
We implement a UDP data proxy inside the server, so that it can be the bridge between the server webrtc engine and the client.
The code is at: https://github.com/noia-network/webrtc-direct

Socket.io - Socket connection between clients

Im looking form something to make socket connection between client, without pass through the server. Is there any node package to do this?. Server only send the other client socket, and the clients recieve and send data to each other..
Or, how can we make the implamantation. We need to make a server in client side, but we dont have node installed in the client..
The closest thing that currently exists in some form is not currently part of socket.io. It is called WebRTC and is implemented in Chrome currently. It allows the browser to connect with other browsers.
http://www.webrtc.org
The question is what kind of application is your client? If you are talking about ordinary webbrowsers you need to think about writing pluings (tough case).
If you are talking about clients you have more control then you should look at technique Puching the hole exploited by Skype or P2P apps.
http://it.slashdot.org/story/06/12/15/191205/how-skype-punches-holes-in-firewalls
In general the server is used for TCP sockets orchestration the acutall comunication go directly.

Categories

Resources