前端/uni-app中如何判斷服務器類型?

最近在通過websocket開發客服聊天功能過程中，后端同學因為Apache服務器反向代理原因，需要在Nginx服務器和Apache的websocket連接接口后需要加一個標識。

但是服務器的判斷需要前端來做判斷，這時我們在瀏覽器里查看可以看到日常請求接口的返回頭
Response Headers中可以看到一個key叫 Server

但是前端想要獲取Response Headers中的對應字段需要經過后臺的配置才能取到

首先

后端在配置前端可以獲取的Headers字段權限:

'Access-Control-Expose-Headers' => 'Server'

這樣前端同學就可以request請求中獲取到對應的字段(下放是在uniapp和pc端的獲取方法)

uni-app獲取服務器類型方法

uni.request({
    url: Url + '/api/' + url,
    method: method || 'GET',
    header: header,
    complete: (data) => {
        // #ifdef H5 || APP-PLUS
        uni.setStorageSync('SERVER_TYPE', data.header.server);
        //  #endif
        // #ifdef MP
        uni.setStorageSync('SERVER_TYPE', data.header.Server);
        // #endif
        }
    },
})

注意

這里有個坑，在H5公眾號中都server可以正常獲取但是在MP（微信小程序）中就必須要大寫Server才能獲取到，大家需要注意一下

PC端獲取方法

// 響應攔截器
service.interceptors.response.use(
    response => {
        // 獲取服務器類型
        sessionStorage.setItem("SERVER_TYPE", response.headers['server']);  //這里的請求在移動端是否需要大寫需要各位自己嘗試
       
    }
);

如有遇到問題歡迎在評論區交流~