简单websocket连接,小程序上正常,但转为开应用后,socket要不就连接立马断掉,要不久根本连接不上
- 发布:2023-04-11 10:53
- 更新:2023-04-11 10:53
- 阅读:160
产品分类: uniapp/快应用/OPPO
渲染模式: webview
操作步骤:
预期结果:
可以连上websocket
可以连上websocket
实际结果:
<template>
<view class="content">
<!-- 需要一进入浏览器就要建立链接 -->
<!-- 点击按钮发送消息给服务器 -->
输入姓名:<input type="text" id="uName" v-model="uName">
<br>
输入消息:<input type="text" id="context" v-model="context">
<button id="btn" @click="sendMsg"> 点击发送消息 </button>
<view ref="charRoom" id="charRoom" v-for="item in charRoom" :key="item">{{item}}</view>
</view>
</template>
<script>
export default {
data() {
return {
uName: '',
context: '',
charRoom: {},
socketTask: null
}
},
onLoad() {
let that = this
uni.connectSocket({
url: "ws://localhost:8080",
success(res) {
console.log('成功111',res)
that.initWebSocket()
},
fail: (err) => {
console.log('err',err)
}
})
console.log('---1113123',that.socketTask)
},
methods: {
initWebSocket() {
let that = this
//连接成功
uni.onSocketOpen(function(res) {
console.log('webscoket连接成功',that.socketTask)
})
//接收信息
uni.onSocketMessage(function(res) {
console.log('------',JSON.parse(res.data))
// 服务器返回过来的聊天信息
const chatS = JSON.parse(res.data)
that.charRoom = chatS
});
//连接失败
uni.onSocketError(function() {
console.log('websocket连接失败!');
})
//断开连接
uni.onSocketClose(function(res) {
console.log('WebSocket 已关闭!');
});
},
sendMsg() {
const values = {
uName: this.uName,
context: this.context
}
this.uName = ''
this.context = ''
// 通过 websockte 发送消息
//websocket.send(JSON.stringify(values))
uni.sendSocketMessage({data: JSON.stringify(values)})
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
<template>
<view class="content">
<!-- 需要一进入浏览器就要建立链接 -->
<!-- 点击按钮发送消息给服务器 -->
输入姓名:<input type="text" id="uName" v-model="uName">
<br>
输入消息:<input type="text" id="context" v-model="context">
<button id="btn" @click="sendMsg"> 点击发送消息 </button>
<view ref="charRoom" id="charRoom" v-for="item in charRoom" :key="item">{{item}}</view>
</view>
</template>
<script>
export default {
data() {
return {
uName: '',
context: '',
charRoom: {},
socketTask: null
}
},
onLoad() {
let that = this
uni.connectSocket({
url: "ws://localhost:8080",
success(res) {
console.log('成功111',res)
that.initWebSocket()
},
fail: (err) => {
console.log('err',err)
}
})
console.log('---1113123',that.socketTask)
},
methods: {
initWebSocket() {
let that = this
//连接成功
uni.onSocketOpen(function(res) {
console.log('webscoket连接成功',that.socketTask)
})
//接收信息
uni.onSocketMessage(function(res) {
console.log('------',JSON.parse(res.data))
// 服务器返回过来的聊天信息
const chatS = JSON.parse(res.data)
that.charRoom = chatS
});
//连接失败
uni.onSocketError(function() {
console.log('websocket连接失败!');
})
//断开连接
uni.onSocketClose(function(res) {
console.log('WebSocket 已关闭!');
});
},
sendMsg() {
const values = {
uName: this.uName,
context: this.context
}
this.uName = ''
this.context = ''
// 通过 websockte 发送消息
//websocket.send(JSON.stringify(values))
uni.sendSocketMessage({data: JSON.stringify(values)})
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
bug描述:
在小程序开发的websocket,转为快应用之后,无法使用
0 个回复