Vue+Express 实现跨域方法

素颜马尾好姑娘i 2022-04-05 21:07 298阅读 0赞

# 1.设置代理： #

-- **config／index.js **中，找到dev:\{ \}, 在这里面设置一个proxyTable

proxyTable: {
            '/api/':{
                target:'http://210.16.188.194:8090',
                changeOrinin:true,
                pathRewrite:{
                    '^/api':''
                }
            }
        },

**  参数：**

**target **: 写你需要访问的地址 比如说我需要访问的接口是这个下面的某个文件，我只需要写到端口号即可

**changeOrinin** : true  设置为true

然后就可以使用axios去请求了！      this.$axios.get('**api**/xxxxxxxxxxxxxxxxx').then(data=>\{\})....

--------------------

# 2.Node app.all（） #

**  代码：**

app.all('*',function (req, res, next) {
      res.header('Access-Control-Allow-Origin', 'http://localhost:8080');
      res.header('Access-Control-Allow-Headers', 'Content-Type');
      res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
    　next();　
    });

--------------------

# 3.Node cors #

**    安装cors包**

# npm install cors --save

**代码**

const cors = require('cors');  
    app.use(cors({  
        origin:['http://localhost:8080'],
        methods:['GET','POST'],
    }));

## 后端NodeJS获取自定义Header ##

通过`req.headers.自定义属性`获得自定义的头部数据

## 前端跨域二次请求 ##

当我们跨域使用自定义Header的时候，前端会发出两次HTTP请求，第一次类型为OPTION，以向后端验证“跨域中哪些Header可以拥有正常访问权限”，然后发出真正的第二次HTTP请求。

--------------------

Github：[https://github.com/Lil-El/Movie][https_github.com_Lil-El_Movie]

[https_github.com_Lil-El_Movie]: https://github.com/Lil-El/Movie

发表评论取消回复

表情：

评论列表（有 0 条评论，298人围观）

还没有评论，来说两句吧...

相关阅读

相关什么是跨域？跨域解决方法（重中之重）

跨域以前也不懂，但是慢慢就会理解了，咱们学习的前端大概一部分就是网站域名交互一、为什么会出现跨域问题出于浏览器的同源策略限制。同源策略（Same

秒速五厘米/ 2023年01月02日 11:22/ 0 赞/ 138 阅读

相关 beego实现跨域

使用路由过滤器实现跨域访问 /routers/router.go 的init方法中添加过滤器 beego.InsertFilter("", beego.Befor

左手的ㄟ右手/ 2022年12月29日 02:10/ 0 赞/ 164 阅读

相关如何实现跨域？

前言 -------------------- 跨域是个比较古老的命题了，历史上跨域的实现手段有很多，我们现在主要介绍三种比较主流的跨域方案，其余的方案我们就不深入讨论

你的名字/ 2022年12月02日 00:52/ 0 赞/ 172 阅读

相关什么是跨域？跨域解决方法

一.为什么会出现跨域问题出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器

小咪咪/ 2022年10月16日 02:56/ 0 赞/ 300 阅读

相关 [跨域]跨域解决方法之Ngnix反向代理

\[跨域\]跨域解决方法之Ngnix反向代理参考文章： [（1）\[跨域\]跨域解决方法之Ngnix反向代理][1_Ngnix] （2）https://www.cnbl

你的名字/ 2022年09月14日 09:56/ 0 赞/ 223 阅读

相关三种方法实现js跨域访问

三种方法实现js跨域访问收藏 [lwaif][] 发表于 1年前阅读 13181 收藏 30 点赞 0 [评论 0 ][0]

缺乏、安全感/ 2022年07月15日 15:21/ 0 赞/ 264 阅读

相关跨域方法总结

最近面试问的挺多的一个问题，就是JavaScript的跨域问题。在这里，对跨域的一些方法做个总结。由于浏览器的同源策略，不同域名、不同端口、不同协议都会构成跨域；但在实际的业务

快来打我*/ 2022年07月14日 08:07/ 0 赞/ 215 阅读

相关 ajax跨域方法

nginx url rewrite 在服务器端安装nginx服务，将H5前端的访问路径和java后端的访问路径放在一个域名下，由nginx根据url请求路径进行转发:

阳光穿透心脏的1/2处/ 2022年07月14日 00:30/ 0 赞/ 198 阅读

相关跨域sso实现

跨域sso实现一.server 1.提供登陆页面(login.jsp) 2.提供登陆校检的controller(checkLogin) 二.client1 1

水深无声/ 2022年06月17日 03:14/ 0 赞/ 205 阅读

相关 Vue+Express 实现跨域方法

1.设置代理： -- config／index.js 中，找到dev:\{ \}, 在这里面设置一个proxyTable proxyTable: {

素颜马尾好姑娘i/ 2022年04月05日 21:07/ 0 赞/ 299 阅读