所以目前我正在与VueJS 2合作,我对它很新.现在我得到了一些其他人的帮助,但我仍然被困住了.
这是我想要实现的目标(例如 - 与我想要的密切相关):
例如,命令可以是登录,数据是用户名和密码.然后,NodeJS应用程序上的登录功能将获取此数据,执行所需操作,然后通过套接字将其返回,无论是否成功,并且可能包含一个ID和一些用户信息,供Vuex拾取并放入其中状态,为应用程序的前端提取/使用.
目前我正在使用这个锅炉板:https://github.com/SimulatedGREG/electron-vue
由于我想使用Vue和Vuex来管理我的应用程序,然后使用WebSockets管理数据服务器之间的数据,因此这对我来说非常有用.
所以,如果你看一下我在app/src/renderer /中发送的链接(这是主要代码用于vue和vuex的地方).
我的一个朋友为我添加了以下代码作为示例,我不得不尝试将其作为动作和突变进入vuex.他在一个vue组件中完成了所有这些,所以我正在努力研究它如何与vuex一起工作.因为我希望能够从应用程序中的任何位置访问(示例)loginUser操作(使用多个页面/视图的路由).
所以在 MyApp/app/src/renderer/components/LandingPageView.vue
<template>
<div>
<img src="./LandingPageView/assets/logo.png" alt="electron-vue">
<h1>Welcome.</h1>
<current-page></current-page>
<websocket-output></websocket-output>
<versions></versions>
<links></links>
</div>
</template>
<script>
import CurrentPage from './LandingPageView/CurrentPage'
import Links from './LandingPageView/Links'
import Versions from './LandingPageView/Versions'
import WebsocketOutput from './LandingPageView/WebsocketOutput'
export default {
components: {
CurrentPage,
Links,
Versions,
WebsocketOutput
},
name: 'landing-page'
}
</script>
<style scoped>
img {
margin-top: -25px;
width: 450px;
}
</style>
这是更新的文件,然后下面是代码 MyApp/app/src/renderer/components/LandingPageView/WebsocketOutput.vue
<template>
<div>
<h2>Socket output:</h2>
<p v-text="socket_out"></p>
</div>
</template> …因此，我看了很多关于FFMPeg的主题，这是我今天学到的一个很棒的工具，但是我花了整整一天的时间完善命令，现在对NodeJS的部分有些困惑。
本质上，该命令执行以下操作：从Mac OSX网络摄像头获取输入，然后将其流式传输到网络套接字。现在，我查看了许多NodeJS库，但是找不到满足我需要的库。还是不知道该怎么做。这是我正在使用的命令的示例：
ffmpeg -f avfoundation -framerate 30 -video_size 640x480 -pix_fmt uyvy422 -i "0:1" -f mpegts -codec:v mpeg1video -s 640x480 -b:v 1000k -bf 0 http://localhost:8081/stream
这可以完成流方面所需的一切，但是我希望通过NodeJS调用它，然后能够监视日志并解析返回的数据，例如：
frame= 4852 fps= 30 q=6.8 size= 30506kB time=00:02:41.74 bitrate=1545.1kbits/s speed= 1x \r
并使用它获取一个JSON数组供我输出到网页。
现在，我正在做的工作是实际解析数据的方法，并且我已经针对此类问题查看了许多其他答案，但是我似乎无法拆分/替换/正则表达式。除了一长串，我什么也收不到。
这是我正在使用的代码（NodeJS）：
var ffmpeg = require('child_process').spawn('/usr/local/Cellar/ffmpeg/3.3.1/bin/ffmpeg', ['-f', 'avfoundation', '-framerate', '30', '-video_size', '640x480', '-pix_fmt', 'uyvy422', '-i', '0:1', '-f', 'mpegts', '-codec:v', 'mpeg1video', '-s', '640x480', '-b:v', '1000k', '-bf', '0', 'http://localhost:8081/test']);
ffmpeg.on('error', function (err) {
console.log(err);
});
ffmpeg.on('close', function (code) {
console.log('ffmpeg exited with code …所以我正在努力开发一个迷你页面构建器。我正在处理以下代码：
JavaScript/Vue 代码：http://git.dannysmc.com/snippets/63 - 也粘贴在下面：
// Import Vue Data
import Vue from 'vue';
import $ from 'jquery';
import draggable from 'vuedraggable'
// Import page builder registry
import Registry from '../pagebuilder/registry.json';
// Import page builder components
import ComTextBlock from '../pagebuilder/com-text-block.vue';
// Setup new Vuex store
window.vm.content_pages_create = new Vue({
el: '#content-pages-create',
name: 'PageBuilder - Create',
store: window.vm.store,
components: {
draggable,
ComTextBlock,
},
data: {
// Define pagebuilder registry
registry: Registry,
// Define the page content
page: {
elements: 0,
rows: …所以我创建了一个新的 Web 应用程序，它使用 WebSocket 到 Node.JS WebSocket 服务器。现在 Node 服务器完成了它需要的一切工作并且完美地工作。我的问题是浏览器的实现。
我已经查看了许多其他人在答案中给出的库，但我想看看它们是否是一种更好或更干净的方法来做到这一点。
因此，在我的实例中，我基本上创建了一个对象，该对象包装了 WebSocket，然后通过调用 connect( url )使用 setInterval 重新连接，这将创建另一个 WebSocket 实例。
我一直在查看连接和客户端，似乎如果连接关闭，比如服务器出现故障，或者发生了什么事情，看起来有时，在更长的时间内，WebSocket 连接会增加一倍，所以相反每个客户端 1 个连接，它是 2、3 还是 4...？
我有一种感觉，这是因为我每次都在创建一个新的 WebSocket 实例？
代码如下：
// Main Function
function WSWrapper() {
// Variables
this.socket = null;
this.enabled = false;
this.retry = false;
// Connect
this.connect = function(address) {
// Sets the address
this.address = address;
// Creates the websocket connection
this.socket = new WebSocket(address);
// On message event handler
this.socket.onmessage = function(event) {
// …