CODEWITHSUNDEEP
androidnode.jscordovasocketssocket.io
Kasun
Kasun

Reputation: 513

Node.js and Socket.io app with Apache Cordova not working in android

I'm trying to follow this simple tutorial socket-io-with-apache-cordova for android with apache cordova. So far I did everything as in the tutorial and I use my own android phone with android version 8.0 to test the app. When I type the cordova run command app get launched and shows the screen with "DEVICE IS READY" and nothing happens. I get this Received Event: deviceready message and following errors in the chrome remote debugging console and nothing happens it doesn't pop up an alert like it supposed to.

localhost:3000/socket.io/?EIO=2&transport=polling&t=1549179448883-0:1 Failed to load resource: net::ERR_CONNECTION_REFUSED

GET http://localhost:3000/socket.io/?EIO=2&transport=polling&t=1549179463998-5 0 ()

This is the index.html

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Hello World</title>
</head>

<body>
    <div class="app">
        <h1>Apache Cordova</h1>
        <div id="deviceready" class="blink">
            <p class="event listening">Connecting to Device</p>
            <p class="event received">Device is Ready</p>
        </div>
    </div>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="http://cdn.socket.io/socket.io-1.0.3.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
        app.initialize();

        document.addEventListener('deviceready', function() {
            var socket = io.connect('http://localhost:3000');
            socket.on('connect', function() {
                socket.on('text', function(text) {
                    alert(text);
                });
            });
        });
    </script>
</body>

</html>

And when I change var socket = io.connect('http://localhost:3000'); like this with my ip address var socket = io.connect('http://172.27.180.225:3000'); it doesn't give any errors in the console only this Received Event: deviceready message in the console but nothing happens.

index.js file

var app = {
initialize: function() {
    document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
},

onDeviceReady: function() {
    this.receivedEvent('deviceready');
},

receivedEvent: function(id) {
    var parentElement = document.getElementById(id);
    var listeningElement = parentElement.querySelector('.listening');
    var receivedElement = parentElement.querySelector('.received');

    listeningElement.setAttribute('style', 'display:none;');
    receivedElement.setAttribute('style', 'display:block;');

    console.log('Received Event: ' + id);
}
};

app.initialize();

server.js file

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);

index.js and server.js are located at www/js directory And in Package.json I've added these line to start the server

"main": "server.js",
"scripts": {
    "start": "node server.js"
},

What am i doing wrong ? any help would be appreciated !

Upvotes: 1

Views: 400

Answers (1)

A4M5
A4M5

Reputation: 1

I think you forgot to start the server: Move server.js to the first folder of your project and start it from the command line with "node server.js" or "npm start", as you defined it in Package.json In the same computer, in another command line, start the project. I did it with "cordova emulate browser"

Upvotes: 0

Related Questions