I am new to rxjs and I want to connect a simple websocket (In my case I want make the connection with socket.io. I don't know if this is possible or not.)
I have my rxjs component here:
export function SmartHome(sources, tabSelectedSubject$) {
const socket = new IO();
socket.connect('ws://localhost:8180/devices/latest-updates');
const vdom$ = view(
model(
intent(sources.DOM, sources)
)
)
const sinks = {
DOM: vdom$,
}
return sinks
}
And I have my Spring Boot server with the following class:
public class UserHandshakeInterceptor extends HttpSessionHandshakeInterceptor {
private static final String URI_Template = "/devices/latest-updates";
#Override
public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response,
WebSocketHandler wsHandler, Map <String, Object> attributes) throws Exception {
return super.beforeHandshake(request, response, wsHandler, attributes);
}
}
How can I make the connection to the server, because it gave me a cross-origin exception?
Related
I've been working on a project with my team for about a week and we still haven't been able to get websockets to work. We're running the whole server on our own machines for testing purposes and we're unsure if it'll be hosted on an HTTPS server in the future.
Using springboot we've been able to make all the basic web-site stuff work like login/registration and more, but websockets don't seem to work.....
Here's the code that we use:
package com.kanbanboard.websocket;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.HashMap;
import java.util.Set;
import java.util.concurrent.CopyOnWriteArraySet;
#ServerEndpoint(
value="/events/{boardid}",
decoders = MessageDecoder.class,
encoders = MessageEncoder.class
)
public class WebSocketServer{
private Session session;
private static final Set<WebSocketServer> socketEndpoint = new CopyOnWriteArraySet<>();
private static final HashMap<String, String> users = new HashMap<>();
#OnOpen
public void onOpen(Session session, #PathParam("boardid") String boardid) throws IOException, EncodeException {
this.session = session;
socketEndpoint.add(this);
users.put(session.getId(), boardid);
Message msg = new Message();
msg.setFrom(boardid);
msg.setContent("Connected!");
broadcast(msg);
}
#OnMessage
public void onMessage(Session session, String message) throws IOException, EncodeException {
Message msg = new Message();
msg.setFrom(users.get(session.getId()));
broadcast(msg);
System.out.println("["+session.getId()+"]: "+message);
}
#OnClose
public void onClose(Session session) throws IOException, EncodeException {
socketEndpoint.remove(this);
Message message = new Message();
message.setFrom(users.get(session.getId()));
message.setContent("Disconnected!");
broadcast(message);
System.out.println("Connection has been with: "+session.getId());
}
#OnError
public void onError(Session session, Throwable throwable) {
System.out.println("Error reached!!!");
System.out.println(throwable);
}
private static void broadcast(Message message)
throws IOException, EncodeException {
socketEndpoint.forEach(endpoint -> {
synchronized (endpoint) {
try {
endpoint.session.getBasicRemote().
sendObject(message);
} catch (IOException | EncodeException e) {
e.printStackTrace();
}
}
});
}
}
The javascript we use on the client side to test the connection:
let ws = new WebSocket("ws://localhost:8080/events/1")
ws.onopen = function(ev) {
console.log("Opened connection")
ws.send("Hello World")
}
What the javascript code returns:
GETws://localhost:8080/events/1
[HTTP/1.1 404 7ms]
Firefox can’t establish a connection to the server at ws://localhost:8080/events/1. debugger eval code:1:9
Yes we've tried it on chrome too...
The thing is, when we use wss:// instead of ws:// we do get an output on intelliJ which looks like this:
java.lang.IllegalArgumentException: Invalid character found in method name [0x160x030x010x020x000x010x000x010xfc0x030x030xce0xea0x97_h0xd30xbe0xe90x080xea#0xf10xben0xdb0xf30x8cc0xd80xe30x890xfaD0xe80x1c0xb80xe80xbf0xa50x8c0xb90xc1 ]. HTTP method names must be tokens
at org.apache.coyote.http11.Http11InputBuffer.parseRequestLine(Http11InputBuffer.java:419) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.coyote.http11.Http11Processor.service(Http11Processor.java:271) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.coyote.AbstractProcessorLight.process(AbstractProcessorLight.java:65) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:890) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1743) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:49) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.tomcat.util.threads.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1191) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.tomcat.util.threads.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:659) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61) ~[tomcat-embed-core-9.0.63.jar:9.0.63]
at java.base/java.lang.Thread.run(Thread.java:833) ~[na:na]
Any help or recommendations greatly appreciated.
Found the solution, you're not getting it.
(Just don't use Websockets and sprinboot together, it's not worth it.)
I am trying to implement a spring boot chat application using WebSocket stomp client. If I send messages from one device to 4,5 devices then some are getting the messages and some are not. Some can send messages but don't receive any message and some are working completely fine. My application is running on wildfly server and the URL is over https.
Here is my js file. From my JSP page I am calling sendMsg with all parameter and through render method I am attaching the response with JSP using Handlebars.
if (!window.location.origin) {
window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');
}
const url = window.location.origin+contextPath;
let stompClient;
let selectedUser;
let newMessages = new Map();
function connectToChat(userName, topicName) {
console.log("connecting to chat...")
let socket = new SockJS(url + '/chat');
stompClient = Stomp.over(socket);
stompClient.connect({}, function (frame) {
console.log("connected to: " + frame);
stompClient.subscribe("/topic/decision-log", function (response) {
let data = JSON.parse(response.body);
var msg = data.message;
var fromlogin = data.message;
render(data.username, msg, fromlogin);
});
});
}
connectToChat("1", "decision-log");
function sendMsg(from, text, username) {
stompClient.send("/app/chat/" + from, {}, JSON.stringify({
fromLogin: from,
message: text,
topicName: topicName,
username: username
}));
}
function render(username, message, projectId) {
var templateResponse = Handlebars.compile($("#message-response-template").html());
var contextResponse = {
username: username,
response: message,
date: date,
projectId: projectId
};
setTimeout(function () {
$chatHistoryList.append(templateResponse(contextResponse));
scrollToBottom();
}.bind(this), 1500);
}
Here is my WebSocket configuration file:
#Configuration
#EnableWebSocketMessageBroker
public class WebsocketConfiguration implements WebSocketMessageBrokerConfigurer{
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/chat").setAllowedOrigins("*").withSockJS();
}
#Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
registry.setApplicationDestinationPrefixes("/app").enableSimpleBroker("/topic");
}
}
This is the controller. I always save all messages on the database that are coming through WebSocket that's why I can be sure that all devices can send messages as they have been saved on the database.
#Controller
#AllArgsConstructor
public class MessageController {
#Autowired
private SimpMessagingTemplate simpMessagingTemplate;
private final DecisionLogService decisionLogService;
#MessageMapping("/chat/{to}")
public void sendMessage(#DestinationVariable String to, MessageModel message, Authentication authentication ) {
simpMessagingTemplate.convertAndSend("/topic/decision-log", message);
AuthResponse userDetails = (AuthResponse) authentication.getDetails();
DecisionLogCreateRequest decisionLogCreateRequest = new DecisionLogCreateRequest();
decisionLogCreateRequest.setDecision(message.getMessage());
decisionLogCreateRequest.setProjectId(to);
ServiceResponseExtended<Boolean> response = decisionLogService.addDecisionLog(userDetails.getAccessToken(), decisionLogCreateRequest);
}
}
I can not find anything similar this issue. Please help me with right information and suggestion, and if anyone faced same kind of problem please share with me.
The problem was solved after configuring RabbitMQ Stomp Broker as a message broker instead of SimpleBroker.
Current WebSocket configuration:
#Configuration
#EnableWebSocketMessageBroker
public class WebsocketConfiguration implements WebSocketMessageBrokerConfigurer{
#Value("${stomp-broker-relay-host}")
private String RELAY_HOST;
#Value("${stomp-broker-relay-port}")
private String RELAY_PORT;
#Value("${stomp-broker-login-user}")
private String USER;
#Value("${stomp-broker-login-pass}")
private String PASS;
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/chat").setAllowedOrigins("*").withSockJS();
}
#Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
registry.setApplicationDestinationPrefixes("/app");
registry.enableStompBrokerRelay("/topic").setRelayHost(RELAY_HOST).setRelayPort(Integer.parseInt(RELAY_PORT)).setClientLogin(USER)
.setClientPasscode(PASS);
}
}
Reference:
https://medium.com/#rameez.s.shaikh/build-a-chat-application-using-spring-boot-websocket-rabbitmq-2b82c142f85a
https://www.javainuse.com/misc/rabbitmq-hello-world
I have a backend java code for websocket.
SessionEndpoint:
#ServerEndpoint("/session")
public class SessionEndpoint {
private static Set<SessionEndpoint> sessionEndpoints = new CopyOnWriteArraySet<>();
#OnMessage
public void onMessage(Session session, String sessionId) {
Map<String, Object> attributes = new HashMap<>();
attributes.put("sessionId", sessionId);
sessionEndpoints.forEach(endpoint -> {
synchronized (endpoint) {
try {
session.getBasicRemote().sendObject(attributes);
} catch (IOException | EncodeException e) {
e.printStackTrace();
}
}
});
}
}
Trying to connect to websocket from javascript, code is given below.
let webSocket = new WebSocket('ws://localhost:9999/session');
webSocket.onopen = () => webSocket.send('hello');
webSocket.onmessage = function(response) {
console.log(response);
};
I get 404 response code while connecting to websocket. How should I connect to webscoket from javascript ?
I'm not able to connect to my SignalR Hub in a ASP.NET Core 2.0.3 application running under Windows 7.
I'm using SignalR 1.0.0-alpha1-final from NuGet as server and the signalr-client-1.0.0-alpha2-final.min.js as JavaScript client.
Here is my hub:
using System;
using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;
namespace MyProject
{
public class MyHub: Hub
{
public override async Task OnConnectedAsync()
{
await Clients.All.InvokeAsync("Send", $"{Context.ConnectionId} joined");
}
public Task Send(string message)
{
return Clients.All.InvokeAsync("Send", $"{Context.ConnectionId}: {message}");
}
}
}
Configure in startup.cs:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
app.UseBrowserLink();
}
else
{
app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();
app.UseHangfireDashboard();
app.UseHangfireServer();
app.UseSignalR(routes =>
{
routes.MapHub<MyHub>("hubs");
});
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller}/{action=Index}/{id?}");
});
}
and in a test page:
let transportType = signalR.TransportType[getParameterByName('transport')] || signalR.TransportType.WebSockets;
let http = new signalR.HttpConnection(`http://${document.location.host}/hubs`, { transport: transportType });
var connection = new signalR.HubConnection(http);
but when this code executes I get an error 204 from the server.
UPDATE
Based upon the answer of #Gabriel Luci, here the working code:
let transportType = signalR.TransportType.LongPolling;
let http = new signalR.HttpConnection(`http://${document.location.host}/hubs`, { transport: transportType });
let connection = new signalR.HubConnection(http);
connection.start();
connection.on('Send', (message) => {
console.log(message);
});
...
connection.invoke('Echo', "Hello ");
There was an issue raised in GitHub for that: https://github.com/aspnet/SignalR/issues/1028
Apparently WebSockets doesn't work in IIS and IIS Express. You need to use long-polling. There's a snippet of sample code in that issue:
let connection = new HubConnection("someurl", { transport: signalR.TransportType.LongPolling });
connection.start().then(() => {});
In my case i have to remove allow any origin and replace it with WithOrigins and AllowCredentials
options.AddPolicy("policy",
builder =>
{
builder.WithOrigins("http://localhost:8081");
builder.AllowAnyMethod();
builder.AllowAnyHeader();
builder.AllowCredentials();
});
I have a function in an Android app which sends a POST request to an HTTP triggered Cloud Function. Whenever I click the button once to send the message, Firebase registers the event twice on the Firebase console. My application is built in such a way that the button to send a message disappears after the first click, so I'm not accidentally double clicking the button, and when I step through the debugger, the function to send the POST request is only called once. Can you guys help me? I don't know much about Firebase and can't find good documentation or other questions like this.
Here's the method which sends a message to my FCM cloud function:
public void sendPushToSingleInstance(final Context activity, final String message, final String myId, final String theirId) {
final String url = URL_TO_CLOUD_FUNCTION;
StringRequest myReq = new StringRequest(Request.Method.POST, url,
new Response.Listener<String>() {
#Override
public void onResponse(String response) {
Toast.makeText(activity, "Success", Toast.LENGTH_SHORT).show();
}
},
new Response.ErrorListener() {
#Override
public void onErrorResponse(VolleyError error) {
if (error.networkResponse != null)
Toast.makeText(activity, String.valueOf(error.networkResponse.statusCode), Toast.LENGTH_SHORT).show();
else
Toast.makeText(activity, "some error", Toast.LENGTH_SHORT).show();
}
}) {
#Override
public byte[] getBody() throws com.android.volley.AuthFailureError {
Map<String, String> rawParameters = new Hashtable<String, String>();
//not used
return new JSONObject(rawParameters).toString().getBytes();
};
public String getBodyContentType() {
return "application/json; charset=utf-8";
}
#Override
public Map<String, String> getHeaders() throws AuthFailureError {
HashMap<String, String> headers = new HashMap<String, String>();
headers.put("from", myId);
headers.put("message", message);
headers.put("sendingTo", theirId);
return headers;
}
};
Volley.newRequestQueue(activity).add(myReq);
}
My JavaScript takes the HTTP request, cuts it up and send the message to a topic which contains the other user's id (I did mean to do this verses sending to a specific device).
Here's the JavaScript for my Cloud Function:
const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp(functions.config().firebase);
exports.sendMessage = functions.https.onRequest((request, response) => {
var topicId = request.get('sendingTo');
var color = request.get('color');
var from = request.get('from')
console.log('tried to push notification');
const payload = {
notification: {
title: from,
body: color,
sound: "default"
},
};
const options = {
priority: "high",
timeToLive: 60 * 60 * 24
};
admin.messaging().sendToTopic(topicId, payload, options);
});
Finally, here are the logs:
firebase console logs
Which say that the function was called twice.
I've tried many links for answers such as the standard,
https://firebase.google.com/docs/functions/http-events
and many StackOverflow posts. I haven't seen anyone else with the same problem.
From #mohamadrabee, "this from the documentation 'Always end an HTTP function with send(), redirect(), or end(). Otherwise, your function might to continue to run and be forcibly terminated by the system.' see firebase.google.com/docs/functions/http-events "
I added:
response.end();
after:
admin.messaging().sendToTopic(topicId, payload, options);
EDIT: After inserting this code, I still get the problem roughly 7% of the time. I had to change response.end(); to:
if (response.status(200)) {
response.status(200).end();
} else {
response.end();
}
I haven't had any problems since.