android – WebSocket没有关闭重装应用程序(React Native)

前端之家收集整理的这篇文章主要介绍了android – WebSocket没有关闭重装应用程序(React Native)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用带有React Native的WebSocket并且有一些问题.当我刷新应用程序时,我发现之前的WebSocket连接(在刷新之前使用)仍然存在,并且没有正确关闭.每次我重新加载应用程序时,它都会建立新的连接.然后我关闭了应用程序,它将所有连接一起释放.

当我使用浏览器测试几乎相同的代码时,当我刷新页面时,套接字会自动关闭并在页面加载时创建新的Websocket.

如果生产环境中仍存在此问题,则可能非常关键.

这是服务器端代码(我使用了express-ws):

  1. const sockets = {};
  2.  
  3. app.ws('/',(socket,req) => {
  4. // Generate unique id to socket and save to socket list
  5. const uid = uuid.v4();
  6. socket.uid = uid;
  7.  
  8. console.log(`Socket ${uid} connected.`);
  9. sockets[uid] = socket;
  10.  
  11. socket.on('message',(data) => {
  12. broadcast(data);
  13. });
  14. socket.on('close',() => {
  15. console.log(`Socket ${uid} disconnected.`);
  16. delete sockets[uid];
  17.  
  18. broadcast({
  19. type: 'plain',message: `User ${socket.username} leaved the channel.`
  20. });
  21. socket = null; // make sure to remove socket
  22. });
  23. });

服务器只保存已连接的WebSocket,并在关闭时将其删除.你可以看到我记录了我在连接时创建的Socket id,用于识别每个websocket方便,它看起来像这样(使用node-uuid):

  1. Socket d0b62d3a-2ed9-4258-9d2d-e83a3eb99e6c disconnected.

好吧,当我使用Web浏览器测试此服务器时,它运行良好.每次刷新成功都是关闭套接字并创建新套接字.

但是使用React Native,socket在刷新应用程序时永远不会关闭.经过几次刷新,最后退出应用程序后,这些消息突然出现在控制台上:

  1. Socket d0b62d3a-2ed9-4258-9d2d-e83a3eb99e6c disconnected.
  2. Socket 2e1a2bba-ac64-4368-aeca-a02721f28ce5 disconnected.
  3. Socket 6673c9a3-9667-425a-8923-efbc40196226 disconnected.
  4. Socket 08fee145-e9bf-4af0-a245-dda2fe6a8e56 disconnected.
  5. Socket 55ce1926-d7fa-488b-92d9-ff3dea874496 disconnected.
  6. Socket 9c4c166d-d6d6-4a11-b400-a3eac51ab91f disconnected.
  7. Socket 9f6db512-649c-440e-8b88-9a77d20e1943 disconnected.
  8. Socket a9e6c0bd-419c-40af-865a-2573eca26a0f disconnected.
  9. Socket 70835c7a-3230-4e20-b133-b6c2942dff22 disconnected.
  10. Socket 5c83d81c-c0f1-4b9a-b5fb-7f09430a2f09 disconnected.
  11. Socket 4f11aea4-d0ad-4e2b-9613-9e994657ecaf disconnected.

下面的代码是我的React Native应用程序的WebSocket处理部分.

  1. import store from './store';
  2. import * as ChatActions from './actions/Chat';
  3. import * as NetworkActions from './actions/Network';
  4.  
  5. const socket = null;
  6.  
  7. export function init() {
  8. socket = new WebSocket('ws://mywebsite.com:3300');
  9.  
  10. socket.onopen = () => {
  11. store.dispatch({
  12. type: NetworkActions.NETWORK_SOCK_CONNECTED,data: {}
  13. });
  14. };
  15.  
  16. socket.onmessage = (e) => {
  17. var data = e.data;
  18. try {
  19. data = JSON.parse(e.data);
  20. }
  21. catch(err) {}
  22.  
  23. store.dispatch({
  24. type: ChatActions.CHAT_RECV,data: data.message
  25. });
  26. };
  27.  
  28. socket.onclose = (e) => {
  29. store.dispatch({
  30. type: NetworkActions.NETWORK_SOCK_CLOSED,data: {}
  31. });
  32. };
  33. }
  34.  
  35. export function send(data) {
  36. data = typeof data === 'object' ? JSON.stringify(data) : data;
  37. socket.send(data);
  38. }

如果我应该在应用程序结束之前关闭套接字,并且任何人都知道这一点,请给我一些建议.我对React Native不是很了解,也没有在google上找到相关的帖子,所以非常感谢它给我一些建议.谢谢!

附:哦,我用Android进行测试.

解决方法

你的代码看起来不错.通过刷新你的意思是在调试模式下运行时刷新javascript?这应该永远不会发生在生产中,javascript存储在设备上.

如果您需要在应用程序在后台时显式关闭连接,请查看:

http://facebook.github.io/react-native/docs/appstate.html

然后你可以在应用程序在后台调用ws.close():)

猜你在找的Android相关文章