跨域访问（ajax+nginx）

最新推荐文章于 2022-10-07 01:13:44 发布

liu5672934shuai

最新推荐文章于 2022-10-07 01:13:44 发布

阅读量790

点赞数

分类专栏： java 文章标签： nginx ajax 跨域

本文链接：https://blog.csdn.net/liu5672934shuai/article/details/53120779

版权

java 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

1.配置nginx的location
列如：

location /onePriceLog {
        index  index.html;
            proxy_pass http://192.168.128.110:81/admin/trans/onePriceLog.f;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        client_max_body_size    10m;
        proxy_redirect off;
        }

2.写ajax，这里提供一个原生态的封装

var xmlhttp;
function loadXMLDoc(url)
{
xmlhttp=null;
if (window.XMLHttpRequest)
  {// code for Firefox, Opera, IE7, etc.
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
if (xmlhttp!=null)
  {
  xmlhttp.onreadystatechange=state_Change;
  xmlhttp.open("POST",url,true);
  xmlhttp.send("");
  }
else
  {
  alert("Your browser does not support XMLHTTP.");
  }
}

function state_Change()
{
if (xmlhttp.readyState==4)
  {// 4 = "loaded"
  if (xmlhttp.status==200)
    {// 200 = "OK"，业务



    }
  else
    {
    //alert("Problem retrieving data:" + xmlhttp.statusText);
    }
  }
}

3.调用封装函数

loadXMLDoc("/onePriceLog?transTargetId="+pageObj.targetId);

这里做一下简单说明，比如我们在A程序（无法修改其代码，只能修改页面，因为程序不是我们开发的，拿不到源代码，哈哈，所以只能苦逼的修改页面）里面请求另外一个程序B（这个是小猿开发的）里面的内容，请求列如是http://221.224.76.18:8089/admin/trans/onePriceLog.f，这个时候如果直接在A页面加载请求就会发生跨域问题，如果是通过nginx就很巧妙的把http://221.224.76.18:8089/admin/trans/onePriceLog.f这个请求转化成B程序的**/onePriceLog请求。就可以避免跨域访问。相当于把A和B的域合成一个C域，这样就不存在跨域问题了。
http://221.224.76.18:8089/admin/trans/onePriceLog.f=/onePriceLog
“`