ajax跨域方法？

Ajax 是一種獨(dú)立于 Web 服務(wù)器軟件的瀏覽器技術(shù)，Ajax不需要任何瀏覽器插件，但需要用戶允許javascript在瀏覽器上執(zhí)行，那ajax為什么不能跨域?下面來(lái)我們就來(lái)給大家講解一下。

解決方式1：響應(yīng)頭添加Header允許訪問(wèn)

跨域資源共享(CORS)Cross-Origin Resource Sharing

這個(gè)跨域訪問(wèn)的解決方案的安全基礎(chǔ)是基于"Javascript無(wú)法控制該HTTP頭"

它需要通過(guò)目標(biāo)域返回的HTTP頭來(lái)授權(quán)是否允許跨域訪問(wèn)。

response.addHeader(‘Access-Control-Allow-Origin:*’);//允許所有來(lái)源訪問(wèn)
response.addHeader(‘Access-Control-Allow-Method:POST,GET’);//允許訪問(wèn)的方式

解決方式2：jsonp 只支持get請(qǐng)求不支持post請(qǐng)求

用法：

①dataType改為jsonp 

②jsonp : "jsonpCallback"————發(fā)送到后端實(shí)際為http://a.a.com/a/FromServlet?userName=644064&jsonpCallback=jQueryxxx

③后端獲取get請(qǐng)求中的jsonpCallback 

④構(gòu)造回調(diào)結(jié)構(gòu)

$.ajax(
{
    type: "GET"
    , async: false
    , url: "http://a.a.com/a/FromServlet?userName=644064"
    , dataType: "jsonp", //數(shù)據(jù)類型為jsonp
    jsonp: "jsonpCallback", //服務(wù)端用于接收callback調(diào)用的function名的參數(shù)
    success: function (data)
    {
        alert(data["userName"]);
    }
    , error: function ()
    {
        alert('fail');
    }
});

//后端
String jsonpCallback = request.getParameter("jsonpCallback");
//構(gòu)造回調(diào)函數(shù)格式j(luò)sonpCallback(數(shù)據(jù))
resp.getWriter()
    .println(jsonpCallback + "(" + jsonObject.toJSonString() + ")");

解決方式3：httpClient內(nèi)部轉(zhuǎn)發(fā)

實(shí)現(xiàn)原理很簡(jiǎn)單，若想在B站點(diǎn)中通過(guò)Ajax訪問(wèn)A站點(diǎn)獲取結(jié)果，固然有ajax跨域問(wèn)題，但在B站點(diǎn)中訪問(wèn)B站點(diǎn)獲取結(jié)果，不存在跨域問(wèn)題，這種方式實(shí)際上是在B站點(diǎn)中ajax請(qǐng)求訪問(wèn)B站點(diǎn)的HttpClient，再通過(guò)HttpClient轉(zhuǎn)發(fā)請(qǐng)求獲取A站點(diǎn)的數(shù)據(jù)結(jié)果。但這種方式產(chǎn)生了兩次請(qǐng)求，效率低，但內(nèi)部請(qǐng)求，抓包工具無(wú)法分析，安全。

$.ajax(
{
    type: "GET"
    , async: false
    , url: "http://b.b.com:8080/B/FromAjaxservlet?userName=644064"
    , dataType: "json"
    , success: function (data)
    {
        alert(data["userName"]);
    }
    , error: function ()
    {
        alert('fail');
    }
});

