나는 완전히 당신이 당신의 자기에 의해이 쓰기 싶습니다 이해하지만 복잡한 물건 당신을 도울하고 해결하기 위해 실제로 사용 비즈니스 문제에 초점을 맞출 수있게된다 거기에 프레임 워크 많이 있습니다.
우리는 XSockets.NET을 사용하기 때문에 우리의 요구에 완벽합니다. XSocket을 사용하면 게시/가입에 관한 모든 것 때문에 일대일 채팅 (또는 다른 시나리오)을 설정하기가 매우 쉽습니다. 강력한 확장 방법을 사용하여 서버에서 메시지를 보낼 위치를 필터링 할 수도 있습니다.
간단한 샘플 채팅 : 시간을 절약하고 어리 석고 단순하게 유지하려면 두 개의 드롭 다운을 사용하여 이름과 도시를 선택하십시오. 실제로 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");
}
}
}
요약 다음
01 (나는 게으르다를 변경할 수 없기)
- 는 Momoent를 설치
- 가 jQuery를 설치 23,516,
- 설치 XSockets의 (a xsockets 서버를 시작합니다)
- 는 XSockets.JsApi를 설치 (대한 WebSocket을을 통해 가입 게시).
- 은 (modelbinding 용) knockoutjs 설치
- 라이트 애드온> NewItem-> XSockets->에서 찾을 App_Start로 XSockets 부트 스트 래퍼 (
XSockets.Web.Bootstrapper (자바 스크립트 사랑의 기간을 사용하기위한) JS