使用nginx解决浏览器跨域问题

通过使用ajax方法跨域请求是浏览器所不允许的，浏览器出于安全考虑是禁止的。警告信息如下：

不过jQuery对跨域问题也有解决方案，使用jsonp的方式解决，方法如下：

$.ajax({ 
            async:false, 
            url: 'http://www.mysite.com/demo.do',  // 跨域URL
            type: 'GET', 
            dataType: 'jsonp', 
            jsonp: 'jsoncallback', //默认callback
            data: mydata, 
            timeout: 5000, 
            beforeSend: function(){  //jsonp 方式此方法不被触发。原因可能是dataType如果指定为jsonp的话，就已经不是ajax事件了
            },
            success: function (json) { //客户端jquery预先定义好的callback函数，成功获取跨域服务器上的json数据后，会动态执行这个callback函数 
                if(json.actionErrors.length!=0){ 
                    alert(json.actionErrors); 
                } 
                genDynamicContent(qsData,type,json); 
            }, 
            complete: function(XMLHttpRequest, textStatus){ 
                $.unblockUI({ fadeOut: 10 }); 
            }, 
            error: function(xhr){ 
                //jsonp 方式此方法不被触发
                //请求出错处理 
                alert("请求出错(请检查相关度网络状况.)"); 
            } 
        });

但是，此方法仅仅支持get方法，post方法是不支持的，因为jsonp的原理是使用script脚本引入的方法。

 

下面回归正题，使用nginx的反向代理解决跨域问题。

一、安装nginx。

点击下载nginx-1.17.0.zip

下载后解压目录如下：

nginx.exe为启动应用程序文件，双击可启动nginx服务器。双击后在浏览器访问localhost看到如下页面为启动成功。

conf为存放配置文件的目录。

 

二、配置nginx反向代理服务。

首先，需要在nginx.conf上进行配置

 

注意：nginx的绝对路径不能存在中文哦。