nodejs+express解决跨域问题,发现网上的大部分都是误导人,花了不少时间,终于弄懂了,

我在vue+nodejs+express+mongodb的项目里面,发现本地用vue代理正常调用远程的nodejs api接口,但是放在云服务器上之后,就出现了跨域问题,因为vue代理在线上已经无效了。

在nodejs的express里的app.js添加全局路由,即可解决vue线上项目的跨域问题,如下:

res.header("Access-Control-Allow-Origin", " * ");,这个就会报以下的错误:

res.header("Access-Control-Allow-Credentials", "true");,如果没有这段代码,解决跨域就无效,一定要加上,注意true是字符串:

res.header("Access-Control-Allow-Headers", "Content-Type,username");,这是req.headers的字段,比如username,一定要用,逗号隔开,若没有加上前端传过来的headers里的username会报以下错误:

												

vue+nodejs+express解决跨域问题的更多相关文章

  1. vue webpack配置解决跨域问题

    现在基本项目都是实行前后端分离的原则,不管是ng 或者是vue 在开发中都无法避免跨域的这个问题 本人刚上手第一个vue项目,在调用api的时候出现了跨域的这个问题 这是封装好一个简单的post 请求 ...

  2. vue 使用 proxyTable 解决跨域问题

    1.在 main.js 中,在引入 axios: import axios from 'axios' Vue.config.productionTip = false Vue.prototype.$a ...

  3. vue反向代理解决跨域

    问题描述 在项目开发的时候,接口联调的时候一般都是同域名下,且不存在跨域的情况下进行接口联调,但是当我们现在使用vue-cli进行项目打包的时候,我们在本地启动服务器后,比如本地开发服务下是 http ...

  4. vue.js vue-jsonp解决跨域问题

    安装jsonp npm install vue-jsonp --save main.js中引入 import VueJsonp from 'vue-jsonp' Vue.use(VueJsonp) 组 ...

  5. vue项目中解决跨域问题axios和

    项目如果是用脚手架搭建的(vue cli)项目配置文件里有个proxyTable proxyTable是vue-cli搭建webpack脚手架中的一个微型代理服务器,配置如下 配置和安装axios 安 ...

  6. vue.js 本地解决跨域

    1.config/index.js下添加proxyTable dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', ...

  7. 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)

    前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...

  8. vue开发环境和生产环境里面解决跨域的几种方法

    什么是跨域   跨域指浏览器不允许当前页面的所在的源去请求另一个源的数据.源指协议,端口,域名.只要这个3个中有一个不同就是跨域. 这里列举一个经典的列子: #协议跨域 http://a.baidu. ...

  9. 搞懂:前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

    什么是跨域 跨域:一个域下的文档或脚本试图去请求另一个域下的资源 广义的跨域包含一下内容: 1.资源跳转(链接跳转,重定向跳转,表单提交) 2.资源请求(内部的引用,脚本script,图片img,fr ...

随机推荐

  1. 虚拟机下Linux网络配置

    之前配置好了linux系统,在网络这块我用的是桥接模式. 现在分享一下使用虚拟机桥接模式配置Linux网络的过程. 一.首先配置外网的本地Ip地址. 二.配置Linux 网络链接 1.打开linux网 ...

  2. x component of 2nd stokes wave--- C code

    * Source code The following is a C code for x component of 2nd stokes wave ××××××××××××××××××××× /*s ...

  3. stm32实现iap远程固件更新

    前提 想来做iap升级了,应该不是什么新手. 下面的程序需要用到一些简单的功能 串口收发数据开关总中断虽然本文标题是实现远程固件更新,但是具体远程方案本文不做详细说明,重点在于介绍mcu接收到新的固件 ...

  4. WINDOWS下调用GetTokenInformation的奇怪之处--两次调用

    就是用getLastErr可以得到错误号,同时,会将需要的长度写到参数里,再进行第二次调用,以此来节约内存空间. 神奇的长见识了. 相关说法如下: ====================== The ...

  5. 试来试去,WIN下最简单的WIN API开发工具,Pelles C就好啦

    昨晚试过N个,不是太大,就是不容易和WIN API集成. 今早一试就灵了个.... Pelles C. Pelles C是一款windows下的C IDE,支持调试,且为免费.它有一个高效率的链接器, ...

  6. 洛谷—— P2047 社交网络

    P2047 社交网络 题目描述 在社交网络(social network)的研究中,我们常常使用图论概念去解释一些社会现象.不妨看这样的一个问题.在一个社交圈子里有n个人,人与人之间有不同程度的关系. ...

  7. iOS消息推送原理和实现总结

    一.消息推送原理: 在实现消息推送之前先提及几个于推送相关概念,如下图:1. Provider:就是为指定IOS设备应用程序提供Push的服务器,(如果IOS设备的应用程序是客户端的话,那么Provi ...

  8. DATASNAP压缩过滤器的使用

    ZLIBCOMPRESSION FILTER 作为范例,我们使用已随D2010提供的DataSnap过滤器.可用于在客户端和服务端压缩数据流.这里说的ZlibCompression过滤器可以在DbxC ...

  9. git 手动操作

    git 手动操作 以下所有的情况都需要在上面那个目录下: 查看改动: git status // 所有改动都在这里. 提交代码: git add <file_name> // 把代码放到 ...

  10. gem5: 使用ruby memory system中的mesh结构 出现AssertionError错误

    问题:在使用ruby memory system中的mesh结构測试时,出现例如以下错误: Traceback (most recent call last): File "<stri ...