使用wss://时,Websockets和https不会连接

i am creating a php web chat app for my site, it is built in php and js html, it works fine (with some minor annoyances and needing updates) when it is used over http (in secure connections) but when i use https it asked about loading unsafe scripts (the main js for the system) which i dont want, i have tried to change it to wss:// but now i dont get any connection now, there is two main parts to the site the page and the server, the page is as follows

<style type="text/css">
<!--
.chat_wrapper {
    width: 100%;
        height: 100%;
    margin-right: auto;
    margin-left: auto;
    background: #CCCCCC;
    border: 1px solid #999999;
    padding: 10px;
    font: 12px 'lucida grande',tahoma,verdana,arial,sans-serif;
}
.chat_wrapper .message_box {
    background: #FFFFFF;
    height: 380px;
    overflow: scroll;
    padding: 10px;
    border: 1px solid #999999;
}
.chat_wrapper .panel input{
    padding: 2px 2px 2px 5px;
}
.system_msg{color: #BDBDBD;font-style: italic;}
.user_name{font-weight:bold;}
.user_message{color: #88B6E0;}
-->
</style>
<?php 
$colours = array('007AFF','FF7000','FF7000','15E25F','CFC700','CFC700','CF1100','CF00BE','F00');
$user_colour = array_rand($colours);
?>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

<script language="javascript" type="text/javascript">  
$(document).ready(function(){
    $("#message").keyup(function(event){
    if(event.keyCode == 13){
        $("#send-btn").click();
    }
});

    //create a new WebSocket object.
    var wsUri = "ws://radiobeacononline.com:9000/server.php";   
    websocket = new WebSocket(wsUri); 

    websocket.onopen = function(ev) { // connection is open 
            var myname = $('#name').val(); //get user name
            var mypic = $('#pic').val();
            var msg = {
        message: 'has just joined the chat',
        name: myname,
                pic : mypic,
        color : '<?php echo $colours[$user_colour]; ?>'
        };
        //convert and send data to server
        websocket.send(JSON.stringify(msg));
        $('#message_box').append("<div class=\"system_msg\">Connected!</div>"); //notify user
    }

    $('#send-btn').click(function(){ //use clicks message send button
        var mymessage = $('#message').val(); //get message text
        var myname = $('#name').val(); //get user name
        if(mymessage == ""){ //emtpy message?
            alert("Enter Some message Please!");
            return;
        }
        var mypic = $('#pic').val();
        //prepare json data
        var msg = {
                //type : 'mesage',
        message: mymessage,
        name: myname,
                pic : mypic,
        color : '<?php echo $colours[$user_colour]; ?>'
        };
        //convert and send data to server
        websocket.send(JSON.stringify(msg));
    });

    //#### Message received from server?
    websocket.onmessage = function(ev) {
        var msg = JSON.parse(ev.data); //PHP sends Json data
        var type = msg.type; //message type
        var umsg = msg.message; //message text
        var uname = msg.name; //user name
                var upic = msg.pic // user pic
        var ucolor = msg.color; //color

        if(type == 'usermsg') 
        {
            $('#message_box').append("<div><span class=\"user_name\" style=\"color:#"+ucolor+"\"><img src=\"app/engine/storage/users/"+uname+"/profile/"+upic+"\" width=\"23\" height=\"23\">"+uname+"</span> : <span class=\"user_message\">"+umsg+"</span></div>");
        }
        if(type == 'system')
        {
            $('#message_box').append("<div class=\"system_msg\">"+umsg+"</div>");
        }

        $('#message').val(''); //reset text
    };
    window.setInterval(function() {
  var elem = document.getElementById('message_box');
  elem.scrollTop = elem.scrollHeight;
}, 500);
    websocket.onerror   = function(ev){$('#message_box').append("<div class=\"system_error\">Error Occurred - "+ev.data+"</div>");}; 
    websocket.onclose   = function(ev){$('#message_box').append("<div class=\"system_msg\">Connection Closed</div>");}; 
});
</script>
<div class="chat_wrapper">
<div class="message_box" id="message_box"></div>
<div class="panel">
    <input type="text" name="name"  hidden="" id="name" value="<?=  fSession::get('user_name')?>" maxlength="10" style="width:20%"  />
    <input type="text" name="pic"  hidden="" id="pic" value="<?=  fSession::get('user_photo')?>" maxlength="10" style="width:20%"  />
    <div class="input-group">
        <span class="input-group-addon" id="basic-addon3"><?=  fSession::get('user_name')?></span>
                <input type="text" class="form-control" id="message" aria-describedby="basic-addon3" placeholder="Message" maxlength="80">
            </div>
<button class="btn btn-default form-inline" id="send-btn">Send</button>
</div>
</div>

and the server is as follows

    <?php
$host = 'radiobeacononline.com'; //host
$port = '9000'; //port
$null = NULL; //null var

//Create TCP/IP sream socket
$socket = socket_create(AF_INET, SOCK_STREAM, SOL_TCP);
//reuseable port
socket_set_option($socket, SOL_SOCKET, SO_REUSEADDR, 1);

//bind socket to specified host
socket_bind($socket, 0, $port);

//listen to port
socket_listen($socket);

//create & add listning socket to the list
$clients = array($socket);

//start endless loop, so that our script doesn't stop
while (true) {
    //manage multipal connections
    $changed = $clients;
    //returns the socket resources in $changed array
    socket_select($changed, $null, $null, 0, 10);

    //check for new socket
    if (in_array($socket, $changed)) {
        $socket_new = socket_accept($socket); //accpet new socket
        $clients[] = $socket_new; //add socket to client array

        $header = socket_read($socket_new, 1024); //read data sent by the socket
        perform_handshaking($header, $socket_new, $host, $port); //perform websocket handshake

        socket_getpeername($socket_new, $ip); //get ip address of connected socket
        //$response = mask(json_encode(array('type'=>'system', 'message'=>'A user has joined connected'))); //prepare json data
        //send_message($response); //notify all users about new connection
        $time = time();
        $file = fopen('app/engine/storage/writeable/logs/chat.log','a+');
        fwrite($file,"system: $ip connected $time 
");
        fclose($file);
        //make room for new socket
        $found_socket = array_search($socket, $changed);
        unset($changed[$found_socket]);
    }

    //loop through all connected sockets
    foreach ($changed as $changed_socket) { 

        //check for any incomming data
        while(socket_recv($changed_socket, $buf, 1024, 0) >= 1)
        {
            $received_text = unmask($buf); //unmask data
            $tst_msg = json_decode($received_text); //json decode 
                        // if($tst_msg->type == message)
                        // {
                        //  what it says below
                        // elseif($tst_msg->type == system)
                        // {
                        // do a system update this will be if the user is online or not.
                        // this will need a lot fo work on it to make sure that they are.
                        // }
                        // elseif($tst_msg->type == users)
                        // {
                        // update user list.
                        // }
                        // elseif($tst_msg->type == ping)
                        // {
                        // do ping stuff.
                        // }
                        // elseif($tst_msg->type == pong)
                        // {
                        // do pong stuff
                        // }

            $user_name = $tst_msg->name; //sender name
            $user_message = $tst_msg->message; //message text
            $user_color = $tst_msg->color; //color
                        $user_pic = $tst_msg->pic; //color
            $time = time();
            //prepare data to be sent to client
            $response_text = mask(json_encode(array('type'=>'usermsg', 'name'=>$user_name, 'message'=>$user_message, 'color'=>$user_color, 'pic'=>$user_pic)));
            send_message($response_text); //send data
            $file = fopen('app/engine/storage/writeable/logs/chat.log','a+');
            fwrite($file,"usermsg $user_name : $user_message $time 
");
            fclose($file);
            break 2; //exist this loop
        }

        $buf = @socket_read($changed_socket, 1024, PHP_NORMAL_READ);
        if ($buf === false) { // check disconnected client
            // remove client for $clients array
            $found_socket = array_search($changed_socket, $clients);
            socket_getpeername($changed_socket, $ip);
            unset($clients[$found_socket]);
            $time = time();
            //notify all users about disconnected connection
            $response = mask(json_encode(array('type'=>'system', 'message'=>$ip.' disconnected')));
            send_message($response);
            $file = fopen('app/engine/storage/writeable/logs/chat.log','a+');
            fwrite($file,"system $ip disconected $time 
");
            fclose($file);
        }
    }
}
// close the listening socket
socket_close($socket);

function send_message($msg)
{
    global $clients;
    foreach($clients as $changed_socket)
    {
        @socket_write($changed_socket,$msg,strlen($msg));
    }
    return true;
}


//Unmask incoming framed message
function unmask($text) {
    $length = ord($text[1]) & 127;
    if($length == 126) {
        $masks = substr($text, 4, 4);
        $data = substr($text, 8);
    }
    elseif($length == 127) {
        $masks = substr($text, 10, 4);
        $data = substr($text, 14);
    }
    else {
        $masks = substr($text, 2, 4);
        $data = substr($text, 6);
    }
    $text = "";
    for ($i = 0; $i < strlen($data); ++$i) {
        $text .= $data[$i] ^ $masks[$i%4];
    }
    return $text;
}

//Encode message for transfer to client.
function mask($text)
{
    $b1 = 0x80 | (0x1 & 0x0f);
    $length = strlen($text);

    if($length <= 125)
        $header = pack('CC', $b1, $length);
    elseif($length > 125 && $length < 65536)
        $header = pack('CCn', $b1, 126, $length);
    elseif($length >= 65536)
        $header = pack('CCNN', $b1, 127, $length);
    return $header.$text;
}

//handshake new client.
function perform_handshaking($receved_header,$client_conn, $host, $port)
{
    $headers = array();
    $lines = preg_split("/
/", $receved_header);
    foreach($lines as $line)
    {
        $line = chop($line);
        if(preg_match('/\A(\S+): (.*)\z/', $line, $matches))
        {
            $headers[$matches[1]] = $matches[2];
        }
    }

    $secKey = $headers['Sec-WebSocket-Key'];
    $secAccept = base64_encode(pack('H*', sha1($secKey . '258EAFA5-E914-47DA-95CA-C5AB0DC85B11')));
    //hand shaking header
    $upgrade  = "HTTP/1.1 101 Web Socket Protocol Handshake
" .
    "Upgrade: websocket
" .
    "Connection: Upgrade
" .
    "WebSocket-Origin: $host
" .
    "WebSocket-Location: wss://$host:$port/demo/shout.php
".
    "Sec-WebSocket-Accept:$secAccept

";
    socket_write($client_conn,$upgrade,strlen($upgrade));
}

this works fine in http but does not work in https is there anybody out there that can help with this and make it work on a https system with out having to click something that will allow it after saying unsafe on it?

dongyan3853
dongyan3853 devdungeon.com/content/how-use-ssl-sockets-php
接近 4 年之前 回复

1个回答



显然,它永远不会通过SSL工作,因为您的代码不支持SSL。 你只是打开一个原始套接字并通过一个不安全的套接字发送/接收。 SSL在套接字层之上作为安全层发生,因此名称为 SSL </ em>。 您无法从通过安全连接加载的页面降级到通过不安全连接加载资源。 浏览器根本不允许这样做会破坏使用安全连接的目的。</ p>

简单的解决方法是在您的支持SSL的websocket服务器的前面放置一个反向代理并拥有 SSL终止发生在代理级别。 HAProxy 就是一个可以支持websockets的反向代理。</ p>

更多 复杂的修复,这里太广泛了,不能详细解释,实际上是在你的应用程序级别(即在PHP中)进行SSL终止。 这部分需要你进行大量的研究和努力,如果你刚开始学习这些东西,我真的不会建议。</ p>
</ div>

展开原文

原文

Obviously that would never work over SSL, because your code doesn't support SSL. You're just opening a raw socket and sending/receiving over an unsecured socket. SSL takes place as a layer of security, on top of the socket layer, hence the name SSL. You can't downgrade from a page loaded over a secured connection to loading resources over an insecure connection. The browser simply won't allow that is it defeats the purposes of using a secure connection.

The simple fix is to place a reverse proxy infront of your websocket server that supports SSL and have the SSL termination happen at the proxy level. HAProxy is one such reverse proxy that can support websockets.

The more complicated fix, which is far too broad to explain in detail here, is to actually do the SSL termination at your application level (i.e. in PHP). This part would require a tremendous amount of research and effort on your part and I really wouldn't suggest it if you're just starting out learning about these things.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问