uni-app开发环境更改默认的websocket地址

发布于 1周前 作者 yibo5220 来自 Uni-App

uni-app开发环境更改默认的websocket地址

操作步骤：

  • …

预期结果：

  • 在开发环境能够使用agora-chat正常连接websocket

实际结果：

  • 开发环境中连接地址被替换

bug描述：

通过uniapp 使用agora-chat sdk,在开发环境运行默认的连接websocket的地址被替换为本地服务地址,此时我创建一个同样的vue项目将代码完全复制过去,启动项目websocket连接正常,又创建一个react项目启动同样正常. 我把uniapp项目打包后部署到任何环境websocket连接均正常,现在的问题就是在uniapp的开发环境我本来正常的websocket连接地址 ws://msync-api*****.chat.agora.io/ws/203/uyvlnhrx/websocket会被替换为ws://localhost:5174/pages/chat/index/094/c0wrujvs/websocket


| 项目属性           | 值          |
|-------------------|--------------|
| 产品分类           | uniapp/H5    |
| PC开发环境操作系统 | Windows      |
| PC开发环境操作系统版本号 | win11        |
| HBuilderX类型     | 正式         |
| HBuilderX版本号   | 4.36         |
| 浏览器平台         | Chrome       |
| 浏览器版本         | 131.0.6778.86 |
| 项目创建方式       | HBuilderX    |

Harmonyos Next教程
4 回复

多半是代码问题，看下websoket的地址怎么获取的吧


websoket 的地址是通过他的appkey默认获取的,代码我都排查了,并且同样的代码在vue项目中能够正常

回复 你好你好123: websoket 的地址是通过他的appkey默认获取的；是通过请求接口嘛，不是的话应该通过环境变量拼接生成的吧？

在uni-app项目中，更改默认的WebSocket地址通常涉及修改项目的配置文件或直接在代码中指定新的WebSocket地址。下面是一个简单的代码示例，展示了如何在uni-app项目中动态更改默认的WebSocket地址。

1. 配置文件中设置（可选）

虽然uni-app没有直接的配置文件用于设置默认的WebSocket地址，但你可以在manifest.json中配置一些基础的网络请求设置，不过对于WebSocket，通常还是直接在代码中进行配置。

2. 在代码中动态设置WebSocket地址

假设你有一个默认的WebSocket地址ws://default.example.com/ws，但现在你想根据某些条件（如环境变量、用户配置等）更改为ws://new.example.com/ws。

示例代码

// 在项目的某个公共JS文件中，比如utils/websocket.js
export function createWebSocket(url = 'ws://default.example.com/ws') {
  // 这里可以根据需要动态更改url
  // 例如，根据环境变量
  if (process.env.NODE_ENV === 'production') {
    url = 'ws://production.example.com/ws';
  } else if (someUserConfigCondition) {
    url = 'ws://new.example.com/ws';
  }

  const ws = new WebSocket(url);

  ws.onopen = function open() {
    console.log('WebSocket is open now.');
  };

  ws.onmessage = function incoming(data) {
    console.log('New message from server ', data);
  };

  ws.onerror = function error(err) {
    console.error('WebSocket error observed:', err);
  };

  ws.onclose = function close() {
    console.log('WebSocket is closed now.');
  };

  return ws;
}

// 在需要使用WebSocket的页面或组件中
import { createWebSocket } from '@/utils/websocket.js';

export default {
  mounted() {
    // 创建WebSocket连接
    this.ws = createWebSocket('ws://override.example.com/ws'); // 可选：传入特定地址覆盖默认设置
  },
  beforeDestroy() {
    // 关闭WebSocket连接
    if (this.ws) {
      this.ws.close();
    }
  }
};

注意事项

  • 在实际项目中，确保WebSocket地址是可访问的，并且符合你的应用需求。
  • 在组件销毁前关闭WebSocket连接是一个好习惯，可以避免潜在的内存泄漏问题。
  • 根据项目需求，你可能需要更复杂的逻辑来确定WebSocket的地址，比如从服务器获取配置信息。

通过上述方法，你可以灵活地更改uni-app项目中默认的WebSocket地址。

回到顶部