如何在jQuery中使用套接字？

jQuery 前端之家
前端之家收集整理的这篇文章主要介绍了如何在jQuery中使用套接字？，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
这是一个非常复杂和适当的问题,所以对于我需要做的事情可能没有一个现实的答案.

我有一个使用无线接收器的任务,需要的不仅仅是jQuery的get / post功能.

由于跨域问题,这个jQuery得到了在Aptana IDE中创建的Adobe Air App中执行.

它必须是adobe air,因为Web服务器不会接近无线接收器最终连接的位置.

所以我需要一个可以与2Know Renaissance无线接收器通信的应用程序.

我已经创建了一个应用程序来完成一些通信.这是我到目前为止可以采取的步骤.

>连接到接收器
>查看有多少手持设备连接到接收器
>然后应该有一些来回传播,至少在我的知识中,这在ajax中并不容易.

这是我一直在使用的代码,这是关于第24版,这是我已经得到的.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>2Know Wireless Communicator</title>
</head>
<body>
<h1>Current Status/Prograess</h1>

<!--- step 1. is server connected --->
<div id="server_status" style="font-size:12px;"></div>

<!--- step 2. list number of devices connected --->
<div id="device_count" style="font-size:12px;"></div>
<div id="device_info" style="font-size:12px;"></div>

<!--- step 3.a Service Handler handler status / csh = Service Handler handler --->
<div id="csh_status" style="font-size:12px;"></div>

<!--- step 3.b disconnect status handler handler of many handlers --->
<div id="dis_status" style="font-size:12px;"></div>

<!--- step 4. test sending a question to a device --->
<div id="post_results" style="font-size:12px;"></div>

<!-- load the local jquery -->
<script type="text/javascript" src="lib/jquery/jquery-1.4.2.js"></script>
<script type="text/javascript" src="lib/jquery/json_parse.js"></script>
<script type="text/javascript" src="lib/jquery/jparse.min.js"></script>
<script type="text/javascript" src="lib/air/AIRAliases.js"></script>
<script type="text/javascript" src="lib/air/AIRIntrospector.js" />
<!-- Include service monitor framework -->
<script type="application/x-shockwave-flash" src="lib/air/servicemonitor.swf"></script>


<script type="text/javascript">
function watch_connection() {
    // do ajax get
    $.ajax({
        type: "GET",datatype: "xml",url: "http://my_ip_address:port/Services/ConnectServiceHandler",success: function(response){
            $('#post_results').html(response);
        },error:function (xhr,ajaxOptions,thrownError){
            $('#post_results').html("readyState: "+xhr.readyState+"\nstatus: "+xhr.status);
        }
    });
    setTimeout(function(){watch_connection;},100);
}

function disconnect_service_handler() {

    // step 1. create xml document of data to send
    var xml_string = '<data><disconnect_handler service="64"/></data>';

    // step 2. post this to the registration service
    $.ajax({
        type: "POST",url:"http://my_ip_address:port/Services/DisconnectServiceHandler",data: xml_string,beforeSend: function(xhr){
               xhr.withCredentials = true;
        },timeout: (2 * 1000),success: function(response){

            // parse the response
            $(response).find("status").each(function() {
                // get the status code
                var disconnect_status = $(this).attr('code');

                if (disconnect_status == 200) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [200 Disconnected]');

                    // call connection using new guid
                    var my_guid = guid();
                    connect_service_handler(my_guid);
                }

                if (disconnect_status == 304) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [304 No handler found]');
                }


                if (disconnect_status == 400) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [400 Bad Request]');
                }

                if (disconnect_status == 401) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [401 Not Found]');
                }

                if (disconnect_status == 500) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [500 Internal Server Failure]');
                }

                if (disconnect_status == 501) {
                    // change status bar message
                    $('#dis_status').html('Disconnecting: [503 Service Unavailable]');
                }


            });


        },thrownError){
            $('#dis_status').html('Disconnecting: [Disconnect Failure]');
        }

    });
}
function S4() {
   return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
function guid() {
   return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
function connect_service_handler(my_guid) {

    // step 1. create xml document of data to send
    var xml_string = '<data><connect_handler service="64"><application id="'+my_guid+'" name="MikesBigEar" /></connect_handler></data>';

    // step 2. post this to the registration service
    $.ajax({
        type: "POST",url:"http://my_ip_address:port/Services/ConnectServiceHandler",success: function(response){

            // parse the response
            $(response).find("status").each(function() {

                // get the status code
                var connection_status = $(this).attr('code');

                if (connection_status == 200) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [200 Connected]');
                    // keep connection open keep socket alive
                    // sends http request to us via post
                    // sends the incoming request id and device address back to make sure it goes to the correct device
                    // ask for user id or user authentication
                    // for user authentication can either use built-in user authentication or ask a question
                    // http 1.1 keep alive header
                    $('#post_results').html('Attempting to check for next piece of data...');
                    watch_connection();
                }

                if (connection_status == 303) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [303 The handler is assigned to another application]');
                    var my_guid = guid();
                    connect_service_handler(my_guid);
                }

                if (connection_status == 400) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [400 Bad Request]');
                    disconnect_service_handler();
                }

                if (connection_status == 401) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [401 Not Found]');
                    disconnect_service_handler();
                }

                if (connection_status == 500) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [500 Internal Server Failure]');
                    disconnect_service_handler();
                }

                if (connection_status == 501) {
                    // change status bar message
                    $('#csh_status').html('Service Handler: [501 Service Unavailable]');
                    disconnect_service_handler();
                }


            });

            // pass the xml to the textarea
            // $('#process').val('ConnectServiceHandler');
            // $('#show_errors_here').val(response);

        },thrownError){
            $('#csh_status').html('Service Handler: [Connection Failure]');
            // alert("readyState: "+xhr.readyState+"\nstatus: "+xhr.status);
            // alert("responseText: "+xhr.responseText);
            // alert(xhr.status);
            // alert(thrownError);
        }

    });

    // set timed re-check and store it
    // setTimeout(function(){connect_service_handler(my_guid);},8000);


}

