在vue項(xiàng)目中,一般的請(qǐng)求方式有四種:(最重要的是第四種)
1.對(duì)本地?cái)?shù)據(jù)請(qǐng)求(json)
待續(xù)
2.對(duì)模擬數(shù)據(jù)的請(qǐng)求(mock)
待續(xù)
3.對(duì)第三方數(shù)據(jù)的抓?。╦sonp)
首先明確一點(diǎn),jsonp只是針對(duì)get請(qǐng)求的(/src/common/js/jsonp.js)
思路:原理其實(shí)實(shí)現(xiàn)就是jsonp最原始的請(qǐng)求,但是對(duì)其進(jìn)行一個(gè)比較好的封裝,可以直接拿來(lái)用,通常把這個(gè)方法放在一個(gè)公用的js中

運(yùn)用到代碼中:第一張圖是在頁(yè)面的組件的vue文件中運(yùn)用(/src/components/recommend/recommend.vue),第一張圖是在這個(gè)組件對(duì)于的js中對(duì)方法進(jìn)行傳參(里面的object.assign方法是object自帶一個(gè)方法,自己上網(wǎng)百度學(xué)習(xí),其實(shí)就是將所有的參數(shù)對(duì)象整合成一個(gè)object)——對(duì)應(yīng)我的項(xiàng)目中的/src/api/recommend.js


其實(shí)還有一種做法,不確定是什么請(qǐng)求,但是確實(shí)可以請(qǐng)求到第三方的數(shù)據(jù),不是jsonp的返回格式,上面那種是針對(duì)第三方接口返回的是jsonp的模式,可能下面這種更加通用的東西
1.首先找到build里面的dev-server.js


2.在想要的組件的js中添加這個(gè)請(qǐng)求(我個(gè)人理解跟代理很相似)

4.對(duì)項(xiàng)目的數(shù)據(jù)的對(duì)接(跨域問(wèn)題)
因?yàn)槲覀冊(cè)陧?xiàng)目中,如果在自己的本地安裝vue的話,怎么去請(qǐng)求后臺(tái)接口的數(shù)據(jù)尼,如果在本地的開(kāi)發(fā)的話,就會(huì)涉及到跨域問(wèn)題
怎么去解決這個(gè)問(wèn)題,我自己也是去網(wǎng)上搜索了很久:
最后找到一種方法就是對(duì)vue項(xiàng)目的跨域的部分進(jìn)行修改:
1.首先找到config里面的index.js文件,然后對(duì)proxyTable進(jìn)行修改,記得注意一點(diǎn),我覺(jué)得這個(gè)api這個(gè)命名是不能修改的,因?yàn)槲腋牧司蛨?bào)錯(cuò)了,不曉得為啥。大家盡量去用api吧?。。?/p>

2.上面配置就可以發(fā)請(qǐng)求了


發(fā)axios的請(qǐng)求,這個(gè)是跨域請(qǐng)求做本地代理的請(qǐng)求方式
這樣的話就可以成功了,真的很簡(jiǎn)單,我卻弄了很久。。。。