@WebServlet("/FromAjaxservlet")
public class FromAjaxservlet extends HttpServlet
{
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException
    {
        try
        {
            //創(chuàng)建默認(rèn)連接
            CloseableHttpClient httpClient = HttpClients.createDefault();
            //創(chuàng)建HttpGet對(duì)象,處理get請(qǐng)求,轉(zhuǎn)發(fā)到A站點(diǎn)
            HttpGet httpGet = new HttpGet("http://a.a.com:8080/A/FromServlet?userName=" + req.getParameter("userName"));
            //執(zhí)行
            CloseableHttpResponse response = httpClient.execute(httpGet);
            int code = response.getStatusLine()
                .getStatusCode();
            //獲取狀態(tài)
            System.out.println("http請(qǐng)求結(jié)果為:" + code);
            if (code == 200)
            {
                //獲取A站點(diǎn)返回的結(jié)果
                String result = EntityUtils.toString(response.getEntity());
                System.out.println(result);
                //把結(jié)果返回給B站點(diǎn)
                resp.getWriter()
                    .print(result);
            }
            response.close();
            httpClient.close();
        }
        catch (Exception e)
        {}
    }
}

解決方式4：使用nginx搭建企業(yè)級(jí)接口網(wǎng)關(guān)方式

www.a.a.com不能直接請(qǐng)求www.b.b.com的內(nèi)容，可以通過(guò)nginx，根據(jù)同域名，但項(xiàng)目名不同進(jìn)行區(qū)分。什么意思呢?這么說(shuō)可能有點(diǎn)抽象。假設(shè)我們公司域名叫www.nginxtest.com

當(dāng)我們需要訪問(wèn)www.a.a.com通過(guò)5b6b40z.cn/A訪問(wèn)，并通過(guò)nginx轉(zhuǎn)發(fā)到www.a.a.com

當(dāng)我們需要訪問(wèn)www.b.b.com通過(guò)www.funengwang.com/B訪問(wèn)，并通過(guò)nginx轉(zhuǎn)發(fā)到www.a.a.com

我們?cè)L問(wèn)公司的域名時(shí)，是"同源"的，只是項(xiàng)目名不同，此時(shí)項(xiàng)目名的作用只是為了區(qū)分，方便轉(zhuǎn)發(fā)。如果你還不理解的話，先看看我是怎么進(jìn)行配置的：

server
{
    listen 80;
    server_name 5b6b40z.cn;
    location / A
    {
        proxy_pass http: //a.a.com:81;
            index index.html index.htm;
    }
    location / B
    {
        proxy_pass http: //b.b.com:81;
            index index.html index.htm;
    }
}

我們?cè)L問(wèn)以www.funengwang.com開(kāi)頭且端口為80的網(wǎng)址，nginx將會(huì)進(jìn)行攔截匹配，若項(xiàng)目名為A，則分發(fā)到a.a.com:81。實(shí)際上就是通過(guò)"同源"的域名，不同的項(xiàng)目名進(jìn)行區(qū)分，通過(guò)nginx攔截匹配，轉(zhuǎn)發(fā)到對(duì)應(yīng)的網(wǎng)址。整個(gè)過(guò)程，兩次請(qǐng)求，第一次請(qǐng)求nginx服務(wù)器，第二次nginx服務(wù)器通過(guò)攔截匹配分發(fā)到對(duì)應(yīng)的網(wǎng)址。

Ajax不能跨域我們可以使用以上這種方法去解決，實(shí)現(xiàn)不同的域之間相互請(qǐng)求資源。最后大家如果想要了解更多其他工具教程知識(shí)，敬請(qǐng)關(guān)注java相關(guān)欄目。

本文鏈接：

本文章“ajax跨域方法？”已幫助 195 人

免責(zé)聲明：本信息由用戶發(fā)布，本站不承擔(dān)本信息引起的任何交易及知識(shí)產(chǎn)權(quán)侵權(quán)的法律責(zé)任！

本文由賦能網(wǎng) 整理發(fā)布。了解更多培訓(xùn)機(jī)構(gòu)》培訓(xùn)課程》學(xué)習(xí)資訊》課程優(yōu)惠》課程開(kāi)班》學(xué)校地址等機(jī)構(gòu)信息，可以留下您的聯(lián)系方式，讓課程老師跟你詳細(xì)解答：
咨詢熱線：4008-569-579