在IIS上搭建WebSocket服务器(三)

简介: 原文:在IIS上搭建WebSocket服务器(三)编写客户端代码 1.新建一个*.html文件。 ws = new WebSocket('ws://192.168.85.128:8086/Handler1.
原文: 在IIS上搭建WebSocket服务器(三)

编写客户端代码

1.新建一个*.html文件。

ws = new WebSocket('ws://192.168.85.128:8086/Handler1.ashx?user=' + $("#user").val());
这个地方的IP和端口号对应着我们搭建在IIS上的WebSocket服务器

 

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
    <title></title>
    <script src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
    <script>
        var ws;
        $().ready(function () {
            $('#conn').click(function () {
                //ws = new WebSocket('ws://' + window.location.hostname + ':' + window.location.port + '/Handler1.ashx?user=' + $("#user").val());
                ws = new WebSocket('ws://192.168.85.128:8086/Handler1.ashx?user=' + $("#user").val());
                //var host = 'ws://192.168.85.128:8085/api/WSChat?user='+$("#user").val();
                //var host = "ws://192.168.85.128:8085/api/WSChat";
                //webSocket = new WebSocket(host);
                
                $('#msg').append('<p>正在连接</p>');

                ws.onopen = function () {
                    $('#msg').append('<p>已经连接</p>');
                }
                ws.onmessage = function (evt) {
                    $('#msg').append('<p>' + evt.data + '</p>');
                }
                ws.onerror = function (evt) {
                    $('#msg').append('<p>' + JSON.stringify(evt) + '</p>');
                }
                ws.onclose = function () {
                    $('#msg').append('<p>已经关闭</p>');
                }
            });

            $('#close').click(function () {
                ws.close();
            });

            $('#send').click(function () {
                if (ws.readyState == WebSocket.OPEN) {
                    ws.send($("#to").val() + "|" + $('#content').val());
                }
                else {
                    $('#tips').text('连接已经关闭');
                }
            });

        });
    </script>
</head>
<body>
    <div>
        <input id="user" type="text" />
        <input id="conn" type="button" value="连接" />
        <input id="close" type="button"  value="关闭"/><br />
        <span id="tips"></span>
        <input id="content" type="text" />
        <input id="send" type="button"  value="发送"/><br />
        <input id="to" type="text" />目的用户
        <div id="msg">
        </div>
    </div>
</body>
</html>

2.客户端A和客户端B通信效果

在浏览器中分别打开两个窗口,左边为客户端A,右边为客户端B,点击“连接”按钮,AB客户端分别与服务器建立连接

 

填写要发送的内容,即可看到A和B互相发送的信息了,即实现了AB客户端实现了WebSocket即时通信。

 

 

 

 

 

 

 

 

 

end

目录
相关文章
|
2月前
25、IIS服务器搭建(win server 2003)
25、IIS服务器搭建(win server 2003)
19 0
|
1月前
|
Kubernetes 网络安全 Windows
要在云效部署到阿里云服务器上的 Windows Server 上的 IIS
【2月更文挑战第18天】要在云效部署到阿里云服务器上的 Windows Server 上的 IIS
160 4
|
1月前
|
安全 关系型数据库 MySQL
利用windows服务器自带的IIS搭建网站并发布公网访问【内网穿透】
利用windows服务器自带的IIS搭建网站并发布公网访问【内网穿透】
209 0
利用windows服务器自带的IIS搭建网站并发布公网访问【内网穿透】
|
2月前
​小课堂 -- IIS服务器搭建(ws2003)
​小课堂 -- IIS服务器搭建(ws2003)
16 0
|
2月前
|
前端开发 网络协议 JavaScript
|
2月前
|
关系型数据库 MySQL 应用服务中间件
【IIS搭建网站】在本地电脑上搭建web服务器并实现外网访问
在网上各种教程和介绍中,搭建网页都会借助各种软件的帮助,比如网页运行的Apache和Nginx、数据库软件MySQL和MSSQL之类,为方便用户使用,还出现了XAMPP、PHPStudy、宝塔面板等等一系列集成服务,都是为了方便我们能快速建立网站。是不是不适用这些软件就无法建立网站了呢?答案当然是否定的,在Windows系统中实际上集成了建立网站所必须的软件环境。今天就让我们来看看,如何使用Windows自带的网站程序建立网站吧。
|
25天前
|
Ubuntu JavaScript 关系型数据库
在阿里云Ubuntu 20.04服务器中搭建一个 Ghost 博客
在阿里云Ubuntu 20.04服务器上部署Ghost博客的步骤包括创建新用户、安装Nginx、MySQL和Node.js 18.x。首先,通过`adduser`命令创建非root用户,然后安装Nginx和MySQL。接着,设置Node.js环境,下载Nodesource GPG密钥并安装Node.js 18.x。之后,使用`npm`安装Ghost-CLI,创建Ghost安装目录并进行安装。配置过程中需提供博客URL、数据库连接信息等。最后,测试访问前台首页和后台管理页面。确保DNS设置正确,并根据提示完成Ghost博客的配置。
在阿里云Ubuntu 20.04服务器中搭建一个 Ghost 博客
|
30天前
|
SQL 弹性计算 安全
购买阿里云活动内云服务器之后设置密码、安全组、增加带宽、挂载云盘教程
当我们通过阿里云的活动购买完云服务器之后,并不是立马就能使用了,还需要我们设置云服务器密码,配置安全组等基本操作之后才能使用,有的用户还需要购买并挂载数据盘到云服务器上,很多新手用户由于是初次使用阿里云服务器,因此并不知道这些设置的操作流程,下面给大家介绍下这些设置的具体操作流程。
购买阿里云活动内云服务器之后设置密码、安全组、增加带宽、挂载云盘教程
|
1月前
|
弹性计算
阿里云3M带宽云服务器并发多大?阿里云3M带宽云服务器测评参考
在探讨云服务器3M带宽能支持多大并发这一问题时,我们首先要明白一个关键点:并发量并非仅由带宽决定,还与网站本身的大小密切相关。一般来说,一个优化良好的普通网站页面大小可能只有几K,为便于计算,我们可以暂且假定每个页面大小为50K。
807 1
|
6天前
|
弹性计算 应用服务中间件 Linux
阿里云ECS服务器上从零开始搭建nginx服务器
阿里云ECS服务器上从零开始搭建nginx服务器