一、为了适配各种手机型号，同时为了实现项目中的某些界面的顶部显示全部图片，在appjs中添加了顶部安全区控制
<div v-show="notSafeHeight" class="safeClass bg_white" :style="{height: topHeight + 'px'}" />
<div v-show="notSafeHeight" class="bg_white" :style="{height: topHeight + 'px'}" />
const height = localStorage.getItem('nativeHeight')
this.topHeight = (height && height !== 'null') ? Number(height) : 0
这个nativeHeight 是调用方传递给我的
二、对websocket的使用
initWebpack (url, isReload = true) {
if (!url) { return }
if (this.ws && isReload) {
this.ws.close()
}
if (!isReload && this.ws) {
return
}
this.ws = new WebSocket(url)
this.ws.onopen = this.onopen
this.ws.onmessage = this.onmessage
this.ws.onclose = this.onclose
this.ws.onerror = this.onerror
window._WS = this.ws
},
reconnect () { // 5s重新连接
if (this.lockReconnect) {
return
}
console.log('重新连接')
this.lockReconnect = true
setTimeout(() => {
this.lockReconnect = false
}, 5000)
const url = localStorage.getItem('webSocketUrl') || ''
this.initWebpack(url)
},
reset () { // 重置心跳
const _this = this
_this.reconnectCount = 0
// 清除时间
clearTimeout(_this.timeoutObj)
clearTimeout(_this.serverTimeoutObj)
// 重启心跳
_this.start()
},
start () { // 开启心跳
const _this = this
_this.timeoutObj && clearTimeout(_this.timeoutObj)
_this.serverTimeoutObj && clearTimeout(_this.serverTimeoutObj)
_this.timeoutObj = setTimeout(function () {
// 这里发送一个心跳，后端收到后，返回一个心跳消息，
if (_this.ws && _this.ws.readyState === 1) { // 如果连接正常
const binary = new Uint8Array([21, 31])
_this.ws.send(binary.buffer)
} else { // 否则重连
_this.reconnect()
}
_this.serverTimeoutObj = setTimeout(function () {
// 超时关闭
_this.ws.close()
}, _this.timeout)
}, _this.timeout)
},
onopen () {
if (this.onNetworkChange === 2) {
this.onNetworkChange = 1
}
if (this.$route.path === '/stu/attendClass') {
this.E.$emit('getLessonInActList')
this.E.$emit('getLessonInChatList')
}
this.E.$emit('wsOpen')
// 开启心跳
this.start()
},
onmessage (e) {//收到信息
const _this = this
// 收到服务器信息，心跳重置
_this.reset()
this.timeSp = new Date().valueOf()
if (e.data === 'checkHeart') {
this.timeSp = new Date().valueOf()
return
}
if (JSON.parse(e.data).cmd === '/teaching/course/updateCourseSet') {
// Toast('老师更新了课程设置')
if (this.$route.path.indexOf('/courseList') > -1) {
Toast('老师更新了课程设置')
this.E.$emit('reloadCourse')
} else {
localStorage.setItem('reloadCourse', 'YES')
}
}
_this.E.$emit('websocketOnMessage', e.data)
},
onclose (e) {
console.log('连接关闭')
console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean)
this.reconnectCount++
this.reconnect()
},
onerror (e) {
// console.log(e)
// console.log('出现错误')
this.reconnectCount++
// 重连
this.reconnect()
},
