Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WebSocket connection to 'ws://localhost:9000/share-dev/peerjs?key=peerjs* failed and chrome browser show the status "Provisional headers are shown" #260

Open
herico516 opened this issue Sep 7, 2021 · 1 comment
Labels

Comments

@herico516
Copy link

I use the peerjs to develop webRTC app, and ocurred thr error:

Env:

"express": "~4.16.1",
"peer": "^0.6.1",
"peerjs": "^1.3.2",

Code

I use the component 'express-generate' to create the express app, the decleare and config of the peerServer write in "app.js".
and I try write the PeerServer code in "bin/www" ,use http server to bind the peerSeever ,then access all url after report the 404 error.

Server side:

`
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

const { ExpressPeerServer } = require('peer');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

const cors = require('cors');

var app = express();

var options ={
debug:true,
allow_discovery:true,
proxied:true
}
const peerserver = ExpressPeerServer(app, options);

app.use('/share-dev', peerserver);

app.use(cors());
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

//app.use('/', indexRouter);
app.use('/users', usersRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};

// render the error page
res.status(err.status || 500);
res.render('error');
});

module.exports = app;

`

Client side:

`
var recevieid =null;
var rooms ={};
var historymsg = document.getElementById("historymsg");

       var peer = new Peer({
        host:"192.168.13.80",
        port:9000,
        path:"/share-dev",
        proxied:true,
        secure: false
       });

       peer.on('open', function(id) {
            console.log('My peer ID is: ' + id);
            recevieid =id;
            document.getElementById("recevieid").innerHTML=recevieid ;
            document.getElementById("status").innerHTML="Awaiting connection..." ;

            rooms[recevieid] = new Array();
            
        });

       peer.on("connection",function(connection){
            
             historymsg.innerHTML +=(connection.peer+" joined .</br>");

             var peerid = connection.peer;
             rooms[recevieid].push({"id":peerid,"conn":connection});

             connection.on("data",function(data){
                      console.log('Received', data);
                      historymsg.innerHTML +=(connection.peer+":"+data+"</br>");

                      var arr = rooms[recevieid];
                      arr.forEach(element => {
                              element["conn"].send(data);
                      });
             });

       });

      document.getElementById("send_btn").addEventListener("click",function(){
            var content = document.getElementById("sendContent").value;
             console.log(content);
             historymsg.innerHTML += (recevieid+":"+content+"</br>");
            
             var arr = rooms[recevieid];
             arr.forEach(element => {
                 element["conn"].send(content);
             });
            
      });

`

Error:

when i start the app , and accsss the client in the chrome browser,

access the http://192.168.13.80:9000/share-dev/ success.

est URL: http://192.168.13.80:9000/share-dev/ Request Method: GET Status Code: 304 Not Modified Remote Address: 192.168.13.80:9000 Referrer Policy: strict-origin-when-cross-origin Access-Control-Allow-Origin: * Content-Length: 140 Content-Type: application/json; charset=utf-8 Date: Tue, 07 Sep 2021 05:51:33 GMT ETag: W/"8c-OP0zOSq0rX5Ungn973BP6obbpvw" X-Powered-By: Express Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9 Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9 Cache-Control: max-age=0 Connection: keep-alive Host: 192.168.13.80:9000 If-None-Match: W/"8c-OP0zOSq0rX5Ungn973BP6obbpvw" Upgrade-Insecure-Requests: 1 User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36
response:
{"name":"PeerJS Server","description":"A server side element to broker connections between PeerJS clients.","website":"https://peerjs.com/"}

use the get method can get the client id

Request URL: http://192.168.13.80:9000/share-dev/peerjs/id?ts=16309932372330.8075165627358261 Request Method: GET Status Code: 200 OK Remote Address: 192.168.13.80:9000 Referrer Policy: strict-origin-when-cross-origin Access-Control-Allow-Origin: * Connection: keep-alive Content-Length: 36 Content-Type: text/html; charset=utf-8 Date: Tue, 07 Sep 2021 05:40:37 GMT ETag: W/"24-6/1FFsdXbmd2hV3TAFLuLUCRSOw" X-Powered-By: Express
response:
ea317c8a-43bf-45cd-91f0-06dc28ce2477

but when socket connect to ws://192.168.13.80:9000/share-dev/peerjs?key=peerjs&id=ea317c8a-43bf-45cd-91f0-06dc28ce2477&token=6yz8jecrfy , the error ocurred:

?key=peerjs&id=ea317c8a-43bf-45cd-91f0-06dc28ce2477&token=6yz8jecrfy **Provisional headers are shown** Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9 Cache-Control: no-cache Connection: Upgrade Host: 192.168.13.80:9000 Origin: http://192.168.13.80:8820 Pragma: no-cache Sec-WebSocket-Extensions: permessage-deflate; client_max_window_bits Sec-WebSocket-Key: yPygewljwlLoAvCzEgpQ1A== Sec-WebSocket-Version: 13 Upgrade: websocket User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36 key: peerjs id: ea317c8a-43bf-45cd-91f0-06dc28ce2477 token: 6yz8je
'
WebSocket connection to 'ws://192.168.13.80:9000/share-dev/peerjs?key=peerjs&id=ea317c8a-43bf-45cd-91f0-06dc28ce2477&token=6yz8jecrfy' failed:
Socket.start @ peerjs.js:7534
Peer._initialize @ peerjs.js:9833
(anonymous) @ peerjs.js:9713

'

@herico516
Copy link
Author

When I don't use the component "express-generate" to create an app, use the server side code below , everything is ok..
`
const express = require('express');
const { ExpressPeerServer } = require('peer');
const app = express();
app.get('/', (req, res, next) => res.send('welcome to the share development online!'));

const server = app.listen(9000);
const peerServer = ExpressPeerServer(server, {
debug:true,
allow_discovery:true,
proxied: true
});
app.use('/share-dev', peerServer);
`

so , Is there any conflict !!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants