首页 > 解决方案 > Socket.io+Cordova 的客户端是创建无限的连接实例

问题描述

我正在尝试创建一个简单的应用程序,它使用套接字在 Android/IOS 应用程序和服务器之间进行通信。为此,我使用 cordova 并作为插件 Sockets.IO。目前我被卡住了,似乎无法弄清楚我做错了什么,因为在我连接到服务器的那一刻, var socket = connection('http://localhost:3000');它继续疯狂地建立连接。

服务器端的结果:

服务器代码

服务器.js

var server = require('http').createServer();
var io = require('socket.io')(server);
var connectCounter=0;

io.sockets.on('connection', function (socket) {
    connectCounter++;
    console.log('a user connected: ' + socket.id);
    console.log('# ' + connectCounter);
  
    socket.emit("test", "ping");

    socket.on('disconnect', function () {
        console.log('socket disconnected');
        connectCounter--;
        console.log('# ' + connectCounter);
    });

    socket.on( 'message', function( data ) {
        console.log( 'Message received ' + data.message );
        io.sockets.emit( 'message', { message: data.message } );
    });

    socket.emit('text', 'wow. such event. very real time.');
});


server.listen(3000);

客户代码

index.js

var socket = io.connect('http://localhost:3000');

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

    // deviceready Event Handler
    //
    // Bind any cordova events here. Common events are:
    // 'pause', 'resume', etc.
    onDeviceReady: function() {
        this.receivedEvent('deviceready');
    },

    // Update DOM on a Received Event
    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();

索引.html

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="js/jquery.mobile-1.4.3.min.js"></script>    
        <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>
            <button class="ui-btn ui-corner-all" id="SendButton">Send</button>
        </div>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/socket.io-1.0.3.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <script type="text/javascript">

        /*socket.on('connect', function() {
            socket.on('text', function(text) {
                console.log('Received from socket: ' + text);
             });
           });
*/
$( "#SendButton" ).click( function() {
    var msg = $( "#messageText" ).val();
    
    socket.emit( 'message', 'hallo' );
    return false;
});
        </script>
    </body>
</html>

最后,对于服务器端,我想使用 ESP8266,但目前我在 PC 上运行测试并遇到上述问题。我在浏览器、Android(模拟器/手机)、IOS(模拟器)上尝试这个,结果相同。

标签: node.jscordovasocketssocket.io

解决方案


推荐阅读