1

So i am using the tutorial here to setup my socket.io connection using Angular 5.x

https://blog.codewithdan.com/2017/11/07/pushing-real-time-data-to-an-angular-service-using-web-sockets/

There are two scenarios happening and im not sure why one is working and one isnt, so im hoping someone can assist.

Failing Scenario

1) Launch my WS Server using Boost::Beast CPP library on server IP 10.1.1.1, using the chrome plugin "Simple WebSocket Client" i connect to my server IP address, it connects through the HTTP handler of Beast, see's it as a Websocket upgrade request, and spawns my websocket session and works and connects as expected. I am modifying my HTTP request to set ALLOW-ACCESS-CONTROL-ORIGIN and other flags to deal with CORS issues blocking my Angular client currently i just have it forced to allow http://localhost:4200, although i planned on changing that to just echo back the IP of the client, unsure if that is part of the problem im having honestly.

In case it matters here are the request items im adding

res.insert(boost::beast::http::field::access_control_allow_origin, "http://localhost:4200");
res.insert(boost::beast::http::field::access_control_allow_methods, "GET, POST, OPTIONS, PUT, PATCH, DELETE");
res.insert(boost::beast::http::field::access_control_allow_headers, "X-Requested-With,content-type");
res.insert(boost::beast::http::field::access_control_allow_headers, "X-Requested-With,content-type");

Here are the response/request/general for the failing case

https://i.stack.imgur.com/ZqHKr.jpg

Working scenario

1) Launch my WS Server using Boost::Beast CPP library on server. Using Socket.Io for Angular5. Its basically a blank angular-cli project and in the app component i do 

this.socket = socketIo('10.1.1.1:8087').

Although i have also tried the following after looking at some other issues people have had trying to force SocketIO to just go straight into websocket mode and not do other http transactions.

this.socket = socketIo({transports: ['websocket'], upgrade: false}, '10.1.1.1:8087');

What results is not the same as the working case, the request seems to be the same, but it never triggers my websocket upgrade request code in Beast, and the connection is never made as far as i can tell.

Here is the request/response/general for the failing case https://i.stack.imgur.com/4j0sL.jpg

Again i feel like it has something to do with the fact that the Chrome plugin is connecting directly to the IP address of the server, where when i am connecting through my angular project its sending Localhost:4200 as the origin, not the client machines actual IP address?

Any help would be greatly appreciated.

user1024792
  • 553
  • 1
  • 10
  • 23

1 Answers1

0

In both cases it looks like Beast is sending back a successful status code (101 Switching Protocols). But in the failing case, the Origin claimed by the client does not match the list of allowed origins in the response field "Access-Control-Allow-Origin." Could this be the problem? Also, you have two entries for "Access-Control-Allow-Headers" with the same value, is this intended?

Vinnie Falco
  • 5,173
  • 28
  • 43
  • but I'm watching every http request that comes in and none go into the websocket:isupgraderequest or whatever that check is. Without that there is no websocket created, so I don't see how it could have accepted the connection. What requirements are there for the check if it's a upgrade request? – user1024792 Apr 28 '18 at 18:04
  • Which server example are you using? Your question lacks sufficient information. – Vinnie Falco Apr 28 '18 at 18:20
  • Its a mix match unfortunately. Its the Async example, with the http_session class from the advanced async example. Listener passes off to http_session, which if its a websocket upgrade goes to the session class. Honestly i think this is some issue with Angular/CORS or SocketIO, i can take any other websocket client like websocket.org and connect without any issues. My websocket connection via SocketIO i noticed in the network monitor seems to be pending for a long time(15+ seconds) and timing out. Why i have no idea, its pretty straight forward to open a socket with it. – user1024792 Apr 28 '18 at 19:49