简体   繁体   English

如何在 Vue.js 开发人员和 Rails 4 后端之间共享会话?

[英]How to share a session between Vue.js dev and Rails 4 backend?

I'm working with a Vue.js cli application that is co-exists with a Rails 4.2 backend.我正在使用与 Rails 4.2 后端共存的 Vue.js cli 应用程序。

The goal here is to use the existing sessions.这里的目标是使用现有的会话。 When I compile the Vue.js application for production mode I can run the Rails server in development mode and the Vue app is served from correctly from the public directory and sessions work since they are being served on the same domain.当我为生产模式编译 Vue.js 应用程序时,我可以在开发模式下运行 Rails 服务器,并且 Vue 应用程序是从public目录正确提供的,并且会话工作,因为它们在同一个域上提供。

Trying to develop and debug like this is very difficult as you have to compile the Vue app for production after any change to test it and this also then makes it impossible to leverage the Vue Devtools for debugging purposes.尝试像这样进行开发和调试非常困难,因为您必须在进行任何更改后编译 Vue 应用程序以进行生产测试,这也使得无法利用 Vue Devtools 进行调试。

If I serve the Vue application in dev mode this is via webpack so then the Vue application and the Rails application are served separately and are thus now on separate domains which leads to no session sharing, having to try to deal with CORS, etc...如果我在开发模式下为 Vue 应用程序提供服务,这是通过 webpack 提供的,那么 Vue 应用程序和 Rails 应用程序是分开提供的,因此现在位于不同的域上,这导致没有会话共享,不得不尝试处理 CORS 等。 .

There is an option in called proxyTable in the file config/index.js .config/index.js文件中有一个名为 proxyTable 的选项。

We were able to set the webpack root to proxy through the local Rails server by setting this option as proxyTable: {"/": "http://localhost:3000"}通过将此选项设置为proxyTable: {"/": "http://localhost:3000"} ,我们能够通过本地 Rails 服务器将 webpack 根设置为代理

3000 is the default port for a Rails dev server, but you may need to change this if you are running on a different port. 3000 是 Rails 开发服务器的默认端口,但如果您在不同的端口上运行,您可能需要更改此端口。

Get rid of webpacker, if you at all can.如果可以的话,摆脱 webpacker。 Vue can be used from cdn quite fine.可以很好地从 cdn使用 Vue。 When the vue app is instantiated in the rails template, data can be passed really easily with #{@model.to_json} .当在 rails 模板中实例化 vue 应用程序时,可以使用#{@model.to_json}非常轻松地传递数据。

Vue components can be written using x-template syntax, either in rails templates or asset pipeline. Vue 组件可以使用 x-template 语法在 rails 模板或资产管道中编写。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM