I have come across many posts on here and various other sites about how to get socket.io working in an android phonegap app, unfortunately I still seem to be having problems. If you've had any experience of getting this kind of thing set up, any pointers you could give would be greatly appreciated, having now spent several days tearing my hair out :P
So to get started I have a very simple socket.io server setup and running on my local machine:
var server = require('http').createServer();
var io = require('socket.io')(server);
io.sockets.on('connection', function (socket) {
console.log('socket connected');
socket.on('disconnect', function () {
console.log('socket disconnected');
});
socket.emit('text', 'wow. such event. very real time.');
});
server.listen(3000);
which I got from one of the tutorials that I found, and it seems to work ok.
Now in my phonegap app all the code I have is as follows:
var app = angular.module("MyApp", [
"MyCtrl"
]);
app.controller("AppCtrl", ["$scope", function ($scope) {
console.log("About to attempt a connection (" + socket + ")!");
var socket = io("10.0.5.159:3000");
socket.on("connect", function(data) {
console.log("Connected: " + data);
});
socket.on("error", function(err) {
console.log("Error: " + err);
});
}]);
Just a basic angular.js app with a single controller that attempts to connect to the server (the ip address provided is the correct one on my local network). My log gets hit so I know this code is executed, but I never get a connect event or an error event, and no errors come up in the console, it just seems to fail silently. I also get no connection event on the server.
As per another stackoverflow post I have ensured that my config.xml contains the appropriate
<access origin="10.0.5.159*" />
entry. But I still seem to be getting nowhere with it. The same line of code
var socket = io("10.0.5.159:3000");
when executed in a safari browser window works exactly as expected and my server logs a connection event, so I'm confident that the server and the connect code are valid.
Any ideas what I might be doing wrong?
Your code is not working because on the server side u have emit "text" event therefore on client side your are supposed to write socket.on("text")
On server side you haven't emit "connect" and "error" events then how you are supposed to get these events on client side. And I don't think that normal socket.js works with Angular js, You have to add Angular.js socket.io library.
Related
I'm setting up a Bluetooth LE GATT Server in Android, and want to use Web Bluetooth API in Chrome as a GATT client to check if it properly works. Actually, this is my first step to build a FIDO Authenticator in Android later on.
Firstly, I tried to set my service's uuid is 0000fffd-0000-1000-8000-00805f9b34fb in my Android app. Something like this:
// start gatt server
bluetoothGattServer = bluetoothManager.openGattServer(this, callback);
bluetoothGattServer.addService(
new BluetoothGattService(UUID.fromString("0000fffd-0000-1000-8000-00805f9b34fb"),
BluetoothGattService.SERVICE_TYPE_PRIMARY));
// start advertising
// ...
Then, I executed the following Javascript code in Chrome to check whether the connection can be established.
navigator.bluetooth.requestDevice({
filters: [{ services: ['0000fffd-0000-1000-8000-00805f9b34fb'] }] })
.then(device => { console.log(device); })
.catch(error => { console.log(error); });
However, I only got the exception as below
DOMException
When I changed the uuid to another one such as 62893031-5e68-4a71-94e4-01fb81f16818 in my Android code, then it worked! (I mean it was able to connect to my phone and I could see my device info in Chrome's console)
I didn't know what exactly the problem. What was the problem with my former uuid? How can I debug it to know the root cause?
Thank you for checking!
You can try
console.log(error.messsage);
in stead of
console.log(error);
You will see
requestDevice() called with a filter containing a blocklisted UUID.
https://webbluetoothcg.github.io/web-bluetooth/#attacks-on-devices
Check it out to see the security reason.
I have a really huge place in which what I need is that people can chat with each other. I would place WiFi router to cover the whole place but, due to the high amount of people, I can't provide an internet connection through that network. Which technology should I use? I've been reading about AllJoyn but I don't know if that would help me. Also, because of the amount of people (over 75,000) I can't setup a server to handle the service, per connection, 1 devices will have to be the host and the other one will have to be the client. Thanks
If you want to create your own application you could use something like Signalr and Xamarin using their SignalR component.
Taken from the Quick Usage on the component page:
// Connect to the server
var hubConnection = new HubConnection("http://server.com/");
// Create a proxy to the 'ChatHub' SignalR Hub
var chatHubProxy = hubConnection.CreateHubProxy("ChatHub");
// Wire up a handler for the 'UpdateChatMessage' for the server
// to be called on our client
chatHubProxy.On<string>("UpdateChatMessage", message =>
text.Text += string.Format("Received Msg: {0}\r\n", message));
// Start the connection
await hubConnection.Start();
// Invoke the 'UpdateNick' method on the server
await chatHubProxy.Invoke("UpdateNick", "JohnDoe");
Alternatively there are applications out there that likely do what you want already. For example http://beebeep.sourceforge.net/
I have an app that works fine on iOS. It uses Cordova and uses remote requests for some of its functions, however, on android, only on a device, it sometimes (pretty frequently) will not connect. It almost always works on the Genymotion emulator, except once, where I saw "NET CACHE ERR" or something similar to that in the Chrome dev tools console. (The default Android emulator cannot connect however.)
The calls are simple jQuery ajax post requests that work fine in the Genymotion emulator (all times except once), and fine in a browser and in the iOS Cordova app. Networking permissions are enabled and asked upon installation. Interestingly, it can still get the device id used for push notifications (which requires a network response, from what I can tell, however it could be misleading I suppose).
Example for the obligatory request:
function connect(){
$.post('https://example.com/stuff.php', {
'var': 'a variable!'
}, function(data) {
//internet request complete, confirm connection successful
window.connected = true;
});
}
window.connected = false;
setInterval(
function(){
if(window.connected==true){
//yeah you connected
}else{
//naw you not connected homie
connect();
}
},
3500
);
Lets say there are two android devices and a webpage.
On each of those devices there is a button being clicked and the webpage shows the accumulated clicks.
What makes this possible?
Are the android devices sending that data to a sql database and that counter is reading what currently is in that database?
Or can the device really send the information into the page?
The device can communicate data to the server or to the client side code. You can then have to decide what to do with the data. If you send it to the client side code then it would only update on one device, whereas sending it to the server would allow one click counter across every device.
Changing the page on the server side would add caching problems. So you probably want a data file instead, just a json or something that the server overwrites every time it receives another click.
This isn't very fast though and causes synchronisation issues between the users. For starters for a standard html page the client code is in charge of the calls to the server, so we would have to check the server periodically to see if the value has changed (say every 5 seconds).
A faster alternative would be to use a web socket. The client would keep a connection open to the server and listen for updates from the server, removing the need for our periodic check. Additionally the socket can be used to send clicks to the server and the server can keep the value in its memory removing the need for file writes.
Node.js can be downloaded from http://nodejs.org and this is the plug in I use for web sockets https://github.com/Worlize/WebSocket-Node.
So here is some server side code for a simple web socket server that parrots messages from 1 user to all users, including the user who sent it.
var connections = [];
var WebSocketServer = require('websocket').server;
var http = require('http');
var server = http.createServer(function(request, response) {
// process HTTP request. Since we're writing just WebSockets server
// we don't have to implement anything.
});
server.listen(1337, function() { });
// create the server
wsServer = new WebSocketServer({
httpServer: server
});
// WebSocket server
wsServer.on('request', function(request) {
//got a new user requesting a connection, so lets accept and store them
var connection = request.accept(null, request.origin);
connections.push(connection);
connection.on('message', function(message) { //inbound message
if (message.type === 'utf8') {
// process WebSocket message
send(message.utf8Data); //bounce to everyone else
console.log(message);
}
});
});
setInterval(function(){console.log(connections.length +" :users");},5000);
//every 5 seconds, tell us how many users we have
function send(message){
var i = connections.length;
while(i--)
connections[i].send(message);
//send the message to all users
}
Example client side
<html><head><script>
var connection, connIsActive = false;
// if user is running mozilla then use it's built-in WebSocket
window.WebSocket = window.WebSocket || window.MozWebSocket;
connection = new WebSocket('ws://127.0.0.1:1337');
connection.onopen = function () {
// connection is opened and ready to use
connIsActive = true;
console.log('Connection loaded');
};
connection.onerror = function (error) {
// an error occurred when sending/receiving data
connIsActive = false
console.log('error');
};
connection.onmessage = function (message) {
// handle incoming message
console.log(message.data);
};
function send(message){
if(connIsActive)connection.send(message);
}
</script></head></html>
Save the first snippet as "myserver.js" (or similar) and start it up in node via command line. Save the second snippet as a "client.html" and open it on 2 devices, or just 2 browser instances. Theres no interface on the client but you can send and receive messages from the debug console using send("message string")
Provided you can wrap your head around my snippets, modifying it to work like your example should prove fairly easy!
To achieve what you are trying to do, you need to learn socket programming for android.
In order to use two device(clients) you also need to learn port forwarding for servers.
To begin try this tutorial.
I'm trying to implement an HTML5 app that will work on desktop, android, and iOS. The app's main function is to wirelessly send commands to the server about what scripts to run and to receive regular messages pushed from that server about the status of those scripts.
The server is running nodejs and I decided to use Server Sent Events to do the push notifications. This requires that I use Firefox on Android since the native Android browser doesn't support SSE.
My implementation all works fine: the node server is publishing the events as it should and my client-side HTML5/javascript is picking it up fine on desktop chrome/firefox/safari, on my iPod iOS6, and my Android 2.2 phone.
However, there are 4 common situations that I need to handle:
the device loses its wi-fi signal
nodejs server crash (hopefully this isn't common!)
put browser into the background on iPod/Android while browsing another app, etc.
lock screen on iPod/Android while browser is running
Chrome/Safari behave perfectly on both desktop and iPod, as follows: if the server crashes, the site automatically reconnects and gets the pushed messages as soon as the server is up again, and if the browser app goes into the background for whatever reason, it is still getting those messages while in the background, or at the very least automatically reconnects as soon as it comes back into the foreground.
Firefox, however, both on desktop and on Android, is all too eager to close down that EventSource connection permanently. As soon as the browser loses connection to the server, either from server crash, from putting the firefox app into the background or from locking the screen, the EventSource connection is killed and does not ever try to reconnect. Of course, you can just reload the page when you come back to it, but this is annoying, especially in the case where you need to lock the screen because you need to put the phone in your pocket (this app needs to be used in some trekking situations).
Can anyone recommend any solution for this aside from just having to reload the page in Android Firefox all the time? Below is my dummy implementation, just sending random numbers every 5 seconds.
Server at /main/src
src : function(req, res) {
req.socket.setTimeout(Infinity);
// send headers for event-stream connection
res.writeHead(200, {
'Content-Type': 'text/event-stream',
'Cache-Control': 'no-cache',
'Connection': 'keep-alive'
});
res.write('\n');
var messageCount = 0;
var process;
function printEvent() {
messageCount++;
rand = Math.floor((Math.random()*10000)+1);
res.write('id: ' + messageCount + '\n');
res.write("data: " + rand + '\n\n');
process = setTimeout(printEvent, 5000);
}
printEvent();
res.socket.on('close', function () {
res.end();
clearTimeout(process);
});
}
Client
var source = new EventSource('/main/src');
source.onopen = function(e){
$("#test").html("Connected to server. Waiting for data...");
}
source.onmessage = function(e){
$("#test").html("MSG: " + e.data);
}
source.onerror = function(e){
var txt;
switch(e.target.readyState){
case EventSource.CONNECTING:
txt = 'Reconnecting...';
break;
case EventSource.CLOSED:
txt = 'Connection failed. Will not retry.';
break;
}
$("#test").html("Error: " + txt);
}
Thanks!!
i know only one solution, that is already used in many libs:
"heartbeat" messages - on the client side you may check, if the "random number" is not received from the server in 10 seconds (5000 seconds + some lag) - the connection is seems to be broken and you should do the reconnection
(with native EventSource you may use "close" method, than create new EventSource OR you can try https://github.com/Yaffle/EventSource )