如果請求的域名近顷,端口號不一致,瀏覽器就會產(chǎn)生跨域宁否≈仙客戶端請求已經(jīng)發(fā)送到服務(wù)器,服務(wù)器也將數(shù)據(jù)返回到了瀏覽器慕匠,但是因?yàn)榭蛻舳撕头?wù)器端的域名或者端口號不一致饱须,瀏覽器就會攔截,這個(gè)時(shí)候台谊,后端可以配置請求頭允許客戶端訪問蓉媳,前端也可以配置代理服務(wù)器去解決跨域,以下就是前端解決跨域的方法锅铅。
(補(bǔ)充:如果客戶端是http://localhost:5000酪呻,那么代理服務(wù)器也是http://localhost:5000,但是因?yàn)榉?wù)器與服務(wù)器之間不存在跨域問題盐须,所以配置了代理服務(wù)器号杠,就能解決跨域的問題)
方法一
只能配置一個(gè)代理服務(wù)器,也可以理解只能請求一個(gè)服務(wù)器,如果想請求多個(gè)服務(wù)器的話姨蟋,就行不通了屉凯。
請求實(shí)例:http://localhost:5000/xx/xx
方法二
可以配置多個(gè)代理服務(wù)器
changeOrigin:代理服務(wù)器是否對請求的服務(wù)器說謊,如果為true眼溶,就是說謊悠砚,比如代理服務(wù)器的域名和端口號是http://localhost:5000,請求的后端服務(wù)器是http://xxx:5000堂飞,那么后端服務(wù)器收到的代理服務(wù)器的路徑也是http://xxx:5000灌旧。如果為false,則不說謊,比如代理服務(wù)器的域名和端口號是http://localhost:5000绰筛,那么后端服務(wù)器收到的代理服務(wù)器的路徑也是http://localhost:5000枢泰。為true的目的是,當(dāng)后端服務(wù)器做了請求限制铝噩,比如只能給指定的請求響應(yīng)衡蚂,那么代理服務(wù)器也能正常訪問
pathRewrite:對請求路徑做正則。比如一個(gè)請求是http://localhost:5000/index,代理服務(wù)器的開頭請求路徑是'/api',如果不配置pathRewrite的話骏庸,那么請求就是http://localhost:5000/api/index,但是服務(wù)器的請求路徑是index毛甲,不是api/index,那么就會導(dǎo)致404具被。如果配置了pathRewrite:{‘^/api’:" '}(意思是如果路徑中有api這個(gè)字符串玻募,就會被替換成‘ ’),那么最終的請求就是http://localhost:5000/index