利用nginx反向代理来避免ajax跨域请求

CompileYouth 发布于2019-07-25 13:43 / 1237人阅读

摘要：遇到了前端跨域请求的问题。所以机智的我想到了，这家伙不就是拿来搞反向代理的吗真是机智如我有了这个思路，做起来就简单了。直接在监听端口的中添加一个重新加载然后就把之前的跨域请求变成了的非跨域请求。

在慕课网上看了高并发的课程，准备用spring+Mybaits来开发新的项目。遇到了前端跨域请求的问题。

服务器上nginx+tomcat，其中nginx监听80端口，tomcat监听8080端口。

因为对前端不熟悉，以为用ajax就可以不需要callback，然而前端的同学说不跨域的情况下才不需要callback，让我在返回的json里加上。可是我刚刚学会了最基本的spring-mvc用法，根本不知道怎么加上callback

网上到时找到一些可行的代码，差不多这个样子：

来源：http://quarterlifeforjava.ite...

    @RequestMapping(method=RequestMethod.GET,value="getProjectStatusList",produces="text/html;charset=UTF-8")
    @ResponseBody
    public String getProjectStatusList(HttpServletRequest request, 
                                     HttpServletResponse response){
        
        
        Map map = new HashMap();
        try{
            String callback = request.getParameter("callback");
            //System.out.println("token:"+request.getHeader("token"));
            List list = ss.getProjectStatusList();
            map.put("status", "success");
            map.put("data", list);
            ObjectMapper mapper = new ObjectMapper();
            //这个拼接是重点。。。
         String result = callback+"("+mapper.writeValueAsString(map)+")";
            //String result = mapper.writeValueAsString(map);
            return result;
        }catch(Exception e){
            JSONObject jo = new JSONObject();
            jo.put("status", "fail");
            jo.put("data", e.getMessage());
            return jo.toString();
        }
    }

然而这样改动对我来说简直是伤筋动骨，因为我有太多的URL映射，修改的成本太大。

所以机智的我想到了nginx，这家伙不就是拿来搞反向代理的吗？真是机智如我

有了这个思路，做起来就简单了。直接在监听80端口的server中添加一个location：

location /myApp {
  proxy_pass  http://localhost:8080/myApp;
}

重新加载nginx：

{NGINX_HOME}/sbin/nginx -s reload

然后就把之前http://site:8080/myApp的跨域请求变成了http://site/myApp的非跨域请求。

好吧，都是我猜的，等前端同学来验证我的想法了

忘了更新了

下午实验课自己写了个ajax请求试了下，这个思路是没有问题的

$.ajax({url : "/myApp/list", async : true}).success( function (data) {
  console.log(data);
});

打印结果：

Object {data: Array[8], success: true, errorMsg: null}

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/39305.html

Nginx

摘要：此外，其也能够提供强大的反向代理功能。是由为俄罗斯访问量第二的站点开发的，第一个公开版本发布于年月日。 keepalived+nginx 实现高可用双机热备 + 负载均衡架构 1 准备4个ubuntu16.04虚拟机（启用网卡二并使用桥接模式）:A服务器：192.168.0.103 主B服务器：192.168.0.104 主（备）前端工程师学习 Nginx ...

syoya 2019-07-25 14:06 评论0 收藏0
通过nginx反向代理解决前端访问的跨域问题

摘要：三反向代理解决的原理将安装在本地，然后将项目部署于下，这样访问本地项目时用本地项目即可访问。这样浏览器之间的请求完全满足浏览器域名协议端口相同的同源策略，可在不改变后台接口的情况下避免跨域问题。一、问题背景说明：编写移动前端页面时需要访问后台系统接口。前端项目在本地（个人办公电脑）开发，后台接口存放后生产的后台服务器，本地的ajax请求无法直接访问后台接口，也就是遇到了跨域问题...

dongxiawu 2019-08-23 11:39 评论0 收藏0
通过nginx反向代理解决前端访问的跨域问题

摘要：三反向代理解决的原理将安装在本地，然后将项目部署于下，这样访问本地项目时用本地项目即可访问。这样浏览器之间的请求完全满足浏览器域名协议端口相同的同源策略，可在不改变后台接口的情况下避免跨域问题。一、问题背景说明：编写移动前端页面时需要访问后台系统接口。前端项目在本地（个人办公电脑）开发，后台接口存放后生产的后台服务器，本地的ajax请求无法直接访问后台接口，也就是遇到了跨域问题...

paulquei 2019-07-25 14:26 评论0 收藏0