淺談linux 下，利用Nginx服務器代理實現ajax跨域請求。

時間 2019-11-10

標籤淺談 linux 利用 nginx 服務器代理實現 ajax 請求欄目 Linux 简体版

原文原文鏈接

ajax跨域請求對於前端開發者幾乎在任何一個項目中都會用到，衆所周知，跨域請求有三種方式：

jsonp;
XHR2
代理；

jsonp:

這種應該是開發中是使用的最多的，最多見的跨域請求方法，其實ajax自己是不能夠跨域的，經過產生一個script標來實現跨域。由於script標籤的src屬性是沒有跨域的限制的。javascript

其實設置了dataType: 'jsonp'後，$.ajax方法就和ajax XmlHttpRequest沒什麼關係了，取而代之的則是JSONP協議。JSONP是一個非官方的協議，它容許在服務器端集成Script tags返回至客戶端，經過javascript callback的形式實現跨域訪問。可是最大的缺點就是隻支持get方式，只支持get方式，只支持get方式php

實現原理：html

<script>
$(document).ready(function() {
var cache = {};
$("#demo").click(function(){
$.ajax({
type : "get",
async:false,
data:{"name":"test001","age":"100"},
url : "http://192.168.136.129/servertest.php", //跨域請求的URL
dataType : "jsonp",
//傳遞給請求處理程序，用以得到jsonp回調函數名的參數名(默認爲:callback)
jsonp: "callback",
//自定義的jsonp回調函數名稱，默認爲jQuery自動生成的隨機函數名
jsonpCallback:"success_jsonpCallback",
//成功獲取跨域服務器上的json數據後,會動態執行這個callback函數
success : function(json){
alert(json,name);
}
});
});
})
</script>

服務器端servertest.php代碼前端

<?php
$arr['id']=1;
$arr['name']="小明";
$data[]=$arr;
$arr['id']=2;
$arr['name']="小紅";
$data[]=$arr;
$data=json_encode($data);
$callback = $_GET['jsoncallback'];
echo $callback."(" .$data.")";

XHR2：

這是HTML5中提供的XMLHTTPREQUEST Level2（及XHR2），已經實現了跨域訪問。但ie10如下不支持，但ie10如下不支持，但ie10如下不支持，java

不過在於操做簡單，只須要在服務端填上響應頭：linux

header("Access-Control-Allow-Origin:*");
/*星號表示全部的域均可以接受，*/
header("Access-Control-Allow-Methods:GET,POST");

也許之後是一個趨勢。nginx

服務器代理：

這種方案估計用的最少，由於你首先得有一個代理服務器才行，對於小型項目來說，這個幾乎都不會去碰它，下面我就簡單介紹一下在linux下搭建nginx代理服務器。c++

我用的是 nginx-1.10.1.tar.gz 進行安裝，測試，ajax

安裝就不細說了，上傳包nginx-1.10.1.tar.gz和依賴zlib-1.2.8.tar.gz；pcre-8.39.tar.gz，掛載，json

安裝必要的依賴：

yum --disablerepo=\* --enablerepo=c6-media install gcc gcc-c++ openssl openssl-devel cyrus-sasl-md5

解壓

tar zxvf nginx-1.10.1.tar.gz
tar zxvf zlib-1.2.8.tar.gz
tar zxvf pcre-8.39.tar.gz

安裝：

cd nginx-1.10.1 //進入目錄

./configure --prefix=/usr/local/nginx --with-http_ssl_module --with-pcre=../pcre-8.39 --with-zlib=../zlib-1.2.8

//編譯安裝

make && make install

找到配置文件，Nginx.conf 修改必要端口（固然，你80沒用能夠不改）

代碼：

server {
    listen      8024;
    server_name  proxy.nginx.com;

    location  ~* ^/ajax/.* {
          #請求的主機域名;
          proxy_set_header Host $host;
          #轉的目標IP;
          proxy_set_header X-Real-IP $remote_addr;
          #轉發的目標
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          #禁止緩衝
          proxy_buffering off;
          proxy_pass http://192.168.136.126:8080;

            }
     }

重啓nginx：（nginx -s reload） (須要在/etc/profile文件中設置環境變量)

而後訪問：

http://proxy.nginx.com:8024/ajax/yyy (proxy.nginx.com是本身定義的虛擬主機名。可用localhost,看我的愛好)

http://proxy.nginx.com:8024/ajax/xxx?abc=123

都會被轉發到
http://192.168.136.126:8080/ajax/yyy
http://192.168.136.126:8080/ajax/xxx?abc=123

半夜寫的不容易，請輕拍！！

本人原文連接：http://www.cnblogs.com/shaozeming/articles/6072248.html