這里用到的是.net6+vue2
1:請(qǐng)求攔截器,發(fā)請(qǐng)求之前加入請(qǐng)求頭
requests.interceptors.request.use((config) => {
//pagination 是后端響應(yīng)的變量 通過請(qǐng)求頭發(fā)送至服務(wù)器
config.headers.pagination = ""; // 根據(jù)實(shí)際情況自行修改
return config;
});
2:后端響應(yīng)頭配置
1:后端通過json序列化成字符串 傳給前端
var paginationMetadata = new
{
previousPageLink,
nextPageLink,
totalCount = TouristRoutes.TotalCount,
pageSize = TouristRoutes.PageSize,
currentPage = TouristRoutes.CurrentPage,
totalPages = TouristRoutes.TotalPages
};
//把分頁數(shù)據(jù)和其他所需數(shù)據(jù)通過Headers發(fā)過去
Response.Headers.Add("pagination",
Newtonsoft.Json.JsonConvert.SerializeObject(paginationMetadata));
2:在program 配置跨域中進(jìn)行配置
//配置前后端跨域問題*
builder.Services.AddCors(opt =>
{
opt.AddDefaultPolicy(b =>
{
//信任此域名的請(qǐng)求 只允許特定的域名
b.WithOrigins(new string[] { "http://localhost:8080" })
//允許任意的請(qǐng)求 允許任意的報(bào)文頭 接受任何的認(rèn)證方式 把指定響應(yīng)頭暴露出去
.AllowAnyMethod().AllowAnyHeader().AllowCredentials().WithExposedHeaders("pagination");
});
});
3:在前端響應(yīng)攔截器中獲取
按需返回所需數(shù)據(jù)
//響應(yīng)攔截器
requests.interceptors.response.use((res) => {
//獲取服務(wù)器自定義響應(yīng)頭
console.log(res.headers.pagination);
//這里返回全部數(shù)據(jù),在vuex中反序列化響應(yīng)頭就可以得到響應(yīng)頭的對(duì)象
return res;
}, (error) => {
return error.response;
// return Promise.reject(Message.error(error.response.data));
});
文章來源地址http://www.zghlxwxcb.cn/news/detail-731845.html
文章來源:http://www.zghlxwxcb.cn/news/detail-731845.html
到了這里,關(guān)于vue2 使用axios獲取服務(wù)器響應(yīng)頭(前后端分離)的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!