什么是跨域

跨域，指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本。它是由瀏覽器的同源策略造成的，是瀏覽器對javascript施加的安全限制。

所謂同源是指，域名，協(xié)議，端口相同。瀏覽器執(zhí)行javascript腳本時，會檢查這個腳本屬于那個頁面，如果不是同源頁面，就不會被執(zhí)行。

同源策略的目的，是防止黑客做一些做奸犯科的勾當。比如說，如果一個銀行的一個應用允許用戶上傳網(wǎng)頁，如果沒有同源策略，黑客可以編寫一個登陸表單提交到自己的服務器上，得到一個看上去相當高大上的頁面。黑客把這個頁面通過郵件等發(fā)給用戶，用戶誤認為這是某銀行的主網(wǎng)頁進行登陸，就會泄露自己的用戶數(shù)據(jù)。而因為瀏覽器的同源策略，黑客無法收到表單數(shù)據(jù)。

現(xiàn)在隨著RESTFUL的流行，很多應用提供http/https接口的ApI，通過xml/json格式對外提供服務，實現(xiàn)開放架構。如，微博、微信、天氣預報、openstack等網(wǎng)站和應用都提供restful接口。

Web應用也在向單頁面方向發(fā)展。越來越多的web應用現(xiàn)在是這樣的架構：

靜態(tài)單個web頁面

ajax調(diào)用

RESTFUL服務

我們本可以利用各個網(wǎng)站提供的ApI，做出很多精彩的Web應用。但瀏覽器執(zhí)行javascript時的跨域限制，就成為了這類開放架構的攔路虎。

本文提出了一種簡單有效的方式解決跨域問題。

常用的跨域方法

常用的跨域方法有這樣一些：

1，使用iFrame訪問另一個域。然后再從另一個頁面讀取iFrame的內(nèi)容。jquery等有一些封裝。據(jù)說Firefox等可能不支持讀取另一個iFrame的內(nèi)容。

2，jsonp。需要服務器支持。使用script src動態(tài)得到一段java代碼。是回調(diào)頁面上的js函數(shù)，參數(shù)是一個json對象。jquery也有封裝。

3，設置http頭，Access-Control-Allow-Origin：*但據(jù)說IE有一些版本不識別這個http頭。

4，服務器代理。如，服務器寫一個url的處理action。其參數(shù)是一個url。這個服務器會用參數(shù)拼湊一個url,用httpclient庫去執(zhí)行url，然后把讀取的內(nèi)容再輸出到http客戶端。

nginx反向代理實現(xiàn)跨域

上面提到的這些跨域方法，都有一些問題。有的不能支持所有瀏覽器，有的需要修改javascript代碼，有的需要重寫服務器端代碼。有的在session等場景下會有問題。

其實，用nginx反向代理實現(xiàn)跨域，是最簡單的跨域方式。只需要修改nginx的配置即可解決跨域問題，支持所有瀏覽器，支持session，不需要修改任何代碼，并且不會影響服務器性能。

我 們只需要配置nginx，在一個服務器上配置多個前綴來轉發(fā)http/https請求到多個真實的服務器即可。這樣，這個服務器上所有url都是相同的域 名、協(xié)議和端口。因此，對于瀏覽器來說，這些url都是同源的，沒有跨域限制。而實際上，這些url實際上由物理服務器提供服務。這些服務器內(nèi)的 javascript可以跨域調(diào)用所有這些服務器上的url。

下面，給出一個nginx支持跨域的例子，進行具體說明。

如，我們有兩個pythonflask開發(fā)的項目：testFlask1和testFlask2。

testFlask2項目上的javascript腳本要通過ajax方式調(diào)用testFlask1的一個url，獲取一些數(shù)據(jù)。

正常情況下部署，就會有跨域問題，瀏覽器拒絕執(zhí)行如下這樣的調(diào)用。

$("button").click(function(){
   $.get("127.0.0.1:8081/partners/json",
   function(result){
      $("div").html(result);
   });
});

下面把testFlask2項目的javascrip文件修改一下。這樣訪問同源的url，就不會有跨域問題。

$("button").click(function(){
    $.get("partners/json", function(result){
            $("div").html(result);
    });
});

但是，我們testFlask2項目實際上沒有partners/json這樣的url，那怎么處理呢？

我們這樣編寫nginx的配置文件：

server{
    listen8000;
    location/ {
        includeuwsgi_params;
        uwsgi_passunix:/tmp/testFlask2.sock;
    }
    location/partners {
        rewrite^.+partners/?(.*)$ /$1 break;
        includeuwsgi_params;
        uwsgi_passunix:/tmp/testFlask1.sock;
    }
}

我們把testFlask2項目部署在8080端口的根目錄下。把提供web服務的testFlask1項目部署在/partners目錄下。

但我們的testFlask1項目并不能處理/partners/json這樣的url請求。那怎么辦呢？

通過 rewrite^.+partners/?(.*)$ /$1 break; 這一條命令，nginx可以把收到的/partners/*請求全部轉為/*請求后再轉發(fā)給背后的真實web服務器。

這樣，RESTFUL的ajax客戶端程序，只需要給出特定前綴的url就可以調(diào)用任意服務器提供的RESTFUL接口了。

甚至，通過nginx的反向代理，我們還能調(diào)用其他公司開發(fā)的網(wǎng)站提供的RESTFUL接口。

如，

location/sohu {
    rewrite^.+sohu/?(.*)$ /$1 break;
    includeuwsgi_params;
    proxy_passhttp://www.sohu.com/;
}

我們就把sohu網(wǎng)站整個搬到我們的8080:/sohu/目錄下了，我們的javascript就可以盡情調(diào)用其RESTFUL服務了。

順便說一下，rewrite^.+sohu/?(.*)$ /$1 break; 這句命令中，$1表示(.*)這個部分。第一對()內(nèi)的參數(shù)是$1，第二對()內(nèi)的參數(shù)就是$2，以此類推。

總結

本文介紹了利用nginx的反向代理的功能，實現(xiàn)跨域訪問任意應用和網(wǎng)站的方法。

nginx是一個高性能的web服務器，常用作反向代理服務器。nginx作為反向代理服務器，就是把http請求轉發(fā)到另一個或者一些服務器上。

通過把本地一個url前綴映射到要跨域訪問的web服務器上，就可以實現(xiàn)跨域訪問。

對于瀏覽器來說，訪問的就是同源服務器上的一個url。而nginx通過檢測url前綴，把http請求轉發(fā)到后面真實的物理服務器。并通過rewrite命令把前綴再去掉。這樣真實的服務器就可以正確處理請求，并且并不知道這個請求是來自代理服務器的。

簡單說，nginx服務器欺騙了瀏覽器，讓它認為這是同源調(diào)用，從而解決了瀏覽器的跨域問題。又通過重寫url，欺騙了真實的服務器，讓它以為這個http請求是直接來自于用戶瀏覽器的。

這樣，為了解決跨域問題，只需要動一下nginx配置文件即可。簡單、強大、高效!

*聲明：本文于網(wǎng)絡整理，版權歸原作者所有，如來源信息有誤或侵犯權益，請聯(lián)系我們刪除或授權事宜

分享文章：pHp跨域方法用Nginx反向代理
網(wǎng)站URL：http://www.rwnh.cn/news0/298050.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供標簽優(yōu)化、用戶體驗、ChatGPT、App設計、動態(tài)網(wǎng)站、自適應網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)