> 백엔드 개발 > Golang > 웹소켓을 사용한 golang vue의 예

웹소켓을 사용한 golang vue의 예

藏色散人
풀어 주다: 2021-05-19 14:05:10
앞으로
2104명이 탐색했습니다.

다음 튜토리얼 칼럼인 golang에서는 golang vue에서 websocket을 사용하는 예를 소개하겠습니다. 도움이 필요한 친구들에게 도움이 되길 바랍니다!

1. golang 서버 작성

1. 필요한 websocket 패키지 golang.org/x/net/websocket 또는 github.com/golang/net/websocket 가져오기

2. 메시지 처리 기능 작성 주요 구현 클라이언트가 보낸 메시지를 받고 클라이언트에게 메시지 보내기

(conn *websocket.) {
conn.Close()
   jsonHandler := websocket.JSON
   userInfo := &{}
   res := &{
      Code: Msg:  }
Push(conn)
{
      err := jsonHandler.Receive(connuserInfo)
err != nil {
         fmt.Println(err)
}
      jsonData_ := json.Marshal(userInfo)
      fmt.Println((jsonData[:]))
      err = jsonHandler.Send(connres)
err != nil {
         fmt.Println(err)
}
   }
}
로그인 후 복사

3. 주소와 포트 바인딩

main

(
)

() {
   http.Handle(websocket.(handler.))
   err := http.ListenAndServe(nil)
err != nil {
      fmt.Println(err)
   }
}
로그인 후 복사

2. VUE 클라이언트 작성

<template>
<p>
{{msg}}
</p>
</template>
<script>
export default {
data () {
return {
websock: null,
msg: &#39;&#39;
}
},
methods: {
init: function () {
const wsurl = &#39;ws://127.0.0.1:88/ws&#39;
this.websock = new WebSocket(wsurl)
this.websock.onmessage = this.onmessage
this.websock.onopen = this.onopen
this.websock.onerror = this.onerror
this.websock.onclose = this.onclose
},
onopen: function () {
this.send(&#39;{"userid":1, "name":"zhang san", "age":"30"}&#39;)
},
send: function (data) {
for (var i = 0; i < 10; i++) {
this.websock.send(data)
}
},
onclose: function (e) {
console.log(&#39;ws close&#39;, e)
},
onmessage: function (e) {
let _this = this
console.log(e.data)
_this.msg = e.data
},
onerror: function () {
console.log(&#39;ws error&#39;)
this.init()
}
},
mounted: function () {
this.init()
},
watch: {
}
}
</script>
로그인 후 복사

전체 소스 코드 액세스: https://github.com /w3liu/웹소켓

위 내용은 웹소켓을 사용한 golang vue의 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:cnblogs.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