後端獲取nuxt項目的用戶ip地址

原文個人博客：後端獲取nuxt項目的用戶ip地址

nuxt 使用pm2 部署好了以後，因爲我申請的域名還沒審覈經過，因而先用ip:port方式訪問爽一波，其餘一切正常，可是很快我發現我獲取的全部ip都是127.0.0.1,瞬間不開心了，因而開始研究bug之路。

首先先理清nuxt的工做機制：

ssr渲染： 用戶（pc、手機等設備）訪問nuxt服務器，nuxt服務器接收到請求，nuxt服務器向接口服務發起請求，接口返回數據給nuxt，nuxt渲染好數據返回給用戶。

非ssr渲染：用戶（pc、手機等設備）在nuxt客戶端上直接向接口服務器發起請求，接口服務器返回數據給nuxt客戶端，nuxt客戶端渲染數據顯示給用戶。

接下來就是解決問題

nuxt 工做機制清楚了就好辦了：

非ssr渲染，就是正常的應用訪問獲取ip問題，咱們直接配置一個Nginx代理，而後轉發ip，後端就能夠愉快的獲取ip了。

ssr渲染沒有獲取到ip是很正常的，由於nuxt服務端向接口服務請求，是發生在咱們服務器本地的，因此要解決ssr渲染時沒有獲取正確ip的方法，就是在nuxt 使用ssr渲染髮起請求時，把用戶的ip放在咱們的header中。

nuxt 的 asyncData 裏面是能夠獲取客戶端的上下文的，裏面有不少參數：

asyncData({context}){
  const headers = (context && context.headers) ? Object.assign({}, context.headers)  : {}
}
複製代碼

咱們取出用戶端的header，放到咱們發起請求的header中，這樣後端就能夠正確獲取了，固然你也能夠直取某些參數，本身傳進去。