function get_device_count(my_guid) {
    // get the total number of devices

    // default receiver status
    var receiver_status = '';


    $('#device_count').html('Device Count: [Checking...]');
    $('#device_info').html('');

    // get the wireless receiver status via ajax xml
    $.ajax({
        type: "GET",url:"http://my_ip_address:port/Services/GetDevices",success: function(response){

            $(response).find("status").each(function() {
                // get the status code
                var receiver_status = $(this).attr('code');

                if (receiver_status == 200) {
                    // change status bar message
                    $('#device_count').html('Device Count: [200 Connected]');
                }

                if (receiver_status == 400) {
                    // change status bar message
                    $('#device_count').html('Device Count: [400 Bad Request]');
                }

                if (receiver_status == 401) {
                    // change status bar message
                    $('#device_count').html('Device Count: [401 Not Found]');
                }

                if (receiver_status == 500) {
                    // change status bar message
                    $('#device_count').html('Device Count: [500 Internal Server Failure]');
                }

                if (receiver_status == 501) {
                    // change status bar message
                    $('#device_count').html('Device Count: [501 Service Unavailable]');
                }


            });

            var device_count = 0;

            // add to div
            $('#device_info').append('<ul style="font-size:10px;">');

            $(response).find("device").each(function() {

                // get each property
                var device_status = $(this).attr('status');
                var short_address = $(this).attr('short_address');
                var mac_address = $(this).attr('mac_address');
                var pan_id = $(this).attr('pan_id');
                var type = $(this).attr('type');

                device_count = device_count + 1;

                // get session data
                $(this).find("session").each(function() {

                    // get session data
                    var created_date = $(this).attr('date');
                    var created_time = $(this).attr('time');

                });

                $('#device_info').append('<li style="list-style:none;">Device #'+device_count+'<ul>');

                // add list item
                $('#device_info').append('<li> Mac Address: ['+mac_address+']</li>');
                $('#device_info').append('<li> Short Address: ['+short_address+']</li>');
                $('#device_info').append('<li> Pan ID: ['+pan_id+']</li>');

                $('#device_info').append('</ul></li><br/>');

                // send request to this device
                // post_live_activity(mac_address,my_guid);



            });

            // end list
            $('#device_info').append('</ul>');

            if (device_count === 0) {
                $('#device_count').html('Device Count: [0 Devices Found]');
            } else if (device_count > 0) {
                $('#device_count').html('Device Count: [' + device_count + ' Devices Found]');
            }


        },thrownError){
            $('#device_count').html('Device Count: [Connection Failure]');
            // alert(xhr.status);
            // alert(thrownError);
        }
    });

    // set timed re-check and store it
    setTimeout(function(){get_device_count(my_guid);},13000);
}
function get_server_status(my_guid) {

    // default receiver status
    var receiver_status = '';

    // get the Renaissance Wireless Server via ajax xml
    $.ajax({
        type: "GET",url:"http://my_ip_address:port/Services/GetAccessPoints",success: function(response){

            $(response).find("status").each(function() {
                // get the status code
                var receiver_status = $(this).attr('code');

                if (receiver_status == 200) {

                    // change status bar message
                    $('#server_status').html('Renaissance Wireless Server: [200 Connected]');

                    // step 2. get device count
                    get_device_count(my_guid);

                    // step 3.part 1 get the guid to be used as the application id
                    // var my_guid = guid();

                    // step 3. part 2 connect to a service handler whatever that means
                    connect_service_handler(my_guid);

                }

                if (receiver_status == 400) {

                    // change status bar message
                    $('#server_status').html('Renaissance Wireless Server: [400 Bad Request]');

                    // set timed re-check and store it
                    setTimeout(function(){get_server_status(my_guid);},12300);

                }

                if (receiver_status == 401) {

                    // change status bar message
                    $('#server_status').html('Renaissance Wireless Server: [401 Not Found]');

                    // set timed re-check and store it
                    setTimeout(function(){get_server_status(my_guid);},12300);
                }

                if (receiver_status == 500) {

                    // change status bar message
                    $('#server_status').html('Renaissance Wireless Server: [500 Internal Server Failure]');

                    // set timed re-check and store it
                    setTimeout(function(){get_server_status(my_guid);},12300);

                }

                if (receiver_status == 501) {

                    // change status bar message
                    $('#server_status').html('Renaissance Wireless Server: [503 Service Unavailable]');

                    // set timed re-check and store it
                    setTimeout(function(){get_server_status(my_guid);},12300);

                }
                // pass the xml to the textarea
                // $('#process').val('GetAccessPoints');
                // $('#show_errors_here').val(response);

            });

        },thrownError){
            $('#server_status').html('Renaissance Wireless Server: [Connection Failure]');
            // alert(xhr.status);
            // alert(thrownError);
        }
    });

    // set timed re-check and store it
    // setTimeout(function(){get_server_status(my_guid);},12300);
}

