gulp的proxy代理无法将数据传输到服务端,怎么办??

发布于 2017-05-06 01:52:54 字数 1691 浏览 1453 评论 2

使用gulp的gulp-connect和gulp-connect-proxy配置了代理服务,传输到服务端解决了跨域,但是服务端接收的参数为空,返回参数错误,相同的jquery的ajax请求在使用nginx的反向代理服务数据传输到服务端能否正常接收数据并处理,以下是相关代码,麻烦大神能够帮忙解决以下,先谢谢了。(由于保密关系服务端地址就不贴上了,其他代码都在这里了)

补充:

  1. 本地向服务端传送的数据是text格式,服务端接收字符串自己转换,发现被gulp-connect-proxy代理后没有向服务端传输http请求的body,只是传输了url,所以导致无法传输数据,解决办法是将数据拼接到url后面,但是这导致了补充的第二点。

  2. url后面拼接数据虽然实现了向服务端传输数据,但是我有一个请求传输的是json字符串,结果在代理过程中被截取了,导致只传输一半数据,构不成json导致传输失败,希望有大神能告诉一下原因;

gulp相关配置:

var host = {
    // 默认开发输出目录
    path: 'www/',
    // 默认源目录
    devUrl:"src/",
    // 设置服务端口
    port: 8080,
    html: 'index.html',
    proxy:'/proxy'
};
//使用connect启动一个Web服务器
gulp.task('connect', function() {
    connect.server({
        root: host.path,
        port: host.port,
        livereload: true,
        middleware: function (connect, opt) {
            opt.route = host.proxy;
            opt.changeOrigin = true;
            opt.ws = true;
            // opt.origin = 'localhost:9090';
            var proxy = new Proxy(opt);
            return [proxy];
        }
    });
});

页面请求参数:

// nginx端口配置
// var url = "/msgget/";
// gulp端口配置
var  url = "/proxy/域名:端口号/";
var getmsg= "token=310239ifjsie1&&mxx=13131";
$.ajax({
    url: url+"getCart",
    type: 'post',
    dataType: 'text',
    data: getmsg,
}).done(function(res){
    res = JSON.parse(res);
    //使用nginx配置数据正常获取,使用gulp配置解决了跨域但是数据没有传输到服务端
});

nginx配置:

location /msgget/{
    proxy_set_header Host $host;
    proxy_set_header X-Real-Ip $remote_addr;
    proxy_set_header X-Forwarded-For $remote_addr;
    proxy_pass  http://域名:端口号/;
}

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

夜无邪 2017-05-06 01:52:58

1楼回答的没用

该答案已被忽略,原因:不符合答题规范,内容不是答案,可用评论、投票替代

瑾兮 2017-05-06 01:52:54

今天仔细看了一下gulp-conncet-proxy的源码,发现它只支持在url上面拼接数据,而不支持jquery的ajax函数的data参数
在gulp-connect-proxy的主文件index.js的第9行有下面这一句话
var options = url.parse('http://' + localRequest.url.slice(1));
通过测试,如果使用jquery.ajax的data参数虽然请求发送到服务器但是数据并没有传输过去,将数据序列化后拼接到url后面则可以接收到服务端返回的正确数据。
另外在补充2中字符串被截取是jquery做的,我仔细检查了自己的数据,发现截取位置是 # 位置,应该是jquery认为页面是含有hash值的标识#而进行了截取。接下来验证gulp-connect-proxy是否只能进行get代理(无论get还是post请求都转换为get请求)
经过服务端的配合验证结果如下:
gulp-connect-proxy插件代理流程:
1. 页面发送请求,数据必须放在url中
2. 插件收到请求截取到url中真正的请求(包含数据字符串)转发到目标地址

重点:gulp-connect-proxy将所有的请求都转换为get请求处理,所以当目标地址不允许get请求时会收到405错误。
最新解决方案:由于gulp-connect-proxy只能代理get请求,经过查找发现proxy-middleware能够解决post请求,而且写法与nginx配置是兼容的,这样在本地使用gulp,生产环境用nginx完美兼容
var connect = require('gulp-connect'),
url = require('url'),
proxy = require('proxy-middleware');

var proxyOptions = url.parse('http://服务端地址');
proxyOptions.route = '/api';
....
....
gulp.task('connect', function() {
connect.server({
root: host.path,
port: host.port,
livereload: true,
middleware: function (connect, opt) {
return [
proxy(proxyOptions)
]
}
});
});

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文