Tag: vue.js

vue的socket.io连接尝试返回“否”访问控制允许来源“标题存在”错误即使已设置的来源

我一直在试图debugging这几天,我已经有一个其他应用程序的套接字的经验,但它是在同一个域,我不认为我会遇到这个跨域的麻烦vue.js应用程序虽然 我一直在尽我所能debugging这些,基本上已经尝试了所有我能想到的东西。 在node.js服务器中,我已经设置了起源 let io = require('socket.io')(http, {origins: '*:* agora.dev:*'}) 然后我聆听与之的联系 io.on('connection', (socket)=>{ console.log('connection received') }) 但没有连接。 而在vue应用程序页面的控制台,我得到的是这些404错误说 https://gyazo.com/0197aaa3d12ba37d852d3d4b136f2afa agora.dev/:1 XMLHttpRequest无法加载http://agoraserver.dev/socket.io/?EIO=3&transport=polling&t=Lwj7pq6 。 请求的资源上没有“Access-Control-Allow-Origin”标题。 Origin'http: //agora.dev '因此不被允许访问。 该响应具有HTTP状态码404。 我正在使用vue.js webpack模板,以及vue-socket.io包和socket.io-client包。 所以我的main.js vue应用程序文件看起来像这样 import Vue from 'vue' import App from './App' import router from './router' import socketio from 'socket.io-client' import VueSocketIo from 'vue-socket.io' var SocketInstance = socketio('http://agoraserver.dev') […]

一个运行Vue前端和微服务的npm包

