App.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374
  1. <script>
  2. import config from '@/util/url.js';
  3. import HeartBeat from '@/util/HeartBeat.js'
  4. export default {
  5. globalData: {
  6. token: "",
  7. // 文本消息
  8. socketTask: null,
  9. // urlData: "wss://www.toreskj.com/api/api_gateway?method=control_center.real_time.im_message",
  10. urlData: config.wsUrl + "/api/api_gateway?method=control_center.real_time.im_message",
  11. is_open_socket: false, // 确保websocket是打开状态
  12. list: [],
  13. userId: null, // 用户ID
  14. // 即构
  15. video: null, //房间密码和token
  16. // 测试 - 心跳检测
  17. status: null, // websocket是否关闭
  18. lockReconnect: false, // 避免重复连接
  19. // timeout: 5000, // 多少秒执行监测
  20. timeout: 10000, // 多少秒执行监测
  21. timeoutObj: null, // 检测服务器端是否还活着
  22. reconnectTimeOutObj: null, // 重连之后多久再次重连
  23. // 测试
  24. app: [],
  25. // 消息发送加载
  26. msgSetTime: null,
  27. g_wakelock: null
  28. },
  29. onLoad() {},
  30. onLaunch: function() {
  31. console.log('启动了')
  32. HeartBeat.getInstance().destory();
  33. // App启动
  34. var that = this
  35. // #ifdef APP-PLUS
  36. this.wakeLock()
  37. // #endif
  38. // uni.getStorage({
  39. // key: 'session_key',
  40. // success: function(res) {
  41. // that.globalData.token = res.data
  42. // // console.log('登录成功了')
  43. // that.msgInit(); // 文本初始化
  44. // },
  45. // fail: function(err) {
  46. // console.log(err)
  47. // console.log('没有登录成功')
  48. // }
  49. // })
  50. },
  51. onShow: function() {
  52. var that = this
  53. this.$store.dispatch('updateTaskRecordRatio')
  54. // App展示在前台
  55. console.log('+++++++++++++++++++App Show-------------------------------------')
  56. // this.msgInit(); // 再进行请求
  57. uni.getStorage({
  58. key: 'session_key',
  59. success: function(res) {
  60. that.globalData.token = res.data
  61. // console.log('登录成功了')
  62. console.log(res)
  63. that.msgInit(); // 文本初始化
  64. },
  65. fail: function(err) {
  66. console.log(err)
  67. console.log('没有登录成功')
  68. }
  69. })
  70. },
  71. onHide: function() {
  72. // App不再再展示在前台
  73. this.close(); // 关闭
  74. },
  75. methods: {
  76. // 实时通信 - 初始化
  77. msgInit() {
  78. console.log('进入了实时通信初始化=--------------------------', this.globalData.token)
  79. var that = this
  80. // 连接webscoket
  81. that.globalData.socketTask = uni.connectSocket({
  82. url: this.globalData.urlData + "&token=" + that.globalData.token,
  83. success(data) {
  84. // console.log("websocket连接中");
  85. }
  86. });
  87. // 发送消息 - 获取对话列表
  88. var obj = {
  89. 'action': 'list', // 动作标识,必填
  90. 'recv_user_id': '', // 接收人用户id, 非必填
  91. 'data': {}
  92. }
  93. that.globalData.socketTask.onOpen((res) => {
  94. console.log('websocket开启了')
  95. // 清除重连定时器
  96. // clearTimeout(that.globalData.reconnectTimeOutObj)
  97. // that.notReconnect()
  98. that.globalData.socketTask.send({
  99. data: JSON.stringify(obj),
  100. async success(res) {
  101. that.globalData.is_open_socket = true
  102. console.log("消息发送成功");
  103. uni.hideLoading(); // 关闭通信异常弹框
  104. },
  105. });
  106. that.start() // 开启心跳机制
  107. })
  108. // // 接收服务器返回的消息
  109. // // 注:只有连接正常打开中 ,才能正常收到消息
  110. that.globalData.socketTask.onMessage((res) => {
  111. // console.log("收到服务器内容:");
  112. var val = JSON.parse(res.data)
  113. console.warn('这是返回的内容---------', val)
  114. if (val.action == 'list') {
  115. clearTimeout(that.globalData.msgSetTime); // 消息发送成功,清除发送失败定时器
  116. console.log('这是发送人的ID', that.globalData.userId)
  117. var obj1 = {
  118. 'action': 'list', // 动作标识,必填
  119. 'recv_user_id': that.globalData.userId, // 接收人用户id, 非必填
  120. 'data': {
  121. 'msg_status': false, // 消息未读
  122. 'msg_info': '', // 发送消息
  123. }
  124. }
  125. that.globalData.socketTask.send({
  126. data: JSON.stringify(obj1),
  127. async success(res) {},
  128. });
  129. that.globalData.userId = null
  130. } else if (val.action == 'none') {
  131. console.log('进入了none', val)
  132. that.globalData.list = val.data
  133. // this.$store.state.list = val.data
  134. this.$store.commit('updateMessageList', val.data)
  135. } else if (val.action == 'recv_video') {
  136. console.warn('recv_video---------------- 1', val.data)
  137. if (this.$store.state.isVideoCallRefused) {
  138. this.$store.commit('updateIsRefusedCall', false)
  139. return
  140. }
  141. // this.$store.state.video = val.data
  142. this.$store.commit('updateIsRefusedCall', false)
  143. if (this.$store.state.isVideoTalking) {
  144. // 占线中
  145. var obj = {
  146. 'action': 'occupy', // 动作标识,必填
  147. 'recv_user_id': val.data.user_id, // 接收人用户id, 非必填
  148. 'data': {}
  149. }
  150. this.globalData.socketTask.send({
  151. data: JSON.stringify(obj),
  152. async success(res) {
  153. console.warn('占线消息发送成功1111', val.data)
  154. }
  155. });
  156. return
  157. }
  158. that.globalData.video = val.data
  159. uni.switchTab({
  160. url: '/pages/response/index',
  161. success(res) {
  162. console.warn(res, '--------------response index into room ')
  163. },
  164. fail(err) {
  165. console.error(err)
  166. },
  167. complete() {
  168. console.warn('--------------response index into room complete')
  169. }
  170. })
  171. this.$store.commit('updateVideoInfo', val.data)
  172. setTimeout(() => {
  173. console.log('跳转了')
  174. this.$store.getters.watchData;
  175. }, 1500)
  176. } else if (val.action == 'send_video_rsp') {
  177. console.warn('recv_video---------------- response', val.data)
  178. if (this.$store.state.isVideoCallRefused) {
  179. this.$store.commit('updateIsRefusedCall', false)
  180. return
  181. }
  182. this.$store.commit('updateIsRefusedCall', false)
  183. // if(this.)
  184. this.$store.commit('updateVideoSelfRoomInfo', val.data)
  185. console.warn('into romm ready ------------------', this.roomInfo)
  186. console.warn('into romm ------------------', this.roomInfo)
  187. this.$store.commit('updateTalkingStatus', true)
  188. uni.navigateTo({
  189. url: '/pages/response/video?videoObj=' + JSON.stringify(val.data),
  190. success(res) {
  191. console.warn(res, '-------------- into room ')
  192. },
  193. fail(err) {
  194. console.error(err)
  195. },
  196. complete() {
  197. console.warn('-------------- into room complete')
  198. }
  199. })
  200. } else if (val.action == 'reject_video_rsp') {
  201. console.warn('reject_video_rsp','挂断 拒接')
  202. // 被拒绝后挂断视频通话
  203. this.$store.commit('updateIsRefusedCall', true)
  204. } else if (val.action == 'occupy_rsp') {
  205. console.warn('----------------------- is refused')
  206. // 占线中,挂断发起通话
  207. this.$store.commit('updateIsRefusedCall', true)
  208. } else if (val.action == 'ok') {
  209. this.start(); // 心跳机制
  210. } else if (val.action == 'error') {
  211. if (val.data.errorCode == 403) {
  212. this.close();
  213. uni.setStorageSync('session_key', '')
  214. if (!this.$store.state.isInLoginPage) {
  215. uni.$u.totast('用户在其他地方登陆,请重新登陆')
  216. setTimeout(() => {
  217. uni.navigateTo({
  218. url: "/pages/login/login"
  219. })
  220. }, 2000)
  221. }
  222. }
  223. }
  224. // this.reset();
  225. // console.log('消息可正常接收');
  226. });
  227. // 连接断开
  228. // 如果希望websocket连接一直保持,在close或者error上绑定重新连接方法。
  229. this.globalData.socketTask.onClose((res) => {
  230. console.warn(res, '连接关闭');
  231. clearTimeout(this.globalData.timeoutObj);
  232. setTimeout(() => {
  233. that.reconnect();
  234. }, 5000)
  235. })
  236. // 连接失败
  237. that.globalData.socketTask.onError((res) => {
  238. console.log(res, '连接错误');
  239. // uni.showLoading({
  240. // title: "通信异常,连接中..."
  241. // })
  242. clearTimeout(this.globalData.timeoutObj);
  243. setTimeout(() => {
  244. that.reconnect();
  245. }, 5000)
  246. })
  247. },
  248. // 心跳机制
  249. start() {
  250. var that = this
  251. this.globalData.timeoutObj = setTimeout(() => {
  252. //这里发送一个心跳,后端收到后,返回一个心跳消息,
  253. //onmessage拿到返回的心跳就说明连接正常
  254. var obj = {
  255. 'action': 'keepalive', // 动作标识,必填
  256. 'type': 'App',
  257. 'recv_user_id': '', // 接收人用户id, 非必填
  258. 'data': {
  259. msg_status: false,
  260. msg_info: "",
  261. }
  262. }
  263. that.globalData.socketTask.send({
  264. data: JSON.stringify(obj),
  265. async success(res) {
  266. that.globalData.is_open_socket = true
  267. // console.log('消息发送成功1111')
  268. }
  269. });
  270. console.log('进入心跳机制了', that.globalData.socketTask)
  271. let ws_temp = null
  272. ws_temp = that.globalData.socketTask
  273. that.globalData.socketTask = ws_temp
  274. ws_temp = null
  275. }, this.globalData.timeout)
  276. },
  277. // 清除心跳机制
  278. reset() {
  279. // 清除定时器重新发送一个心跳信息
  280. // clearTimeout(this.globalData.timeoutObj);
  281. clearTimeout(this.globalData.timeoutObj);
  282. this.start();
  283. },
  284. // 重连
  285. reconnect() {
  286. // 防止多个方法调用,多处重连
  287. if (this.lockReconnect) {
  288. return;
  289. };
  290. this.lockReconnect = true;
  291. console.log('准备重连');
  292. //没连接上会一直重连,设置延迟避免请求过多
  293. this.globalData.reconnectTimeOutObj = setTimeout(() => {
  294. // 重新连接
  295. this.msgInit()
  296. console.log('正在重新连接')
  297. this.lockReconnect = false;
  298. }, 4000);
  299. },
  300. // 清除重连
  301. notReconnect() {
  302. clearTimeout(this.globalData.reconnectTimeOutObj)
  303. },
  304. // 手动关闭
  305. close() {
  306. var that = this
  307. console.log('已经手动关闭了')
  308. that.globalData.socketTask.close()
  309. that.globalData.socketTask = null
  310. clearTimeout(that.globalData.timeoutObj);
  311. clearTimeout(that.globalData.reconnectTimeOutObj);
  312. uni.hideLoading(); // 关闭通信异常弹框
  313. },
  314. //允许程序后台运行,以持续获取GPS位置
  315. wakeLock() {
  316. //Android
  317. const main = plus.android.runtimeMainActivity();
  318. console.warn('--------- walk lock------------ dsd', main)
  319. const Context = plus.android.importClass("android.content.Context");
  320. const PowerManager = plus.android.importClass("android.os.PowerManager");
  321. const pm = main.getSystemService(Context.POWER_SERVICE);
  322. this.g_wakelock = pm.newWakeLock(PowerManager.PARTIAL_WAKE_LOCK, "ANY_NAME");
  323. this.g_wakelock.acquire();
  324. },
  325. //结束程序后台运行
  326. releaseWakeLock() {
  327. if (this.g_wakelock != null && this.g_wakelock.isHeld()) {
  328. this.g_wakelock.release();
  329. this.g_wakelock = null;
  330. }
  331. },
  332. }
  333. }
  334. </script>
  335. <!-- // App.vue文件 中首行的位置引入,注意给style标签加入lang="scss"属性 -->
  336. <style lang="scss">
  337. @import './common/zego-nvue.css';
  338. /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
  339. @import "uview-ui/index.scss";
  340. </style>