建站
咨詢
售后
建站咨詢
新聞中心
作者個(gè)人研發(fā)的在高并發(fā)場(chǎng)景下，提供的簡(jiǎn)單、穩(wěn)定、可擴(kuò)展的延遲消息隊(duì)列框架，具有精準(zhǔn)的定時(shí)任務(wù)和延遲隊(duì)列處理功能。自開源半年多以來，已成功為十幾家中小型企業(yè)提供了精準(zhǔn)定時(shí)調(diào)度方案，經(jīng)受住了生產(chǎn)環(huán)境的考驗(yàn)。為使更多童鞋受益，現(xiàn)給出開源框架地址：https://github.com/sunshinelyz/mykit-delay
創(chuàng)新互聯(lián)建站服務(wù)項(xiàng)目包括長(zhǎng)安網(wǎng)站建設(shè)、長(zhǎng)安網(wǎng)站制作、長(zhǎng)安網(wǎng)頁(yè)制作以及長(zhǎng)安網(wǎng)絡(luò)營(yíng)銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，長(zhǎng)安網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到長(zhǎng)安省份的部分城市，未來相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！
寫在前面
當(dāng)今互聯(lián)網(wǎng)行業(yè)，大部分Web項(xiàng)目基本都是采用的前后端分離模式。前端為H5項(xiàng)目，后端為Java、PHP、Python等項(xiàng)目。而且大部分后端服務(wù)并不會(huì)只部署一套服務(wù)，而是會(huì)采用Nginx對(duì)后端服務(wù)進(jìn)行負(fù)載均衡。那么，此時(shí)就會(huì)出現(xiàn)一個(gè)問題了：如果一個(gè)請(qǐng)求url的 協(xié)議、域名、端口 三者之間任意一個(gè)與當(dāng)前頁(yè)面url不同就會(huì)產(chǎn)生跨域的現(xiàn)象。那么如何使用Nginx解決跨域問題呢?接下來，我們就一起探討下這個(gè)問題。
為何會(huì)跨域?
出于瀏覽器的同源策略限制。同源策略(Sameoriginpolicy)是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會(huì)受到影響?？梢哉fWeb是構(gòu)建在同源策略基礎(chǔ)之上的，瀏覽器只是針對(duì)同源策略的一種實(shí)現(xiàn)。同源策略會(huì)阻止一個(gè)域的javascript腳本和另外一個(gè)域的內(nèi)容進(jìn)行交互。所謂同源(即指在同一個(gè)域)就是兩個(gè)頁(yè)面具有相同的協(xié)議(protocol)，主機(jī)(host)和端口號(hào)(port)。
Nginx如何解決跨域?
這里，我們利用Nginx的反向代理功能解決跨域問題，至于，什么是Nginx的反向代理，大家就請(qǐng)自行百度或者谷歌吧。
Nginx作為反向代理服務(wù)器，就是把http請(qǐng)求轉(zhuǎn)發(fā)到另一個(gè)或者一些服務(wù)器上。通過把本地一個(gè)url前綴映射到要跨域訪問的web服務(wù)器上，就可以實(shí)現(xiàn)跨域訪問。對(duì)于瀏覽器來說，訪問的就是同源服務(wù)器上的一個(gè)url。而Nginx通過檢測(cè)url前綴，把http請(qǐng)求轉(zhuǎn)發(fā)到后面真實(shí)的物理服務(wù)器。并通過rewrite命令把前綴再去掉。這樣真實(shí)的服務(wù)器就可以正確處理請(qǐng)求，并且并不知道這個(gè)請(qǐng)求是來自代理服務(wù)器的。
Nginx解決跨域案例
使用Nginx解決跨域問題時(shí)，我們可以編譯Nginx的nginx.conf配置文件，例如，將nginx.conf文件的server節(jié)點(diǎn)的內(nèi)容編輯成如下所示。
- server {
- location / {
- root html;
- index index.html index.htm;
- //允許cros跨域訪問
- add_header 'Access-Control-Allow-Origin' '*';
- }
- //自定義本地路徑
- location /apis {
- rewrite ^.+apis/?(.*)$ /$1 break;
- include uwsgi_params;
- proxy_pass http://www.binghe.com;
- }
- }
然后我把項(xiàng)目部署在nginx的html根目錄下，在ajax調(diào)用時(shí)設(shè)置url從http://www.binghe.com/apistest/test 變?yōu)?http://www.binghe.com/apis/apistest/test然后成功解決。
假設(shè)，之前我在頁(yè)面上發(fā)起的Ajax請(qǐng)求如下所示。
- $.ajax({
- type:"post",
- dataType: "json",
- data:{'parameter':JSON.stringify(data)},
- url:"http://www.binghe.com/apistest/test",
- async: flag,
- beforeSend: function (xhr) {
- xhr.setRequestHeader("Content-Type", submitType.Content_Type);
- xhr.setRequestHeader("user-id", submitType.user_id);
- xhr.setRequestHeader("role-type", submitType.role_type);
- xhr.setRequestHeader("access-token", getAccessToken().token);
- },
- success:function(result, status, xhr){
- }
- ,error:function (e) {
- layerMsg('請(qǐng)求失敗，請(qǐng)稍后再試')
- }
- });
修改成如下的請(qǐng)求即可解決跨域問題。
- $.ajax({
- type:"post",
- dataType: "json",
- data:{'parameter':JSON.stringify(data)},
- url:"http:www.binghe.com/apis/apistest/test",
- async: flag,
- beforeSend: function (xhr) {
- xhr.setRequestHeader("Content-Type", submitType.Content_Type);
- xhr.setRequestHeader("user-id", submitType.user_id);
- xhr.setRequestHeader("role-type", submitType.role_type);
- xhr.setRequestHeader("access-token", getAccessToken().token);
- },
- success:function(result, status, xhr){
- }
- ,error:function (e) {
- layerMsg('請(qǐng)求失敗，請(qǐng)稍后再試')
- }
- });
本文轉(zhuǎn)載自微信公眾號(hào)「冰河技術(shù)」，可以通過以下二維碼關(guān)注。轉(zhuǎn)載本文請(qǐng)聯(lián)系冰河技術(shù)公眾號(hào)。
當(dāng)前題目：【Nginx】還不會(huì)使用Nginx解決跨域問題？肝這一篇就夠了！！
分享路徑：http://m.5511xx.com/article/cccepog.html
