App.vue 10 KB

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