微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

HTML概念:webSocket兼容低浏览器

使低版本浏览器支持 websocket 需要用到 ,它使用 flash 来代替 HTML5 的 websocket 功能,web-socket-js 需要在前端加载 swfobject.js 和 web_socket.js 还有 WebSocketMain.swf,同时后台也需要做写一定的代码,不过庆幸的是,已经有了比较成熟的解决方案了—— .

workerman 是一个PHP 开发的开源高性能的 socket 服务器框架 . 它也是用 web-socket-js 来解决低版本浏览器的 websocket 问题的,当然也可以使用 github 中提到的 web-socket-ruby .

使用 workerman 搭建好 websocket 服务器之后 ( 具体怎么搭建请移步workerman官网 ),在前端引用上述所说的几个文件 :

<script type="text/javascript">

// WebSocketMain.swf

WEB_SOCKET_SWF_LOCATION = "WebSocketMain.swf";

// 接下来就可以正常使用 websocket 了

var ws = new WebSocket("ws://example.com:10081/");

ws.o<a href="https://www.jb51.cc/tag/nop/" target="_blank" class="keywords">nop</a>en = function() {

    ws.send("Hello"); // Sends a message.

};

ws.onmessage = function(e) {

// Receives a message.

    alert(e.data);

};

ws.onclose = function() {

    alert("closed");

};

需要注意的是,在实际投入使用的时候,我发现部分安卓的自带浏览器还是不能正常使用,那是因为那一部分的安卓浏览器的 window 对象中虽然有 MessageEvent 属性,但是它并不能正常使用 .

解决方法

请打开 web_socket.js,在205行左右找到 :

WebSocket.prototype.__createMessageEvent = function(type,data) {
if (window.MessageEvent &amp; amp; &amp; amp; typeof(MessageEvent) == "function" &amp; amp; &amp; amp; !window.opera) {

    return new MessageEvent("message",{

        "view": window,"bubbles": false,"cancelable": false,"data": data

    });

} else if (document.createEvent &amp; amp; &amp; amp; window.MessageEvent &amp; amp; &amp; amp; !window.opera) {

    var event = document.createEvent("MessageEvent");

    event.initMessageEvent("message",false,data,null,window,null);

    return event;

} else {

    // Old IE and Opera,the latter one t<a href="https://www.jb51.cc/tag/runc/" target="_blank" class="keywords">runc</a>ates the data p<a href="https://www.jb51.cc/tag/ara/" target="_blank" class="keywords">ara</a>meter after any 0x00 bytes.

    return {

        type: type,data: data,bubbles: false,cancelable: false

    };

}

};

并将其修改为 :

WebSocket.prototype.__createMessageEvent = function(type,data) {
if (window.MessageEvent &amp; amp; &amp; amp; typeof(MessageEvent) == "function" &amp; amp; &amp; amp; !window.opera) {

    try {

        return new MessageEvent("message",{

            "view": window,"data": data

        });

    } catch (e) {

        //android上虽然有MessagesEvent但是并不管用,会<a href="https://www.jb51.cc/tag/tishi/" target="_blank" class="keywords">提示</a>ille<a href="https://www.jb51.cc/tag/gal/" target="_blank" class="keywords">gal</a> constructor<a href="https://www.jb51.cc/tag/cuowu/" target="_blank" class="keywords">错误</a>

        var event = document.createEvent("MessageEvent");

        event.initMessageEvent("message",null);

        return event;

    }

} else if (document.createEvent &amp; amp; &amp; amp; window.MessageEvent &amp; amp; &amp; amp; !window.opera) {

    var event = document.createEvent("MessageEvent");

    event.initMessageEvent("message",cancelable: false

    };

}

};

以上便是我所遇到的低版本浏览器websocket问题的解决方案 .

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