我的计划是将微服务和Web应用程序部署到zeit now服务器,以便Web应用程序可以对微服务服务器端进行/ api调用。 问题是,我不知道如何将两个命令合并到我的package.json文件的npm脚本对象中。 目前我只有两个目录,都有自己的package.json文件,微服务只是一个index.js,使用一个简单的微服务,使用micro和package.json文件来运行它。 然后,我的Vueconfiguration代理请求/ api到本地运行的微服务端口。 我的configuration如下。 我正在使用webpack高级vuejs模板。 这是否可以在一个包中进行部署和构build? 我正在使用微服务来进行authentication的API调用,就像你分割它的任何方式一样,如果它们被存储在前端项目中,键将被显示,这就是为什么我select使用只服务器端的微服务。 在我的config/index.js dev: { env: require('./dev.env'), port: 8080, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/api': { target: 'http://localhost:3000', changeOrigin: true, pathRewrite:{ "^/api": "" } } }, // CSS Sourcemaps off by default because relative paths are "buggy" // with this option, according to […]

Laravel 5.4-Vue npm运行手表错误

我试图从Laravel-Vue项目的Windows命令行执行npm run watch 。 我正在使用以下内容: Windows 10家庭版 节点版本7.10.0 npm版本5.5.1 这是我的package.json: { "private": true, "devDependencies": { "watchify": "^1.0.6", "bootstrap-sass": "^3.0.0", "laravel-elixir": "^2.0.0", "coffee-script": "^1.8.0", "coffeeify": "^1.1.0", "gulp": "^3.8.8", "gulp-clean-css": "*", "stringify": "^3.1.0", "vue": "*" }, "scripts": { "watch": "watchify -v -t coffeeify -t stringify resources/assets/js/app.js -o public/js/bundle.js", "build": "browserify -v -t coffeeify -t stringify resources/assets/js/app.js -o […]

使用webpack将一个项目中的多个Vuejs组件发布到npm

我试图发布一个项目,以包含两个或更多的VUE组件的npm,所以我可以导入,注册和使用这样的组件: import Component1 from 'npm-package' import Component2 from 'npm-package' 这是我的webpack文件: const webpack = require('webpack'); const merge = require('webpack-merge'); const path = require('path'); var config = { output: { path: path.resolve(__dirname + '/dist/'), }, module: { loaders: [ { test: /\.js$/, loader: 'babel', include: __dirname, exclude: /node_modules/ }, { test: /\.vue$/, loader: 'vue' }, { test: […]

我得到了npm run dev和npm在nuxt.js中运行生成错误

在Mac上开发。 从以下命令开始: vue init nuxt / express myproject 开发之后,准备在真实的服务器上构build。 (ubuntu)真实服务器的configuration如下。 ├── @ nuxtjs / axios @ 4.4.0 ├── alertify.js@1.0.12 ├── axios@0.16.2 ├── babel-polyfill@6.26.0 ├── body-parser@1.18.2 ├── bootstrap@4.0.0-beta.2 ├── connect-redis@3.3.2 ├── cookie-parser@1.4.3 ├── cross-env@5.1.0 ├── express@4.16.2 ├── express-session@1.15.6 ├── fs@0.0.1-security ├── jquery@3.2.1 ├── lodash@4.17.4 ├── moment@2.19.1 ├── node@8.3.0 ├── nuxt@1.0.0-rc9 ├── passport@0.4.0 ├── passport-local@1.0.0 ├── pg-promise@7.0.2 […]

在快速应用程序中使用Vue

我对构buildNode应用程序以及编写Vue是新手,但是我认为可以创build一个小程序来帮助我理解这两个问题。 这个想法很简单。 我试图创build一个可以在屏幕上显示的琐事游戏,用户可以使用手机来select主屏幕上出现的问题的答案。 正在使用Socket.io在服务器和客户端之间发送数据。 目前有两种路由: /和/host 。 连接到/host将生成一个唯一的ID(我将在响应中发送)并创build一个新的游戏实例,通过input主机屏幕上显示的ID来等待“玩家”join。 路线/ index.js exports.host = (req, res) => { let id = generateRandomNumber(1000, 9999); res.render("host", { type: "host", gameId: id }); }; exports.player = (req, res) => { res.render("player", { type: "player" }); }; function generateRandomNumber(min, max) { return Math.floor(Math.random() * (max – min + 1)) + min; […]

将蒸汽authentication与前端框架集成

我目前正在开发一个应用程序与Node.js后端和vue.js作为前端框架。 作为login应用程序,我正在使用护照蒸汽,在后端完美地工作。 用户被redirect到前端以便login,后端处理login并返回req.user。 在后端检查user.isAuthenticated作品。 我的问题是如何将用户信息和用户身份validation的会话传递给前端客户端? 服务器代码: app.get('/auth/steam/return', passport.authenticate('steam', { failureRedirect: '/' }), function(req, res) { res.redirect('http://localhost:8080/#/index'); }); app.get('/account', ensureAuthenticated, function(req, res){ res.send({user: req.user}); }); 当用户通过蒸汽authentication成功后,他被redirect到前端 – > localhost:8080 /#/ index,创build一个axios请求到localhost:/ 3001 /账户后端。 不幸的是前端请求没有被authentication。 有什么build议么 ? 非常感谢 !!

节点/ vue.jsunit testing的承诺,如何正确写入?

基本上,我试图testing下面的vex / action: export default { login (context, payload) { return vueAuthInstance.login(payload.user, payload.requestOptions) .then((response) => { if (JSON.stringify(response.data) !== '{}') { return true } else { return false } }) } } 我有一个依赖vueAuthInstance我需要存根/模拟…它被调用,它有一个login函数,有两个参数,它返回一个对象(响应)与数据属性 vueAuthInstance = {login: sinon.stub().withArgs({email: 'email', password: 'password'}, 'options').return({data: 'user_data_with_token'}) } 我的login函数实际上就像调用vueAuthInstance存根,所以我应该可以写 actions.login(context, payload).then((response) => { expect(response).to.eql(true) }) 但我被locking在一个正确的testing describe('login', () => { […]

vuejs应用程序部署到aws的cli。 实例错误以下服务未运行:应用程序

我有一个vuejs应用程序,我试图通过弹性beanstalk cli部署到aws。 我得到错误“以下服务不运行:应用程序”,我不知道这是什么意思。 当我看着我得到的日志 npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the start script 'node build/dev-server.js'. npm ERR! Make sure you have the latest version of node.js and npm installed. npm ERR! If you do, this is most likely a problem with the ntertainus package, npm ERR! not with npm itself. […]

Laravel Redis使用vue显示袜子数据

我用laravel创build了一个简单的事件类,如果发出通知,事件类看起来像这样, class InquirySent extends Event implements ShouldBroadcast { use SerializesModels; public $inquiries; public function __construct($inquiries) { $this->inquiries = $inquiries; } public function broadcastOn() { return ['inquiry-sent-channel']; } } 我开始这个事件(创build一个新实例): # fire inquiry notification event event(new InquirySent( $user->notifications()->where('type', InvoiceInquiry::class)->count() )); 我用这个脚本build立了我的节点服务器: var server = require('http').Server(); var io = require('socket.io')(server); // class declaration var Redis = require('ioredis'); […]