vue-websocket使用方法?

vue-websocket在vue+webpack搭建的项目里如何使用?求大神解决一下

1个回答

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
vue在写webApp时可不可以用vue-socket.io实现长链接,实现实时刷新数据???急啊。。。。

vue在写webApp时可不可以用vue-socket.io实现长链接,实现实时刷新数据???急啊。。。。

VUE的websocket如何清除buffer

VUE的websocket执行close方法后,下次连接会接收到上次后台发的数据,应该是buffer里存储的数据,如何再vue侧清除buffer close: function() { if (this.socket) { this.socket.send('close'); this.socket.close() }

vue前端websocket连接不上springboot,报错Connection closed before receiving a handshake response

搞定了,我的代码写的基本没有问题,毕竟都是按着教程一步一步来的,主要问题在于,我的开发环境和教程不一致,我是前后端分离,请求8080即请求的前端项目,当然会超时然后建立连接失败。我查看了一下前后端各自的端口:前端8080,后端63000,然后把 ``` this.sock = new WebSocket("ws:localhost:8080/websocket");//建立连接 ``` 改成 ``` this.sock = new WebSocket("ws:localhost:63000/websocket");//建立连接 ``` 就可以了,换成后端的端口号。 --- 以下是原问题 --- 照着网上的教程写的例子,整合到自己的项目中。前端用vue写的,js里几乎和教程一模一样,主要问题在于 ``` this.sock = new WebSocket("ws:localhost:8080/websocket");//建立连接 ``` --- **创建的websocket内的方法都是null,如图:** ![图片说明](https://img-ask.csdn.net/upload/201909/24/1569293600_266157.png) --- **然后观察控制台内过了一段时间报错,提示:** ``` WebSocket connection to 'ws://localhost:8080/websocket' failed: Connection closed before receiving a handshake response ``` --- **控制台错误详情见图:** ![图片说明](https://img-ask.csdn.net/upload/201909/24/1569294057_247788.png) --- **前端代码:** ``` webSocket() { debugger; // 建立socket连接 if ('WebSocket' in window) {//判断当前浏览器是否支持webSocket // this.sock = new WebSocket("ws:localhost:8080/bootTest/websocket");//建立连接(带后端项目名) this.sock = new WebSocket("ws:localhost:8080/websocket");//建立连接(不带后端项目名) } else { alert('你的浏览器暂不支持websocket :('); } var sock = this.sock; console.log(sock); sock.onopen = function (e) {//成功建立连接 console.log(e); }; sock.onmessage = function (e) {//接收到消息 console.log(e) $(".message").append("<p><font color='red'>"+e.data+"</font>") }; sock.onerror = function (e) {//连接发生错误 console.log(e); }; sock.onclose = function (e) {//连接关闭 console.log(e); }; ////监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。 window.onbeforeunload = function(){ websocket.close(); }; } ``` --- --- --- --- 后端代码: ``` import java.io.IOException; import java.util.concurrent.CopyOnWriteArraySet; import javax.websocket.server.PathParam; import javax.websocket.server.ServerEndpoint; import javax.websocket.*; import lombok.extern.slf4j.Slf4j; @Slf4j @ServerEndpoint("/websocket") public class WebSocketServer { //静态变量,用来记录当前在线连接数。应该把它设计成线程安全的。 private static int onlineCount = 0; //concurrent包的线程安全Set,用来存放每个客户端对应的MyWebSocket对象。 private static CopyOnWriteArraySet<WebSocketServer> webSocketSet = new CopyOnWriteArraySet<WebSocketServer>(); //与某个客户端的连接会话,需要通过它来给客户端发送数据 private Session session; /** * 连接建立成功调用的方法*/ @OnOpen public void onOpen(Session session) { this.session = session; webSocketSet.add(this); //加入set中 addOnlineCount(); //在线数加1 log.info("有新连接加入!当前在线人数为" + getOnlineCount()); try { sendMessage("连接成功"); } catch (IOException e) { log.error("websocket IO异常"); } } // //连接打开时执行 // @OnOpen // public void onOpen(@PathParam("user") String user, Session session) { // currentUser = user; // System.out.println("Connected ... " + session.getId()); // } /** * 连接关闭调用的方法 */ @OnClose public void onClose() { webSocketSet.remove(this); //从set中删除 subOnlineCount(); //在线数减1 log.info("有一连接关闭!当前在线人数为" + getOnlineCount()); } /** * 收到客户端消息后调用的方法 * @param message 客户端发送过来的消息 */ @OnMessage public void onMessage(String message, Session session) { log.info("来自客户端的消息:" + message); //群发消息 for (WebSocketServer item : webSocketSet) { try { item.sendMessage(message); } catch (IOException e) { e.printStackTrace(); } } } /** * 发生错误 * @param session * @param error */ @OnError public void onError(Session session, Throwable error) { log.error("发生错误"); error.printStackTrace(); } public void sendMessage(String message) throws IOException { this.session.getBasicRemote().sendText(message); } /** * 群发自定义消息 * */ public static void sendInfo(String message) throws IOException { log.info(message); for (WebSocketServer item : webSocketSet) { try { item.sendMessage(message); } catch (IOException e) { continue; } } } public static synchronized int getOnlineCount() { return onlineCount; } public static synchronized void addOnlineCount() { WebSocketServer.onlineCount++; } public static synchronized void subOnlineCount() { WebSocketServer.onlineCount--; } } ```

安装websocket出现如下问题

![webpack和webpack-cli均为最新版本](https://img-ask.csdn.net/upload/201909/21/1569042892_94732.png) webpack和webpack-cli均为最新版本

Springboot+vue+sockjs 连不上服务器

1.问题困扰我好几天了。我用vue做前后分离去连接Springboot后台 ``` //这是SpringBoot后台 public class WebSocketConfig implements WebSocketMessageBrokerConfigurer{ @Autowired private SimpMessagingTemplate template; //广播推送消息 @Scheduled(fixedRate = 10000) public void sendTopicMessage() { System.out.println("后台广播推送!"); User user=new User(); user.setUserName("oyzc"); user.setAge(10); this.template.convertAndSend("/topic/getResponse",user); } @Override public void registerStompEndpoints(StompEndpointRegistry registry) { registry.addEndpoint("/endpoint-websocket").setAllowedOrigins("*").withSockJS(); } @Override public void configureMessageBroker(MessageBrokerRegistry registry) { registry.enableSimpleBroker("/topic","/chat"); registry.setApplicationDestinationPrefixes("/app"); } } ``` 用的是Springboot整合的websocket ``` //这是vue,JS页面 <template> <div > </div> </template> <script> import SockJS from 'sockjs-client'; import Stomp from 'stompjs'; export default { data(){ return { stompClient:'', timer:'', msg:'SocketJS' } }, methods:{ connection(){ let socket = new SockJS('http://localhost:8080/endpoint-websocket'); debugger; this.stompClient = Stomp.over(socket); console.log('stompClient:' + this.stompClient); this.stompClient.connect({}, function(frame){ console.log('Connected:' + frame); this.stompClient.subscribe('/topic/getResponse', (result) => { console.info(result) showContent(Json.parse(result.body)); }); }); }, disconnect() { if (this.stompClient) { this.stompClient.disconnect(); } }, // 断开连接 }, mounted(){ this.connection(); }, beforeDestroy: function () { // 页面离开时断开连接,清除定时器 this.disconnect(); } } </script> <style scoped> </style> ``` 以下是浏览器报错信息 ![图片说明](https://img-ask.csdn.net/upload/201904/14/1555229206_700293.png) ![图片说明](https://img-ask.csdn.net/upload/201904/14/1555229246_326496.png)

WebSocket反向代理中无法使用的响应主体

<div class="post-text" itemprop="text"> <p>Go's <a href="https://golang.org/pkg/net/http/httputil/#ReverseProxy" rel="nofollow noreferrer">httputil.ReverseProxy</a> doesn't work for <a href="https://tools.ietf.org/html/rfc6455" rel="nofollow noreferrer">WebSocket</a> traffic. The issues with it are detailed <a href="https://github.com/golang/go/issues/26937#issuecomment-419321249" rel="nofollow noreferrer">here</a>. It looks like the fix/feature may be released in Go 1.12 (see "added this to the Go1.12 milestone" <a href="https://github.com/golang/go/issues/26937" rel="nofollow noreferrer">here</a>).</p> <p>As the fix/feature is not out yet, I am trying to write my own reverse proxy to solve the problem until it is released. On my server, I wrote a simple <a href="https://github.com/gorilla/websocket" rel="nofollow noreferrer">gorilla/websocket</a> handler that upgrades the connection and then waits for a message from the client.</p> <p>On my reverse proxy server, I wrote a reverse proxy handler based on the Go 1.12 change submission <a href="https://go-review.googlesource.com/c/go/+/146437/" rel="nofollow noreferrer">here</a>, especially the additions in <a href="https://go-review.googlesource.com/c/go/+/146437/2/src/net/http/httputil/reverseproxy.go" rel="nofollow noreferrer">reverseproxy.go</a>. Here is the core of my reverse proxy handler, in relevant part:</p> <pre><code>outreq := r.WithContext(ctx) if r.ContentLength == 0 { outreq.Body = nil } p.director(outreq) outreq.Header = copyHeaders(browserHeaders) setForwardHeader(r.RemoteAddr, outreq) log.Infof("outreq URL is %+v", outreq.URL) transport := http.DefaultTransport res, err := transport.RoundTrip(outreq) if err != nil { log.Errorf("RoundTrip(outreq) failed: %s", err) } log.Infof("Server response was %+v", res) if res.StatusCode != http.StatusSwitchingProtocols { log.Errorf("Did not receive HTTP status 101 switchingn protocols: %d ", res.StatusCode) return } if !hasUpgradeHeaders(res.Header) { log.Error("request does not contain upgrade headers") return } backConn, ok := res.Body.(io.ReadWriteCloser) if !ok { log.Errorf("internal error: 101 switching protocols response with non-writable body: %v (%T)", res.Body, res.Body) return } </code></pre> <p>When I try to connect a websocket from my browser, I get as far as that last if statement. The type assertion of the response body to type <code>io.ReadWriteCloser</code> failed. When I log the response I see this:</p> <pre><code>Server response was &amp;{Status:101 Switching Protocols StatusCode:101 Proto:HTTP/1.1 ProtoMajor:1 ProtoMinor:1 Header:map[Upgrade:[websocket] Connection:[Upgrade] Sec-Websocket-Accept:[B1fWETPTtNo0bAHFWkFn2lAm9iw=]] Body:{} ContentLength:0 TransferEncoding:[] Close:false Uncompressed:false Trailer:map[] Request:0xc000112100 TLS:&lt;nil&gt;} </code></pre> <p>The error log output is this:</p> <p><code>ERRO[0012] internal error: 101 switching protocols response with non-writable body: {} (http.noBody)</code></p> <p>Why am I getting <code>http.noBody</code> in the response body rather than something implementing the <code>io.ReadWriteCloser</code> interface? How can I resolve the issue so that I can proceed to <a href="https://golang.org/pkg/net/http/#Hijacker" rel="nofollow noreferrer">hijack</a> the connection and facilitate communication between the browser and the server?</p> <h2>Update</h2> <p>I think I found the answer to the "why" question. The latest release of Go does not include this line in persistConn's readLoop function in transport.go in the net/http package:</p> <pre><code>if resp.isProtocolSwitch() { resp.Body = newReadWriteCloserBody(pc.br, pc.conn) } </code></pre> <p><a href="https://go-review.googlesource.com/c/go/+/131279/4/src/net/http/transport.go#1862" rel="nofollow noreferrer">Source</a></p> <p>Compare to current <a href="https://golang.org/src/net/http/transport.go" rel="nofollow noreferrer">here</a>.</p> <p>Any ideas for how to resolve?</p> </div>

如何从php或node.js获取websocket url路径

<div class="post-text" itemprop="text"> <p>My html code</p> <pre><code>var url='ws://localhost:8000/abc'; socket=new WebSocket(url); socket.onopen=function(){ log('Success'); } </code></pre> <p>in php or node.js how to get url path <strong>abc</strong>?</p> </div>

无法使用新的websocket协议发送消息

<div class="post-text" itemprop="text"> <p>I am trying to develop a websocket server in php.</p> <p>Here is what I have done so far : (server part)</p> <pre><code>$server = socket_create(AF_INET, SOCK_STREAM, SOL_TCP); socket_set_option($server, SOL_SOCKET, SO_REUSEADDR, 1); socket_bind($server, "localhost", 10000); socket_listen($server); $client = socket_accept($server); $message = socket_read($client, 5000); $matches = array(); preg_match('#Sec-WebSocket-Key: (.*) #', $message, $matches); $new_key = new_key($matches[1]); $new_message = "HTTP/1.1 101 Switching Protocols "; $new_message .= "Upgrade: websocket "; $new_message .= "Connection: Upgrade "; $new_message .= "Sec-WebSocket-Accept: " . $new_key . " "; socket_write($client, $new_message, strlen($new_message)); $new_message = "Test message !"; socket_write($client, $new_message, strlen($new_message)); function new_key($key) { $key .= "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"; $key = sha1($key); $new_key = ''; for ($i = 0; $i &lt; strlen($key); $i+=2) { $new_key .= chr(intval($key[$i] . $key[$i+1], 16)); } $new_key = base64_encode($new_key); return $new_key; } /* End of file server.php */ </code></pre> <p>(client part)</p> <pre><code>window.onload = function() { var ws = new WebSocket('ws://localhost:10000'); ws.onopen = function() { alert('Connection open !'); setInterval(function() { ws.send('lol'); }, 1000); } ws.onclose = function() { alert('WebSocket close !'); } ws.onmessage = function(e) { alert(e.data); } ws.onerror = function(e) { alert('Error'); } }; </code></pre> <p>The first <code>socket_write</code> works perfectly (for the handshake) and the <code>open</code> event is triggered correctly. But the second socket_write doesn't work. I tried to do a <code>ws.send</code> on the <code>open</code> event with a second <code>socket_read</code> in server part, it doesn't work neither.</p> <p>Thank you if you have an idea !</p> </div>

在vue项目中安装vue-socket.io后在main中引入项目启动报错

安装 ``` npm install vue-socket.io --save ``` main引入 ``` Vue.use(new VueSocketIO({       debug: true,       connection: 'http://localhost:5000',       vuex: {        } })) ``` 报错 ![图片说明](https://img-ask.csdn.net/upload/202005/20/1589936215_978334.png)

vue+webpack+socket连接

1. 在 .vue 里通过接口获得 ip:端口号,在 main.js 如何配置连接 socket

关于websocket连接问题---各位技术大拿看过来

Opening Web Socket... stomp.min.js:8 WebSocket connection to 'ws://localhost/api/gs-guide-websocket/406/o8znidti/websocket' failed: Connection closed before receiving a handshake response sockjs.js:1213 Web Socket Opened... stomp.min.js:8 >>> CONNECT accept-version:1.1,1.0 heart-beat:10000,10000 握手都没有成功,前台有一个代理,后台没有。正常的请求可以访问进去,但是返回不了。

springcloud下websocket无法通过网关连接

在springcloud下使用websocket,前端框架使用vue 若前端直接调用websocket的服务(不走网关),则可正常连接(url: http://localhost:8604/webSocketServer)) 若前端通过网关来连接websocket的服务,则会报404和一些跨域的问题。(url: http:localhost:9091/system-otherService/webSocketServer) 注: 8604为webSocket服务的端口,9091为网关的端口 前端: ![图片说明](https://img-ask.csdn.net/upload/201808/24/1535099271_464422.png) 后台: websocket配置: ![图片说明](https://img-ask.csdn.net/upload/201808/24/1535099351_587376.png) 网关路由![图片说明](https://img-ask.csdn.net/upload/201808/24/1535099397_526124.png) network: ![图片说明](https://img-ask.csdn.net/upload/201808/24/1535099412_427241.png) 错误信息:![图片说明](https://img-ask.csdn.net/upload/201808/24/1535099424_768522.png)

关于websocket在spring项目握手失败的问题

用java实现的websocket 我在不适用其他框架的时候可以正常握手访问 但是最近加在一个适用spring的项目中,一直握手不成功,这是什么原因? 以下是浏览器返回的信息 ``` Request URL:ws://127.0.0.1:8080/springDemo/websocket/roomName/roomId Request Method:GET Status Code:404 Not Found Response Headers (5) Request Headers view source Accept-Encoding:gzip, deflate, sdch Accept-Language:zh-CN,zh;q=0.8 Cache-Control:no-cache Connection:Upgrade Cookie:JSESSIONID=1FF3C077231B22FAE14E6CCD5E68FBF6 Host:127.0.0.1:8080 Origin:http://127.0.0.1:8080 Pragma:no-cache Sec-WebSocket-Extensions:permessage-deflate; client_max_window_bits Sec-WebSocket-Key:pUvNNKdq1RM3Sl7F0+rIIw== Sec-WebSocket-Version:13 Upgrade:websocket User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36 ``` 我spring配置信息是这样的 ``` <bean id="propertyConfigurer" class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer"> <property name="location" value="classpath:jdbcOracle.properties" /> </bean> <bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource"> <property name="driverClass" value="${jdbc.driver}" /> <property name="jdbcUrl" value="${jdbc.url}" /> <property name="user" value="${jdbc.username}" /> <property name="password" value="${jdbc.password}" /> <property name="autoCommitOnClose" value="true" /> <property name="checkoutTimeout" value="${cpool.checkoutTimeout}" /> <property name="initialPoolSize" value="${cpool.minPoolSize}" /> <property name="minPoolSize" value="${cpool.minPoolSize}" /> <property name="maxPoolSize" value="${cpool.maxPoolSize}" /> <property name="maxIdleTime" value="${cpool.maxIdleTime}" /> <property name="acquireIncrement" value="${cpool.acquireIncrement}" /> </bean> <!-- 数据库 事务管理器 --> <bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager"> <property name="dataSource" ref="dataSource" /> </bean> <!-- 创建SqlSessionFactory,同时指定数据源 --> <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"> <property name="dataSource" ref="dataSource"/> <!-- 自动扫描mapping.xml文件 --> <property name="mapperLocations" > <list> <value>classpath*:com/bs/gpms/**/mapper/*.xml</value> <value>classpath*:com/bs/basic/base/dao/*.xml</value> </list> </property> </bean> <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"> <property name="annotationClass" value="org.springframework.stereotype.Repository"/> <property name="basePackage" value="com.bs.gpms"/> </bean> <!-- <bean id="lobHandler" class="org.springframework.jdbc.support.lob.DefaultLobHandler" /> <bean id="sqlMapClient" class="org.springframework.orm.ibatis.SqlMapClientFactoryBean"> <property name="dataSource" ref="dataSource" /> <property name="configLocation" value="classpath:SqlMapConfig.xml" /> <property name="lobHandler" ref="lobHandler" /> </bean> --> <!-- 基于注释的事务,当注释中发现@Transactional时,使用id为“transactionManager”的事务管理器 --> <!-- 如果没有设置transaction-manager的值,则spring以缺省默认的事务管理器来处理事务,默认事务管理器为第一个加载的事务管理器 --> <tx:annotation-driven transaction-manager="transactionManager"/> <!-- <bean id="sqlMapClientTemplate" class="org.springframework.orm.ibatis.SqlMapClientTemplate"> <property name="sqlMapClient" ref="sqlMapClient" /> </bean> --> <mvc:annotation-driven> <mvc:message-converters> <bean class="org.springframework.http.converter.StringHttpMessageConverter"> <property name="supportedMediaTypes"> <list> <value>application/json;charset=UTF-8</value> </list> </property> </bean> </mvc:message-converters> </mvc:annotation-driven> <context:annotation-config /> <context:component-scan base-package="com.*" /> <bean id="viewResolver" class="org.springframework.web.servlet.view.UrlBasedViewResolver"> <property name="viewClass" value="org.springframework.web.servlet.view.JstlView" /> <property name="prefix" value="/" /> <property name="suffix" value=".jsp" /> </bean> ``` 一直找不到问题,因为这是旧项目,也没办法更新到spring4

vue 长链接websocket 返回数据,代码插入,动画执行一次,怎么做比较好

vue 长链接websocket 返回数据,代码插入,动画执行一次,怎么做比较好? 就是想动画执行一次,可能是上千次调用

VUE 在mounted()中getWebsocket必须刷新才执行,不刷新不执行问题

进入页面进行getWebsocket,然后获取状态,但是现在页面进入后必须F5 刷新一次,就算切换页面也没作用,打了debugger,刷新之后就执行,不 刷新就跳过。求个路大佬精英给支个办法吧,找出问题也好,跪谢! # 这是页面的mounted() ``` mounted() { var self = this; this.tableHeight = document.documentElement.clientHeight - 146 - 60; this.treeHeight = document.documentElement.clientHeight - 146 - 120; this.selectDevicePage(); //进入页面后走到这里就直接跳过不执行了,F5刷新后他就会执行 this.socket = getWebsocket({ onlineInfo: function(data) { debugger; console.log("Site.onlineInfo") console.log(data) for (var i = 0; i < self.dataTable.list.length; i++) { console.log(self.dataTable.list[i].deviceInfo.id); console.log(self.dataTable.list[i].deviceInfo.id == data._devid); if (self.dataTable.list[i].deviceInfo.id == data._devid) { self.dataTable.list[i].status = data._value; break; } } console.log(self.dataTable.list); } }).reStart(); }, ``` # 这是getWebsocket ``` export default function getWebSocket(obj) { if (zenithSocket.socket) { if (obj && obj.gpsInfo) { zenithSocket.gpsInfo = obj.gpsInfo; } if (obj && obj.onlineInfo) { zenithSocket.onlineInfo = obj.onlineInfo; } if (obj && obj.sosInfo) { zenithSocket.sosInfo = obj.sosInfo; } return zenithSocket; } else { zenithSocket.gpsInfo = obj.gpsInfo? obj.gpsInfo : function(data){}; zenithSocket.onlineInfo = obj.onlineInfo ? obj.onlineInfo : function(data){}; zenithSocket.sosInfo = obj.sosInfo ? obj.sosInfo : function(data){}; if (obj.url) { zenithSocket.url = obj.url; return createWebSocket(obj.url); } else { return null; } } } ```

websocket连接成功建立以后前台的onmessage不会自动触发,为什么?

前端:vue 后台:node 如题,websocket已经成功连接,readystate状态码是1(已建立连接可通讯的意思),后台向前台推送的数据其实是可以接收到的,但是只能靠我手动刷新页面,他才会调用一次onmessage回调方法,没有办法实时接收到数据,这是为啥,求大神指点QAQ 前端代码: ``` // 建立通讯 initWebSocket () { var that = this ws = new WebSocket('ws://localhost:8081') ws.onopen = function () { that.socketOpen() } ws.onmessage = function (data) { that.socketMsg(data) } ws.onclose = function (e) { that.socketClose(e) } ws.onerror = function (err) { console.log(err) } }, socketMsg (data) { console.log(JSON.parse(data.data)) } ``` node后台(设置定时器,查表后定时向前台推送): ``` var WebSocketServer = require('ws').Server, wss = new WebSocketServer({ port: 8081 }); wss.on('connection', function (ws) { console.log('client connected'); saleRecord(); }); var time = setTimeout(saleRecord, 5000); function saleRecord () { db.select(connection, sql, function (res) { // ... wss.on('connection', function (ws) { // ... ws.send(JSON.stringify(data)); }); }); clearTimeout(time); setTimeout(saleRecord, 5000); } ```

(Vue/wfs.js)为什么不能调用wfs.js里的websocket初始化和关闭函数,只能调用发送函数?

由于项目要进行H.264裸流播放,在github上找到了可用的[wfs.js](https://github.com/ChihChengYang/wfs.js "wfs.js"),最近又遇到了一个问题,无法调用wfs.js内部Websocket初始化和关闭的函数。 之前经过提问已经解决了[调用函数内部函数](https://ask.csdn.net/questions/891402 "")的问题,答案中的链接地址是https://blog.csdn.net/weixin_43694639/article/details/88723280, 但是我用同样的写法,却不能调用websocket的关闭函数,只能调用发送数据的函数。 --- 这是整个函数折叠起来的样子: ``` (function(f)){... })(function() {... }); ``` 这是我要调用的函数整体: ``` var WebsocketLoader = function(_EventHandler){ _inherits(WebsocketLoader, _EventHandler); function WebsocketLoader(wfs){... } _createClass(WebsocketLoader, [{... //要调用的函数在省略号里 }]); return WebsocketLoader; }(_eventHandler2.default); exports.default = WebsocketLoader; ``` **不能调用**的函数,初始化websocket: ``` key: 'initSocketClient', value: function initSocketClient() { this.client.binaryType = 'arraybuffer'; this.client.onmessage = this.receiveSocketMessage.bind(this); // clientSocket.binaryType = 'arraybuffer'; // clientSocket.onmessage = socketReceive; this.wfs.trigger(_events2.default.WEBSOCKET_MESSAGE_SENDING, { commandType: "open", channelName: this.channelName, commandValue: "NA" }); //不知道这个trigger是什么 console.log('Websocket Open!'); flagSP = true; //initSocket = initSocketClient ``` **不能调用**的函数,主动关闭websocket: ``` //这个函数是我后来自己加的 key: 'onWebsocketClose', value: function onWebsocketClose(i) { clientSocket.send(i) console.log('切换页面,中断连接。' + i) clientSocket.close(); socketClose = onWebsocketClose; ``` **每次调用都会报这个错**: ``` [Vue warn]: Error in v-on handler: "TypeError: Object(...) is not a function" found in ---> <WindowFrame> at src/components/WindowFrame.vue <ElHeader> at packages/header/src/main.vue <ElContainer> at packages/container/src/main.vue <Ccqg> at src/components/main.vue <App> at src/App.vue <Root> vue.esm.js:628 TypeError: "Object(...) is not a function" showMain WindowFrame.vue:309 click WindowFrame.vue:268 VueJS 3 ``` 但是这个函数可以在外部调用: ``` key: 'onWebsocketMessageSending', value: function onWebsocketMessageSending(i) { clientSocket.send(i) console.log('发送视频请求:' + i) //this.client.send(i) //this.client.send(JSON.stringify({ type: 2, carNum: 8888 })) sendMsg = onWebsocketMessageSending ``` 我之前写过单独的websocket,可以直接在外部调用我定义的所有方法,包括初始化和关闭。不明白为什么这里不行。

关于SpringBoot集成WebSocket后使用stomp发送消息对应路径未能成功接收到消息

自己尝试着搭建Springboot聊天室的项目,后台websocket配置如下 ``` @Configuration @EnableWebSocketMessageBroker //允许stomp协议 public class WebSocketConfig implements WebSocketMessageBrokerConfigurer{ @Override public void registerStompEndpoints(StompEndpointRegistry registry) { registry.addEndpoint("/stomp") //添加STOMP协议的端点。// 这个URL是供WebSocket客户端或SockJS客户端连接服务端访问的地址。 .setAllowedOrigins("*").addInterceptors(new HttpSessionHandshakeInterceptor()). //添加允许跨域访问 withSockJS(); //指定端点使用SockJS协议 } @Override public void configureMessageBroker(MessageBrokerRegistry registry) { registry.setApplicationDestinationPrefixes("/topic,/queue") //服务器推送给客户端的前缀 .enableSimpleBroker("/app"); //客户端发送给服务端的前缀 } } ``` 消息接收类的代码如下 ``` @Controller public class MessageController { @MessageMapping("/test") @SendTo("/topic/hhh") public String sendMessage(Map<String,Object> map){ return "miao"; } } ``` 理论上前台应该发送消息到/api/test时Controller类应该能接收到消息,但是发送消息后未能进入controller类 html就不贴了,js前端代码如下 ``` window.onload=function(){ var sockJs=new SockJS("/stomp"); var stomp=Stomp.over(sockJs); stomp.connect({},function (frame) { console.log(frame); stomp.subscribe("/topic/hhh",function (data) { console.log(data) }); }) document.getElementById("sendMesssage").onclick=function () { console.log(stomp.connected); var message=document.getElementById("talkMessage"); stomp.send("/app/test",{},JSON.stringify({"message":message})); } } ``` 连接完成时frame的控制台日志打印如下 Frame {command: "CONNECTED", headers: {…}, body: ""} body: "" command: "CONNECTED" headers: heart-beat: "0,0" version: "1.1" __proto__: Object __proto__: Object send时并没有断开连接,为啥发送不到对应地址?

websocket 如何兼容低版本浏览器?

[WebSocket] debug enabled [WebSocket] policy file: xmlsocket://211.95.3.194:843 [WebSocket] cannot connect to Web Socket server at ws://211.95.3.194:11113/demo01/MyHtml.html?message_to=&message_me= (SecurityError: Error #2048) make sure the server is running and Flash socket policy file is correctly placed [WebSocket] closed 我从网上下载了很多demo 大致都是flash+websocket.js+WebSocketMain.swf但为什么总是出这个错?

linux下利用/proc进行进程树的打印

在linux下利用c语言实现的进程树的打印,主要通过/proc下的目录中的进程文件,获取status中的进程信息内容,然后利用递归实现进程树的打印

设计模式(JAVA语言实现)--20种设计模式附带源码

课程亮点: 课程培训详细的笔记以及实例代码,让学员开始掌握设计模式知识点 课程内容: 工厂模式、桥接模式、组合模式、装饰器模式、外观模式、享元模式、原型模型、代理模式、单例模式、适配器模式 策略模式、模板方法模式、观察者模式、迭代器模式、责任链模式、命令模式、备忘录模式、状态模式、访问者模式 课程特色: 笔记设计模式,用笔记串连所有知识点,让学员从一点一滴积累,学习过程无压力 笔记标题采用关键字标识法,帮助学员更加容易记住知识点 笔记以超链接形式让知识点关联起来,形式知识体系 采用先概念后实例再应用方式,知识点深入浅出 提供授课内容笔记作为课后复习以及工作备查工具 部分图表(电脑PC端查看):

Python数据分析与挖掘

92讲视频课+16大项目实战+源码+¥800元课程礼包+讲师社群1V1答疑+社群闭门分享会=99元 &nbsp; 为什么学习数据分析? &nbsp; &nbsp; &nbsp; 人工智能、大数据时代有什么技能是可以运用在各种行业的?数据分析就是。 &nbsp; &nbsp; &nbsp; 从海量数据中获得别人看不见的信息,创业者可以通过数据分析来优化产品,营销人员可以通过数据分析改进营销策略,产品经理可以通过数据分析洞察用户习惯,金融从业者可以通过数据分析规避投资风险,程序员可以通过数据分析进一步挖掘出数据价值,它和编程一样,本质上也是一个工具,通过数据来对现实事物进行分析和识别的能力。不管你从事什么行业,掌握了数据分析能力,往往在其岗位上更有竞争力。 &nbsp;&nbsp; 本课程共包含五大模块: 一、先导篇: 通过分析数据分析师的一天,让学员了解全面了解成为一个数据分析师的所有必修功法,对数据分析师不在迷惑。 &nbsp; 二、基础篇: 围绕Python基础语法介绍、数据预处理、数据可视化以及数据分析与挖掘......这些核心技能模块展开,帮助你快速而全面的掌握和了解成为一个数据分析师的所有必修功法。 &nbsp; 三、数据采集篇: 通过网络爬虫实战解决数据分析的必经之路:数据从何来的问题,讲解常见的爬虫套路并利用三大实战帮助学员扎实数据采集能力,避免没有数据可分析的尴尬。 &nbsp; 四、分析工具篇: 讲解数据分析避不开的科学计算库Numpy、数据分析工具Pandas及常见可视化工具Matplotlib。 &nbsp; 五、算法篇: 算法是数据分析的精华,课程精选10大算法,包括分类、聚类、预测3大类型,每个算法都从原理和案例两个角度学习,让你不仅能用起来,了解原理,还能知道为什么这么做。

广工操作系统课程设计(文档+代码+可执行文件)

实现作业调度(先来先服务)、进程调度功能(时间片轮转) 实现内存管理功能(连续分配)。 实现文件系统功能(选作) 这些功能要有机地连接起来

Only老K说-爬取妹子图片(简单入门)

安装第三方请求库 requests 被网站禁止了访问 原因是我们是Python过来的 重新给一段 可能还是存在用不了,使用网页的 编写代码 上面注意看匹配内容 User-Agent:请求对象 AppleWebKit:请求内核 Chrome浏览器 //请求网页 import requests import re //正则表达式 就是去不规则的网页里面提取有规律的信息 headers = { 'User-Agent':'存放浏览器里面的' } response = requests.get

linux“开发工具三剑客”速成攻略

工欲善其事,必先利其器。Vim+Git+Makefile是Linux环境下嵌入式开发常用的工具。本专题主要面向初次接触Linux的新手,熟练掌握工作中常用的工具,在以后的学习和工作中提高效率。

Python代码实现飞机大战

文章目录经典飞机大战一.游戏设定二.我方飞机三.敌方飞机四.发射子弹五.发放补给包六.主模块 经典飞机大战 源代码以及素材资料(图片,音频)可从下面的github中下载: 飞机大战源代码以及素材资料github项目地址链接 ————————————————————————————————————————————————————————— 不知道大家有没有打过飞机,喜不喜欢打飞机。当我第一次接触这个东西的时候,我的内心是被震撼到的。第一次接触打飞机的时候作者本人是身心愉悦的,因为周边的朋友都在打飞机, 每

Python数据清洗实战入门

本次课程主要以真实的电商数据为基础,通过Python详细的介绍了数据分析中的数据清洗阶段各种技巧和方法。

2019 Python开发者日-培训

本次活动将秉承“只讲技术,拒绝空谈”的理念,邀请十余位身处一线的Python技术专家,重点围绕Web开发、自动化运维、数据分析、人工智能等技术模块,分享真实生产环境中使用Python应对IT挑战的真知灼见。此外,针对不同层次的开发者,大会还安排了深度培训实操环节,为开发者们带来更多深度实战的机会。

apache-jmeter-5.1.1(Requires Java 8+).zip

。Apache JMeter 5.1.1 (Requires Java 8+),需要jdk8以上的版本。

数通HCNP中文理论全套教材.rar

内涵HCNP-IENP中文理论书-内文,

Python可以这样学(第四季:数据分析与科学计算可视化)

董付国老师系列教材《Python程序设计(第2版)》(ISBN:9787302436515)、《Python可以这样学》(ISBN:9787302456469)配套视频,在教材基础上又增加了大量内容,通过实例讲解numpy、scipy、pandas、statistics、matplotlib等标准库和扩展库用法。

Java基础知识面试题(2020最新版)

文章目录Java概述何为编程什么是Javajdk1.5之后的三大版本JVM、JRE和JDK的关系什么是跨平台性?原理是什么Java语言有哪些特点什么是字节码?采用字节码的最大好处是什么什么是Java程序的主类?应用程序和小程序的主类有何不同?Java应用程序与小程序之间有那些差别?Java和C++的区别Oracle JDK 和 OpenJDK 的对比基础语法数据类型Java有哪些数据类型switc...

我以为我对Mysql事务很熟,直到我遇到了阿里面试官

太惨了,面试又被吊打

2019 AI开发者大会

2019 AI开发者大会(AI ProCon 2019)是由中国IT社区CSDN主办的AI技术与产业年度盛会。多年经验淬炼,如今蓄势待发:2019年9月6-7日,大会将有近百位中美顶尖AI专家、知名企业代表以及千余名AI开发者齐聚北京,进行技术解读和产业论证。我们不空谈口号,只谈技术,诚挚邀请AI业内人士一起共铸人工智能新篇章!

图书管理系统(Java + Mysql)我的第一个完全自己做的实训项目

图书管理系统 Java + MySQL 完整实训代码,MVC三层架构组织,包含所有用到的图片资源以及数据库文件,大三上学期实训,注释很详细,按照阿里巴巴Java编程规范编写

Python数据挖掘简易入门

&nbsp; &nbsp; &nbsp; &nbsp; 本课程为Python数据挖掘方向的入门课程,课程主要以真实数据为基础,详细介绍数据挖掘入门的流程和使用Python实现pandas与numpy在数据挖掘方向的运用,并深入学习如何运用scikit-learn调用常用的数据挖掘算法解决数据挖掘问题,为进一步深入学习数据挖掘打下扎实的基础。

C/C++学习指南全套教程

C/C++学习的全套教程,从基本语法,基本原理,到界面开发、网络开发、Linux开发、安全算法,应用尽用。由毕业于清华大学的业内人士执课,为C/C++编程爱好者的教程。

微信公众平台开发入门

本套课程的设计完全是为初学者量身打造,课程内容由浅入深,课程讲解通俗易懂,代码实现简洁清晰。通过本课程的学习,学员能够入门微信公众平台开发,能够胜任企业级的订阅号、服务号、企业号的应用开发工作。 通过本课程的学习,学员能够对微信公众平台有一个清晰的、系统性的认识。例如,公众号是什么,它有什么特点,它能做什么,怎么开发公众号。 其次,通过本课程的学习,学员能够掌握微信公众平台开发的方法、技术和应用实现。例如,开发者文档怎么看,开发环境怎么搭建,基本的消息交互如何实现,常用的方法技巧有哪些,真实应用怎么开发。

三个项目玩转深度学习(附1G源码)

从事大数据与人工智能开发与实践约十年,钱老师亲自见证了大数据行业的发展与人工智能的从冷到热。事实证明,计算机技术的发展,算力突破,海量数据,机器人技术等,开启了第四次工业革命的序章。深度学习图像分类一直是人工智能的经典任务,是智慧零售、安防、无人驾驶等机器视觉应用领域的核心技术之一,掌握图像分类技术是机器视觉学习的重中之重。针对现有线上学习的特点与实际需求,我们开发了人工智能案例实战系列课程。打造:以项目案例实践为驱动的课程学习方式,覆盖了智能零售,智慧交通等常见领域,通过基础学习、项目案例实践、社群答疑,三维立体的方式,打造最好的学习效果。

2021考研数学张宇基础30讲.pdf

张宇:博士,全国著名考研数学辅导专家,教育部“国家精品课程建设骨干教师”,全国畅销书《张宇高等数学18讲》《张宇线性代数9讲》《张宇概率论与数理统计9讲》《张宇考研数学题源探析经典1000题》《张宇考

专为程序员设计的数学课

<p> 限时福利限时福利,<span>15000+程序员的选择!</span> </p> <p> 购课后添加学习助手(微信号:csdn590),按提示消息领取编程大礼包!并获取讲师答疑服务! </p> <p> <br> </p> <p> 套餐中一共包含5门程序员必学的数学课程(共47讲) </p> <p> 课程1:《零基础入门微积分》 </p> <p> 课程2:《数理统计与概率论》 </p> <p> 课程3:《代码学习线性代数》 </p> <p> 课程4:《数据处理的最优化》 </p> <p> 课程5:《马尔可夫随机过程》 </p> <p> <br> </p> <p> 哪些人适合学习这门课程? </p> <p> 1)大学生,平时只学习了数学理论,并未接触如何应用数学解决编程问题; </p> <p> 2)对算法、数据结构掌握程度薄弱的人,数学可以让你更好的理解算法、数据结构原理及应用; </p> <p> 3)看不懂大牛代码设计思想的人,因为所有的程序设计底层逻辑都是数学; </p> <p> 4)想学习新技术,如:人工智能、机器学习、深度学习等,这门课程是你的必修课程; </p> <p> 5)想修炼更好的编程内功,在遇到问题时可以灵活的应用数学思维解决问题。 </p> <p> <br> </p> <p> 在这门「专为程序员设计的数学课」系列课中,我们保证你能收获到这些:<br> <br> <span> </span> </p> <p class="ql-long-24357476"> <span class="ql-author-24357476">①价值300元编程课程大礼包</span> </p> <p class="ql-long-24357476"> <span class="ql-author-24357476">②应用数学优化代码的实操方法</span> </p> <p class="ql-long-24357476"> <span class="ql-author-24357476">③数学理论在编程实战中的应用</span> </p> <p class="ql-long-24357476"> <span class="ql-author-24357476">④程序员必学的5大数学知识</span> </p> <p class="ql-long-24357476"> <span class="ql-author-24357476">⑤人工智能领域必修数学课</span> </p> <p> <br> 备注:此课程只讲程序员所需要的数学,即使你数学基础薄弱,也能听懂,只需要初中的数学知识就足矣。<br> <br> 如何听课? </p> <p> 1、登录CSDN学院 APP 在我的课程中进行学习; </p> <p> 2、登录CSDN学院官网。 </p> <p> <br> </p> <p> 购课后如何领取免费赠送的编程大礼包和加入答疑群? </p> <p> 购课后,添加助教微信:<span> csdn590</span>,按提示领取编程大礼包,或观看付费视频的第一节内容扫码进群答疑交流! </p> <p> <img src="https://img-bss.csdn.net/201912251155398753.jpg" alt=""> </p>

DDR5_Draft_Spec_Rev05c.pdf

DDR5 spec

Java面试史上最全的JAVA专业术语面试100问 (前1-50)

前言: 说在前面, 面试题是根据一些朋友去面试提供的,再就是从网上整理了一些。 先更新50道,下一波吧后面的也更出来。 求赞求关注!! 废话也不多说,现在就来看看有哪些面试题 1、面向对象的特点有哪些? 抽象、继承、封装、多态。 2、接口和抽象类有什么联系和区别? 3、重载和重写有什么区别? 4、java有哪些基本数据类型? 5、数组有没有length()方法?String有没有length()方法? 数组没有length()方法,它有length属性。 String有length()方法。 集合求长度用

网络工程师小白入门--【思科CCNA、华为HCNA等网络工程师认证】

本课程适合CCNA或HCNA网络小白同志,高手请绕道,可以直接学习进价课程。通过本预科课程的学习,为学习网络工程师、思科CCNA、华为HCNA这些认证打下坚实的基础! 重要!思科认证2020年2月24日起,已启用新版认证和考试,包括题库都会更新,由于疫情原因,请关注官网和本地考点信息。题库网络上很容易下载到。

C/C++跨平台研发从基础到高阶实战系列套餐

一 专题从基础的C语言核心到c++ 和stl完成基础强化; 二 再到数据结构,设计模式完成专业计算机技能强化; 三 通过跨平台网络编程,linux编程,qt界面编程,mfc编程,windows编程,c++与lua联合编程来完成应用强化 四 最后通过基于ffmpeg的音视频播放器,直播推流,屏幕录像,

Python界面版学生管理系统

前不久上传了一个控制台版本的学生管理系统,这个是Python界面版学生管理系统,这个是使用pycharm开发的一个有界面的学生管理系统,基本的增删改查,里面又演示视频和完整代码,有需要的伙伴可以自行下

2019数学建模A题高压油管的压力控制 省一论文即代码

2019数学建模A题高压油管的压力控制省一完整论文即详细C++和Matlab代码,希望对同学们有所帮助

4小时玩转微信小程序——基础入门与微信支付实战

这是一个门针对零基础学员学习微信小程序开发的视频教学课程。课程采用腾讯官方文档作为教程的唯一技术资料来源。杜绝网络上质量良莠不齐的资料给学员学习带来的障碍。 视频课程按照开发工具的下载、安装、使用、程序结构、视图层、逻辑层、微信小程序等几个部分组织课程,详细讲解整个小程序的开发过程

相关热词 c#中如何设置提交按钮 c#帮助怎么用 c# 读取合并单元格的值 c#带阻程序 c# 替换span内容 c# rpc c#控制台点阵字输出 c#do while循环 c#调用dll多线程 c#找出两个集合不同的
立即提问