我完全理解你想通過你自己來寫這個,但也有很多框架在那裏,這將有助於你與複雜的東西,讓你專注於實際工作的業務問題來解決。
我們使用XSockets.NET的大部分時間,因爲這是最適合我們的需求。 設置AP一對一的聊天(或其他情況下)是很容易與XSockets因爲它是所有關於發佈/訂閱......而且你還可以過濾其中的服務器上發送消息與強大的擴展方法
一個簡單的示例聊天: 爲了節省一些時間,並保持它的愚蠢和簡單的我會用,你選擇你的名字,你在兩個城市的下拉列表所以實際上不是1-1,但它是如此,你會得到的。概念。
JAVASCRIPT/MARKUP
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-2.1.0.js"></script>
<script src="Scripts/moment.js"></script>
<script src="Scripts/XSockets.latest.js"></script>
<script src="Scripts/knockout-3.1.0.js"></script>
<script>
//viewmodel for our messages
var vm = {
messages : ko.observableArray([])
}
//xsockets connection
var conn;
$(function() {
ko.applyBindings(vm);
//Connect to our controller (Chat)
conn = new XSockets.WebSocket('ws://127.0.0.1:4502/Chat');
conn.onopen = function() {
//open, set city and username (for demo only)
conn.setProperty("UserName", $('#username').val());
conn.setProperty("City", $('#cities').val());
//listen for chatmesages
conn.on('chatmessage', function (d) {
//Add message to viewmodel
vm.messages.push(d);
});
}
//When we hit enter, send a message
$('input').on('keydown', function (e) {
if (e.keyCode == 13) {
//Build message, we do not need to set From since the server know who I am
var message = { Text: $(this).val(), Time: moment().format('MMMM Do YYYY, h:mm:ss a') };
conn.publish('chatmessage', message);
}
});
//When City or Username is changed, tell the server
$('#cities').on('change', function(d) {
conn.setProperty("City", $(this).val());
});
$('#username').on('change', function (d) {
conn.setProperty("UserName", $(this).val());
});
});
</script>
</head>
<body>
<input type="text" placeholder="type here, enter to send"/>
<select id="username">
<option value="steve">steve</option>
<option value="ben">ben</option>
<option value="tomas">tomas</option>
</select>
<select id="cities">
<option value="london">london</option>
<option value="paris">paris</option>
<option value="tokyo">tokyo</option>
</select>
<div data-bind="foreach:messages">
<h5 data-bind="text:From + ' - ' + Time"></h5>
<div data-bind="text:Text"></div>
</div>
</body>
</html>
C#
using XSockets.Core.XSocket;
using XSockets.Core.XSocket.Helpers;
namespace SimpleChat
{
public class ChatMessage
{
public string From { get; set; }
public string Text { get; set; }
public string Time { get; set; }
}
public class Chat : XSocketController
{
/// <summary>
/// My name, we set this from javascript...
/// </summary>
public string UserName { get; set; }
/// <summary>
/// We only send to people being in the same city, we set it from javascript
/// </summary>
public string City { get; set; }
/// <summary>
/// A user sends a message
/// </summary>
/// <param name="chatMessage"></param>
public void ChatMessage(ChatMessage chatMessage)
{
chatMessage.From = this.UserName;
//Send only to the client(s) being in the same city, but you can ofcourse change ot to another user only etc
this.SendTo(p => p.City == this.City, chatMessage,"chatmessage");
}
}
}
摘要 上面我做,除了代碼中的唯一的事情就是創建一個新的項目,然後
個
- 安裝XSockets(啓動xsockets服務器)
- 安裝XSockets.JsApi(用於發佈訂閱過的WebSockets)
- 安裝的jQuery(becasue我懶)
- 安裝Momoent。JS(用於工作在JavaScript日期室內用)
- 安裝knockoutjs(用於modelbinding)
- 增加了XSockets引導程序到App_Start(下添加 - > NewItem-> XSockets->發現XSockets.Web.Bootstrapper