11

私はsocket.ioの全体的なポイントは、最新のブラウザーについて心配する必要がないことだと思いましたか?笑

とにかく、私はソケットプログラミングに不慣れです。私は単にマウスの動きを模倣する小さなアプリを持っています。

複数のブラウザを開き、マウスを動かすと、アクションが他のブラウザに記録されます。小さな四角を動かします。ちょっとかっこいい。ただし、iPad(iOS6)で開くと、何も表示されません。ソケットが接続されていません。connectイベントにはアラートメッセージを入れても何もしません。

私のラップトップでは、IE、FF、Chromeで問題なく動作します。唯一の違いはlocalhost、iPadが私のマシンのIPを使用しているのに対し、私の開発マシンは使用していることです。ただし、ラップトップでローカルIPに接続しても、引き続き機能します。Safari/iPadではありません。

これが私のサーバーです。

    var app = require('http').createServer(handler),
        io = require('socket.io').listen(app),
        fs = require('fs');


    app.listen(80);

    function handler(req, res) {
        var file = __dirname + '/public/index.html';
        fs.readFile(file, 
            function(err, data) {
                if(err) {
                    res.writeHead(500);
                    return res.end('Error loading index.html');
                }

                res.writeHead(200);
                res.end(data);
            }
        );
    }


    var rooms = ['abc', 'test1'];

    var sockets = [];
    io.sockets.on('connection', function(socket) {
        sockets.push(socket);

        socket.on('m', function(data) {
            socket.broadcast.to(socket.room).emit('relay', {msg: 'MouseX: ' + data.x + ' MouseY: ' + data.y, x: data.x, y: data.y});
        });

        socket.on('join', function(room) {
            socket.join(room);
            socket.emit('updateStatus', {msg: 'Joined room ' + room});
            console.log('Joined room ' + room);
        });

    });

これが私のクライアントです:

<!doctype html>
<html>
    <head>
        <style>
            body {
                padding: 40px;
            }
            #cursor {
                background:white;
                border:1px solid black;
                color: white;
                display: block;
                height:24px;
                padding:6px;
                position:absolute;
                width:24px;
                z-index:20;
            }
        </style>
    </head>
    <body>

        <input id='msg' type='text' size='100' /><br />
        <input id='box' type='text' size='100' />
        <div id='cursor'></div>

        <script src='/socket.io/lib/socket.io.js'></script>
        <script>
            var socket = io.connect('http://localhost');
            var b = document.getElementById('box');
            var m = document.getElementById('msg');
            var c = document.getElementById('cursor');

            // join custom room
            socket.on('connect', function() {
                socket.emit('join', 'abc');
            });

            // update status messages from server
            socket.on('updateStatus', function(data) {
                m.setAttribute('value', data.msg);
            });

            socket.on('relay', function(data) {
                b.setAttribute('value', data.msg);
                c.style.left = parseInt(data.x) + 'px';
                c.style.top = parseInt(data.y) + 'px';
            });

            document.onmousemove = function(event) {
                event = event || window.event;
                socket.emit('m', {x: event.clientX, y: event.clientY});
            }


        </script>

    </body>
</html>
4

1 に答える 1

18

Localhostはマシンに対してローカルです。IPは、IPアドレスまたはドメイン名を使用する必要があります。

次のようなもの:io.connect( '192.168.1.110'); またはio.connect('test.myapp.com');

于 2012-10-17T15:58:12.657 に答える