記一個http-proxy-middleware 代理訪問nginx映射的接口不通過的問題(connection close)


  工作過程中遇見一個問題,使用Vue-cli 搭建了一個工程,由於跨域的問題 使用了自帶的dev-server Express Server(A后台) http-proxy-middleware 去訪問后台的接口nginx Server(B后台),而這個接口為niginx 代理的另一個后台(C后台),理清一下關系:

  開發頁面去請求A后台(devServer)的接口, 然后這個請求會被轉發的B后台(nginx), 然后再會被nginx映射到C后台(我們真實要訪問的后台),你可能會問為什么不用A直接去代理訪問C, 非要在中間加了個nginx呢 ? 由於C是個交換機設備上的server, 直接用我的A (devServer)去代理C不好使,所以才有這樣的情景。

  從B到C的過程一切都很正常,但是從A到B中間的每次的請求返回時connection 都是close , 而正常的是keep-alive的,這就導致我在頁面里登錄成功后 繼續請求其他接口還是驗證不通過。網上找了好多資料都不好使。

  最終解決方案是,(當一條路走不通的時候,換一條試試):

  跨域問題解決的方法之一, CORS 

  通過修改ngnix配置文件,加入allow-origin頭

        location ~ \.do$ {
	    add_header 'Access-Control-Allow-Origin' 'http://localhost:8080'; //這個是我的A devServer,必須設置具體的值,不要使用* 否則訪問接口的時候瀏覽器會報錯
	    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
	    add_header 'Access-Control-Allow-Credentials' true;
	    add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
            proxy_pass   http://172.16.15.65;
        }

  配置完這個重啟nginx然后你的頁面里直接寫B的接口就不會存在跨域問題了,但是這個時候如果登錄的過程中產生了一個cookie這個信息在你后面訪問借口的時候不會自動添加上的,需要在你的ajax里面加上withCredentials,例如jquery 的ajax

     $.ajax({
            url : "*****",
            type : post,
            dataType : params.dataType,
            data : cliPostData,
            cache : false,
            //注意這里
            xhrFields: {
              withCredentials: true
            },
            success : function(data) {        
            }     
      })

  這樣就可以攜帶cookie的認證信息了,然后再進行頁面的直接訪問接口就可以正常使用了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM