vue3-HTTP請求方式

更新時間：2022年06月24日 10:51:40 作者：sharryling

這篇文章主要介紹了vue3-HTTP請求方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

vue3-HTTP請求

jsonp原理結(jié)合node.js

服務(wù)端：

第15行，相當(dāng)于在前端返回了js代碼，調(diào)用show()

第19行相當(dāng)于 20-22行代碼

show被寫死了，最好的方式，客戶端把自己的函數(shù)名傳過去！如下：

傳參方法：

Get Post請求

1.導(dǎo)入包： vue-resourse

2.調(diào)用get： this.$http.get(‘url參數(shù)’).then((() => { 回調(diào)函數(shù) }

3.調(diào)用post

設(shè)置根域名

emulateJSON：true

如果不帶上面的參數(shù)，就會出問題??！

所以也可以設(shè)置全局

vue3-HTTP請求發(fā)出后,判斷哪里出問題了

在請求后添加

.catch(function (error) {
? ? if (error.response) {
? ? ? // 請求成功發(fā)出且服務(wù)器也響應(yīng)了狀態(tài)碼，但狀態(tài)代碼超出了 2xx 的范圍
? ? ? console.log("請求成功發(fā)出且服務(wù)器也響應(yīng)了狀態(tài)碼，但狀態(tài)代碼超出了 2xx 的范圍");
? ? ? console.log(error.response.data);
? ? ? console.log(error.response.status);
? ? ? console.log(error.response.headers);
? ? } else if (error.request) {
? ? ? // 請求已經(jīng)成功發(fā)起，但沒有收到響應(yīng)
? ? ? // `error.request` 在瀏覽器中是 XMLHttpRequest 的實例，
? ? ? // 而在node.js中是 http.ClientRequest 的實例
? ? ? console.log("請求已經(jīng)成功發(fā)起，但沒有收到響應(yīng)");
? ? ? console.log(error.request);
? ? } else {
? ? ? // 發(fā)送請求時出了點(diǎn)問題
? ? ? console.log("發(fā)送請求時出了點(diǎn)問題");
? ? ? console.log('Error', error.message);
? ? }
? ? console.log(error.config);
? });

然后根據(jù)控制臺，返回的信息判斷。

控制臺：結(jié)果頁面 -> 按F12 -> 點(diǎn)擊控制臺

例如：

? ? service.get('/trace/'+sourceSearchInput.value).then(res => {
? ? ? dialogSearchResult.value.push(res); ? //返回對象，push進(jìn)去 & vue3中 取變量值-》變量.value
? ? ? //console.log(res);
? ? }).catch(function (error) {
? ? if (error.response) {
? ? ? // 請求成功發(fā)出且服務(wù)器也響應(yīng)了狀態(tài)碼，但狀態(tài)代碼超出了 2xx 的范圍
? ? ? console.log("請求成功發(fā)出且服務(wù)器也響應(yīng)了狀態(tài)碼，但狀態(tài)代碼超出了 2xx 的范圍");
? ? ? console.log(error.response.data);
? ? ? console.log(error.response.status);
? ? ? console.log(error.response.headers);
? ? } else if (error.request) {
? ? ? // 請求已經(jīng)成功發(fā)起，但沒有收到響應(yīng)
? ? ? // `error.request` 在瀏覽器中是 XMLHttpRequest 的實例，
? ? ? // 而在node.js中是 http.ClientRequest 的實例
? ? ? console.log("請求已經(jīng)成功發(fā)起，但沒有收到響應(yīng)");
? ? ? console.log(error.request);
? ? } else {
? ? ? // 發(fā)送請求時出了點(diǎn)問題
? ? ? console.log("發(fā)送請求時出了點(diǎn)問題");
? ? ? console.log('Error', error.message);
? ? }
? ? console.log(error.config);
? });

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章: