socket.io通信

春节放假了，打算把搁了很久的项目做了。

项目的来源是这样的：
虾米音乐把直播间功能砍掉了。
直播间就是播主放什么歌，观众也能跟着听的一个功能。
可以一起听歌的意思。

然后我就立了flag说要做个谷歌插件来实现被他砍掉的直播间功能。
主要功能就是在观众端同步执行播主进行的操作就好了。

于是开始写了。

准备
因为这个功能是实时性的，就想到用socket.io。
要用socket的话，要先安装node。
nodejs并不在ubuntu的默认源中，需要自行添加ppa再安装。

新建package.json文件，里面写{}。安装express包和socket包。
npm install --save express
npm install --save socket.io

安装完毕，再写个基本的端口监听和返回响应的功能，存为index.js。

var app = require('express')();
var server = require('http').Server(app);

var listen_port = 9999;
server.listen( listen_port );

//route
app.get('/', function( request, response ){
    response.send('Hello world');
});

在这里监听的是9999端口。
输入node index.js就能启动服务器了。
目前没有在启动的时候输出内容，所以运行上面的命令后是没有任何输出内容的。
直接访问相应地址就可以看到运行结果。运行结果应该是会输出“Hello world”。

插件的撰写过程就另开一篇文章写吧。
插件实现的最主要功能就是往页面里插入代码。
插入的代码就是socket的客户端。

代码
好了，现在写客户端。

var socket_server, socket;

$(document).ready(function () {
    var btn = $('<button>').attr('id','test').css({
        'outline':'3px solid green',
        'position':'absolute',
        'top':'0',
        'left':'0',
    'width': '100px',
    'height': '30px'
    });
    $('#player-main').append(btn);

    socket_server = 'http://plamenatv.free.bg/up.html //socket地址
    socket = io( socket_server );

    $('#test').on('click', function(){
        socket.emit('player.pause', 'Amethyst'); //触发事件player.pause，发送数据为Amethyst
    });
});

与此同时，服务端也要相应的增加了。

...  //原来写的代码
io.on('connection', function( socket ){
    socket.on('player.pause', function( message ){  //监听事件
        console.log('Player paused ' + message + '.'); //把收到的消息打印出来
    });
});