$(document).ready(function() {

    // step 3.part 1 get the guid to be used as the application id
    var my_guid = guid();

    // step 1 validate
    get_server_status(my_guid);

    // step 2. get device count
    get_device_count();

    // step 3.part 1 get the guid to be used as the application id
    // var my_guid = guid();

    // step 3. part 2 connect to a service handler whatever that means
    // connect_service_handler(my_guid);


});
</script>
</body>
</html>

我的问题是,我应该使用不同的jquery插件,还是我接近这个错误？

谢谢…

解决方法

我不完全理解这个问题,所以提出建议有点棘手,但至少可以帮助解决一些不同的交通问题.

要求jQuery进行套接字通信是我所知道的jQuery范围之外的. jQuery实际上只是使用XMLHttpRequest,它不适用于持久套接字.

想法1

那么使用ActionScript Socket类呢
http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/Socket.html

你可以在你的html页面中嵌入flash电影并从javascript调用它
http://www.hariscusto.com/programming/communication-between-javascript-and-actionscript-as3-and-vice-versa/

想法2

您还可以考虑Web服务器上的node.js和大型socket.io模块,以利用空中的websockets,然后在air客户端和服务器之间进行双向通信.除服务器端支持外,socket.io还有一个很棒的浏览器客户端.见http://socket.io/

这是一篇关于联邦快递技术博客的一篇有趣的帖子,关于将jQuery与socket.io和node.js一起使用 – http://spiritconsulting.com.ar/fedex/2010/11/events-with-jquery-nodejs-and-socket-io/

创意3(新)

html air开发人员可以使用air javascript套接字类.我刚刚在这里偶然发现：

主页/ HTML开发人员指南,用于Adobe AIR /网络和通信

http://help.adobe.com/en_US/air/html/dev/WSb2ba3b1aad8a27b0-181c51321220efd9d1c-8000.html

根据您的需要,有几种不同的套接字apis

原文链接：https://www.f2er.com/jquery/177435.html

猜你在找的jQuery相关文章

《锋利的jQuery》笔记：插件的使用和写法
jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来，用于对通过选择器获取的...
jQuery插件开发入门
扩展jQuery插件和方法的作用是非常强大的，它可以节省大量开发时间。 入门 编写一个jQuery...
jquery.roundabout.js实现3D图片层叠旋转木马切换
最近项目中需要实现3D图片层叠旋转木马切换的效果，于是用到了jquery.roundabout.js。 兼容...
jQuery效果之jQuery实现图片的依次加载图片
css代码： js代码：
jQuery之deferred对象详解
一、什么是deferred对象？ 开发网站的过程中，我们经常遇到某些耗时很长的javascript操作。...
jQuery插件开发进阶
jQuery插件开发模式 软件开发过程中是需要一定的设计模式来指导开发的，有了模式，我们就能...
jQuery 实现邮箱输入自动提示功能：（一）
记得去年做某个项目的时候，用到了邮箱输入自动提示功能，于是网上搜了一下，发现了这个写...
jQuery插件之上传文件ajaxfileupload.js源码与使用
在网页应用中，一般会用到上传文件或者图片什么的到服务器，那么可以用ajaxfileupload.js，...
jQuery效果之封装一个文章图片弹出放大效果
首先先搭写一个基本的格式： 然后用自调用匿名函数包裹你的代码，将系统变量以变量形式传递...
《从零开始学习jQuery》：用jQuery操作元素的属性与样式
元素属性和Dom属性简介 对于下面这样一个标签元素: 我们通常将id,src,alt,class称为属性,也...
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsTypeScriptVueDojoJsonElectronNode.jsextjsExpress XMLES6AjaxFlashUnityReactFlexAnt DesignWeb前端微信小程序微信公众号
关闭广告单独headers封装代码提示错误整数正则非0开头跳页出页码antd table提示URL未注册公众号支付vue hash模式iSlider车牌键盘循环图片echarts 双折左右布局DllPlugin对象创建打字游戏圈选两栏云函数蒙版ES2020橱窗无缝滚动轮播色块碰撞组件销毁文档操作