今天在做專案中，遇到一個問題，在一個點選事件中利用axios發請求，出現了跨域問題，之前都是直接用的伺服器端渲染，然後就一直沒出現，還是解決了很久的，所以決定把問題及解決方案記錄下來。

 tree.vue :

最終解決方案

在nuxt專案中的server檔案中的index.js中攔截一個地址替我們發這個請求，

server/index.js或者vue中的server.js

此時就需要在我們的點選事件中請求我在server的index.js的地址，及   /api/user/login

頁面地址:tree.vue

 console.log

 然後跨域就解決了

其中可以簡單的瞭解一下原理，因為跨域是瀏覽器出現的，而伺服器端渲染是不需要瀏覽器的支援的，簡單地說，就是他在瀏覽器渲染之前，就已經拿到資料了，所以就跟正常的請求一樣，就不會出現跨域問題了。

這裡就是利用server/index.js來作為中間層處理的，把我們的普通請求也變成了伺服器端渲染，所以在我的頁面寫點選事件的時候，就是在自己的源拿的資料，因此就不會出現跨域了。

在寫的時候要注意一些問題。

1，利用req.query來獲取頁面傳來的引數

tree.vue

server/index.js----->接收引數重新發請求

 2，此處有兩個res,上面為了區分，特意用了response來代替，避免衝突

　　server/index.js

　　response是作為別人請求/api/user/login成功的返回結果，而res是作為裡面的axios請求成功後的結果

3，server/index.js發請求寫的位置

　　因為app.use(nuxt.render)是使沒有做處理的請求，反過來說，就是把需要做特殊處理的請求寫在前面，後面的就表示剩下的不需要做特殊處理的請求，就按正常的渲染方式就好了。（這個app.use(nuxt.render)可能解釋不怎麼好，這個因為是自帶的，也不太好解釋）

然後這個最終就算是這樣解決了。