App.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376
  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. clearTimeout(that.globalData.msgSetTime); // 消息发送成功,清除发送失败定时器
  115. if (val.action == 'list') {
  116. clearTimeout(that.globalData.msgSetTime); // 消息发送成功,清除发送失败定时器
  117. console.log('这是发送人的ID', that.globalData.userId)
  118. var obj1 = {
  119. 'action': 'list', // 动作标识,必填
  120. 'recv_user_id': that.globalData.userId, // 接收人用户id, 非必填
  121. 'data': {
  122. 'msg_status': false, // 消息未读
  123. 'msg_info': '', // 发送消息
  124. }
  125. }
  126. that.globalData.socketTask.send({
  127. data: JSON.stringify(obj1),
  128. async success(res) {},
  129. });
  130. that.globalData.userId = null
  131. } else if (val.action == 'none') {
  132. console.log('进入了none', val)
  133. that.globalData.list = val.data
  134. // this.$store.state.list = val.data
  135. this.$store.commit('updateMessageList', val.data)
  136. } else if (val.action == 'recv_video') {
  137. console.warn('recv_video---------------- 1', val.data, this.$store.state
  138. .isVideoCallRefused)
  139. // if (this.$store.state.isVideoCallRefused) {
  140. // this.$store.commit('updateIsRefusedCall', false)
  141. // return
  142. // }
  143. // this.$store.state.video = val.data
  144. this.$store.commit('updateIsRefusedCall', false)
  145. if (this.$store.state.isVideoTalking) {
  146. // 占线中
  147. var obj = {
  148. 'action': 'occupy', // 动作标识,必填
  149. 'recv_user_id': val.data.user_id, // 接收人用户id, 非必填
  150. 'data': {}
  151. }
  152. this.globalData.socketTask.send({
  153. data: JSON.stringify(obj),
  154. async success(res) {
  155. console.warn('占线消息发送成功1111', obj)
  156. }
  157. });
  158. return
  159. }
  160. that.globalData.video = val.data
  161. uni.switchTab({
  162. url: '/pages/response/index',
  163. success(res) {
  164. console.warn(res, '--------------response index into room ')
  165. },
  166. fail(err) {
  167. console.error(err)
  168. },
  169. complete() {
  170. console.warn('--------------response index into room complete')
  171. }
  172. })
  173. this.$store.commit('updateVideoInfo', val.data)
  174. setTimeout(() => {
  175. console.log('跳转了')
  176. this.$store.getters.watchData;
  177. }, 1500)
  178. } else if (val.action == 'send_video_rsp') {
  179. console.warn('recv_video---------------- response', val.data)
  180. // if (this.$store.state.isVideoCallRefused) {
  181. // this.$store.commit('updateIsRefusedCall', false)
  182. // return
  183. // }
  184. this.$store.commit('updateIsRefusedCall', false)
  185. // if(this.)
  186. this.$store.commit('updateVideoSelfRoomInfo', val.data)
  187. console.warn('into romm ready ------------------', this.roomInfo)
  188. console.warn('into romm ------------------', this.roomInfo)
  189. this.$store.commit('updateTalkingStatus', true)
  190. uni.navigateTo({
  191. url: '/pages/response/video?videoObj=' + JSON.stringify(val.data),
  192. success(res) {
  193. console.warn(res, '-------------- into room ')
  194. },
  195. fail(err) {
  196. console.error(err)
  197. },
  198. complete() {
  199. console.warn('-------------- into room complete')
  200. }
  201. })
  202. } else if (val.action == 'reject_video_rsp') {
  203. console.warn('reject_video_rsp', '挂断 拒接')
  204. // 被拒绝后挂断视频通话
  205. this.$store.commit('updateIsRefusedCall', true)
  206. } else if (val.action == 'occupy_rsp') {
  207. console.warn('----------------------- is refused')
  208. // 占线中,挂断发起通话
  209. this.$store.commit('updateIsRefusedCall', true)
  210. } else if (val.action == 'ok') {
  211. this.start(); // 心跳机制
  212. } else if (val.action == 'error') {
  213. console.log('action error')
  214. if (val.code == 403 || val.data && val.data.code == 403) {
  215. this.close();
  216. uni.setStorageSync('session_key', '')
  217. if (!this.$store.state.isInLoginPage) {
  218. uni.$u.totast(val.data.data && val.data.data.error_info || '用户在其他地方登陆,请重新登陆')
  219. setTimeout(() => {
  220. uni.navigateTo({
  221. url: "/pages/login/login"
  222. })
  223. }, 2000)
  224. }
  225. }
  226. }
  227. // this.reset();
  228. // console.log('消息可正常接收');
  229. });
  230. // 连接断开
  231. // 如果希望websocket连接一直保持,在close或者error上绑定重新连接方法。
  232. this.globalData.socketTask.onClose((res) => {
  233. console.warn(res, '连接关闭');
  234. clearTimeout(this.globalData.timeoutObj);
  235. setTimeout(() => {
  236. that.reconnect();
  237. }, 5000)
  238. })
  239. // 连接失败
  240. that.globalData.socketTask.onError((res) => {
  241. console.log(res, '连接错误');
  242. // uni.showLoading({
  243. // title: "通信异常,连接中..."
  244. // })
  245. clearTimeout(this.globalData.timeoutObj);
  246. setTimeout(() => {
  247. that.reconnect();
  248. }, 5000)
  249. })
  250. },
  251. // 心跳机制
  252. start() {
  253. var that = this
  254. this.globalData.timeoutObj = setTimeout(() => {
  255. //这里发送一个心跳,后端收到后,返回一个心跳消息,
  256. //onmessage拿到返回的心跳就说明连接正常
  257. var obj = {
  258. 'action': 'keepalive', // 动作标识,必填
  259. 'type': 'App',
  260. 'recv_user_id': '', // 接收人用户id, 非必填
  261. 'data': {
  262. msg_status: false,
  263. msg_info: "",
  264. }
  265. }
  266. that.globalData.socketTask.send({
  267. data: JSON.stringify(obj),
  268. async success(res) {
  269. that.globalData.is_open_socket = true
  270. // console.log('消息发送成功1111')
  271. }
  272. });
  273. console.log('进入心跳机制了', that.globalData.socketTask)
  274. let ws_temp = null
  275. ws_temp = that.globalData.socketTask
  276. that.globalData.socketTask = ws_temp
  277. ws_temp = null
  278. }, this.globalData.timeout)
  279. },
  280. // 清除心跳机制
  281. reset() {
  282. // 清除定时器重新发送一个心跳信息
  283. // clearTimeout(this.globalData.timeoutObj);
  284. clearTimeout(this.globalData.timeoutObj);
  285. this.start();
  286. },
  287. // 重连
  288. reconnect() {
  289. // 防止多个方法调用,多处重连
  290. if (this.lockReconnect) {
  291. return;
  292. };
  293. this.lockReconnect = true;
  294. console.log('准备重连');
  295. //没连接上会一直重连,设置延迟避免请求过多
  296. this.globalData.reconnectTimeOutObj = setTimeout(() => {
  297. // 重新连接
  298. this.msgInit()
  299. console.log('正在重新连接')
  300. this.lockReconnect = false;
  301. }, 4000);
  302. },
  303. // 清除重连
  304. notReconnect() {
  305. clearTimeout(this.globalData.reconnectTimeOutObj)
  306. },
  307. // 手动关闭
  308. close() {
  309. var that = this
  310. console.log('已经手动关闭了')
  311. that.globalData.socketTask.close()
  312. that.globalData.socketTask = null
  313. clearTimeout(that.globalData.timeoutObj);
  314. clearTimeout(that.globalData.reconnectTimeOutObj);
  315. uni.hideLoading(); // 关闭通信异常弹框
  316. },
  317. //允许程序后台运行,以持续获取GPS位置
  318. wakeLock() {
  319. //Android
  320. const main = plus.android.runtimeMainActivity();
  321. console.warn('--------- walk lock------------ dsd', main)
  322. const Context = plus.android.importClass("android.content.Context");
  323. const PowerManager = plus.android.importClass("android.os.PowerManager");
  324. const pm = main.getSystemService(Context.POWER_SERVICE);
  325. this.g_wakelock = pm.newWakeLock(PowerManager.PARTIAL_WAKE_LOCK, "ANY_NAME");
  326. this.g_wakelock.acquire();
  327. },
  328. //结束程序后台运行
  329. releaseWakeLock() {
  330. if (this.g_wakelock != null && this.g_wakelock.isHeld()) {
  331. this.g_wakelock.release();
  332. this.g_wakelock = null;
  333. }
  334. },
  335. }
  336. }
  337. </script>
  338. <!-- // App.vue文件 中首行的位置引入,注意给style标签加入lang="scss"属性 -->
  339. <style lang="scss">
  340. @import './common/zego-nvue.css';
  341. /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
  342. @import "uview-ui/index.scss";
  343. </style>