1.錯誤分析
這裏我調用的是qq音樂的一個接口vue
全部的的參數 都和qq音樂那邊的保持一致。node
當我 console.log所抓取數據時，查看控制檯時發現瞭如下錯誤ios
其實禁止跨域請求是瀏覽器自己的一種安全策略。express
2.跨域資源共享（Cross-Origin-Resource-Sharing）
跨域資源共享（CORS）機制，是爲了瀏覽器能更爲安全的處理跨域請求，使其不受同源策略的限制。簡單來講就是把須要容許跨域的源寫入response頭裏的Access-Control-Allow-Origin。對應的源就能夠實現跨域資源共享了。npm
3.解決方法
這裏 我寫了一個後端代理接口來解決這個問題axios
咱們進入到vue.config.js配置文件後端
首先要引入erpress這個包跨域
注意vue 3.0 不會自帶 express 要本身 npm。promise
同時咱們還要npm 一個 axios 這個相信你們都據說過瀏覽器
axios 基於promise用於瀏覽器和node.js的http客戶端
而後開始寫個人代理接口
咱們在這裏引入qq音樂的接口地址,axios的具體使用方法在這裏就不詳細說明了百度本身搜索吧。
而後在咱們本身引用的就是本身寫的
由於qq音樂設置 Referer 不能直接經過瀏覽器抓接口，可是防不了咱們這種後端代理的方式
配置完以後咱們打開控制檯查看 這裏顯示Referer咱們本身的，而實際上已經修改爲立qq音樂的Referer
這樣就至關於欺騙了qq音樂，它就會認爲是本身那邊發出來的請求。
這時咱們在console.log
發現已經能夠拿到數據了。
4.注意事項
不要使用過多的接口 當你的數據訪問量過大 你的ip可能會被他們封禁