admin管理员组文章数量:1429066
I want to subscribe to the topic with SockJS and Stomp Client I put the subscribe on the client inside onConnect function to make sure that the Client is connected, This my configuration for:
import getEnvVars from "./environment";
import { socketUrl } from "../services/GlobalUrls";
import SockJS from "sockjs-client";
import { Client } from "@stomp/stompjs";
/**
* Please notice that this import not used on this file
* but used on the library of this file
* so please don't delete it or the app will throw an error
* */
import * as encoding from "text-encoding";
const url = getEnvVars().apiUrl + socketUrl;
let _stompClient = null;
const webSocket = () => {
//const [message, newMessage] = useState();
_stompClient = new Client({
brokerURL: url,
connectHeaders: {},
debug: (str) => {
console.log(str);
},
reconnectDelay: 500,
heartbeatIning: 4000,
heartbeatOutgoing: 4000,
logRawCommunication: false,
webSocketFactory: () => {
return SockJS(url);
},
onStompError: (frame) => {
console.log("Stomp Error", frame);
},
onConnect: (frame) => {
console.log("Stomp Connect", frame);
if (_stompClient.connected) {
_stompClient.subscribe("topic/notification", (message) => {
console.log("message");
if (message.body) {
let notification = JSON.parse(message.body);
if (notification.type == "MESSAGE") {
console.log("MESSAGE", notification);
} else if (notification.type == "INVITATION") {
console.log("INVITATION", notification);
} else if (notification.type == "REMOVED") {
console.log("REMOVED", notification);
}
}
});
}
},
onDisconnect: (frame) => {
console.log("Stomp Disconnect", frame);
},
onWebSocketClose: (frame) => {
console.log("Stomp WebSocket Closed", frame);
},
onWebSocketError: (frame) => {
console.log("Stomp WebSocket Error", frame);
},
});
_stompClient.activate();
return _stompClient;
};
export default webSocket;
On my react native ponent:
useEffect(() => {
webSocket();
}, []);
My debug show this:
Opening Web Socket...
accept-version:1.0,1.1,1.2
heart-beat:4000,4000
Web Socket Opened...
heart-beat:0,0
version:1.2
content-length:0
id:sub-0
destination:topic/notification/8
>>> CONNECT
accept-version:1.0,1.1,1.2
heart-beat:4000,4000
Received data
<<< CONNECTED
heart-beat:0,0
version:1.2
content-length:0
connected to server undefined
Stomp Connect FrameImpl {
"_binaryBody": Uint8Array [],
"mand": "CONNECTED",
"escapeHeaderValues": false,
"headers": Object {
"heart-beat": "0,0",
"version": "1.2",
},
"isBinaryBody": true,
"skipContentLengthHeader": false,
}
>>> SUBSCRIBE
id:sub-0
destination:topic/notification
The same debug showed on the angular app and I got the message but on my react native app I got nothing. Angular setup:
const ws = new SockJS(this.globalService.BASE_URL + "/socket");
this.stompClient = Stomp.over(ws);
this.stompClient.debug = () => {};
const that = this;
this.stompClient.connect({}, function(frame) {
that.stompClient.subscribe(
"/topic/notification",
message => {
if (message.body) {
let notification = JSON.parse(message.body);
if (notification.type == "MESSAGE") {
that.messageListService.setNotificationObs(notification);
} else if (notification.type == "INVITATION") {
that.messageListService.setInvitationNotificationObs(notification);
} else if (notification.type == "REMOVED") {
that.messageListService.removeInvitationNotificationObs(notification);
}
}
}
);
});
I want to subscribe to the topic with SockJS and Stomp Client I put the subscribe on the client inside onConnect function to make sure that the Client is connected, This my configuration for:
import getEnvVars from "./environment";
import { socketUrl } from "../services/GlobalUrls";
import SockJS from "sockjs-client";
import { Client } from "@stomp/stompjs";
/**
* Please notice that this import not used on this file
* but used on the library of this file
* so please don't delete it or the app will throw an error
* */
import * as encoding from "text-encoding";
const url = getEnvVars().apiUrl + socketUrl;
let _stompClient = null;
const webSocket = () => {
//const [message, newMessage] = useState();
_stompClient = new Client({
brokerURL: url,
connectHeaders: {},
debug: (str) => {
console.log(str);
},
reconnectDelay: 500,
heartbeatIning: 4000,
heartbeatOutgoing: 4000,
logRawCommunication: false,
webSocketFactory: () => {
return SockJS(url);
},
onStompError: (frame) => {
console.log("Stomp Error", frame);
},
onConnect: (frame) => {
console.log("Stomp Connect", frame);
if (_stompClient.connected) {
_stompClient.subscribe("topic/notification", (message) => {
console.log("message");
if (message.body) {
let notification = JSON.parse(message.body);
if (notification.type == "MESSAGE") {
console.log("MESSAGE", notification);
} else if (notification.type == "INVITATION") {
console.log("INVITATION", notification);
} else if (notification.type == "REMOVED") {
console.log("REMOVED", notification);
}
}
});
}
},
onDisconnect: (frame) => {
console.log("Stomp Disconnect", frame);
},
onWebSocketClose: (frame) => {
console.log("Stomp WebSocket Closed", frame);
},
onWebSocketError: (frame) => {
console.log("Stomp WebSocket Error", frame);
},
});
_stompClient.activate();
return _stompClient;
};
export default webSocket;
On my react native ponent:
useEffect(() => {
webSocket();
}, []);
My debug show this:
Opening Web Socket...
accept-version:1.0,1.1,1.2
heart-beat:4000,4000
Web Socket Opened...
heart-beat:0,0
version:1.2
content-length:0
id:sub-0
destination:topic/notification/8
>>> CONNECT
accept-version:1.0,1.1,1.2
heart-beat:4000,4000
Received data
<<< CONNECTED
heart-beat:0,0
version:1.2
content-length:0
connected to server undefined
Stomp Connect FrameImpl {
"_binaryBody": Uint8Array [],
"mand": "CONNECTED",
"escapeHeaderValues": false,
"headers": Object {
"heart-beat": "0,0",
"version": "1.2",
},
"isBinaryBody": true,
"skipContentLengthHeader": false,
}
>>> SUBSCRIBE
id:sub-0
destination:topic/notification
The same debug showed on the angular app and I got the message but on my react native app I got nothing. Angular setup:
const ws = new SockJS(this.globalService.BASE_URL + "/socket");
this.stompClient = Stomp.over(ws);
this.stompClient.debug = () => {};
const that = this;
this.stompClient.connect({}, function(frame) {
that.stompClient.subscribe(
"/topic/notification",
message => {
if (message.body) {
let notification = JSON.parse(message.body);
if (notification.type == "MESSAGE") {
that.messageListService.setNotificationObs(notification);
} else if (notification.type == "INVITATION") {
that.messageListService.setInvitationNotificationObs(notification);
} else if (notification.type == "REMOVED") {
that.messageListService.removeInvitationNotificationObs(notification);
}
}
}
);
});
1 Answer
Reset to default 0Okay i find out the right way to configure the Client, and maybe this will help anyone on the future here
I need to instantiate the Client _stompClient = new Client(); then configure it like that :
_stompClient.configure({
...
onConnect: (frame) => {
console.log("onConnect");
_stompClient.subscribe("/topic/notification", (message) => {
console.log(message.body);
});
},
...
});
_stompClient.activate();
And i got my message on the debug.
Answered Here
本文标签：
版权声明：本文标题：javascript - Subscribe to topic with Stomp Client but i don't get any notification don't work React Native and w 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745505971a2661246.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论