写在前面
上节中我们讲到小程序的request请求以及上传文件操作，掌握了小程序基本的控件使用，这节我们要来探讨小程序获取系统信息，识别当前环境
系统信息的概念
uni-app提供了异步(uni.getSystemInfo)和同步((uni.getSystemInfoSync)的2个API获取系统信息。
系统信息返回的内容非常多，各操作系统、各家小程序、各浏览器对它们的定义也不相同。uni-app里重新梳理了这些概念，同时为了向下兼容也保留了这些平台原来的概念，但不推荐使用。
按照运行环境层级排序，从底层向上，uni-app有6个概念：
device：运行应用的设备，如iphone、huaweios：设备的操作系统，如 ios、andriod、windows、mac、linux rom：基于操作系统的定制，Android系统特有概念，如miui、鸿蒙host：运行应用的宿主程序，即OS和应用之间的运行环境，如浏览器、微信等小程序宿主、集成uniMPSDK的App。uni-app直接开发的app没有host概念uni：uni-app框架相关的信息，如uni-app框架的编译器版本、运行时版本app：开发者的应用相关的信息，如应用名称、版本
uni.getSystemInfo
调用代码示例
uni.getSystemInfo({
success: function (res) {
console.log(res.appName)
}
});官方给的文档一大堆，我们直接进行演示
第一步，在新建的uniapp项目中的index.vue文件里面增加一个按钮（通过点击事件触发getSystemInfo接口）
代码：
<view style="height: 10rpx;"></view>
<button type="primary" style="width: 500rpx;" @click="get_system">获取系统信息</button>
第二步，在methods中写入js代码
get_system:function(){
console.log("获取系统信息");
uni.getSystemInfo({
success(res) {
console.log(res);
}
})
},第三步，编译后点击查看控制栏输出的信息
看一下全部的信息
{
"SDKVersion": "",
"appId": "__UNI__3FCF801",
"appLanguage": "zh-Hans",
"appName": "demo",
"appVersion": "1.0.0",
"appVersionCode": "100",
"browserName": "safari",
"browserVersion": "11.0",
"deviceId": "16612229772388048514",
"deviceModel": "iPhone",
"deviceOrientation": "portrait",
"devicePixelRatio": 2,
"deviceType": "phone",
"errMsg": "getSystemInfo:ok",
"hostLanguage": "zh-CN",
"hostName": "safari",
"hostVersion": "11.0",
"language": "zh-CN",
"model": "iPhone",
"osName": "ios",
"osVersion": "11.0",
"pixelRatio": 2,
"platform": "ios",
"safeArea": {
"bottom": 667,
"height": 667,
"left": 0,
"right": 375,
"top": 0,
"width": 375
},
"safeAreaInsets": {
"bottom": 0,
"left": 0,
"right": 0,
"top": 0
},
"screenHeight": 667,
"screenWidth": 375,
"statusBarHeight": 0,
"system": "iOS 11.0",
"ua": "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1 HBuilderX",
"uniCompileVersion": "3.5.3",
"uniPlatform": "web",
"uniRuntimeVersion": "3.5.3",
"version": "",
"windowBottom": 0,
"windowHeight": 623,
"windowTop": 44,
"windowWidth": 375
}
看到这里很多小伙伴会问这些参数有啥用？可以用来识别安卓、苹果、pc端用户，如果在api接口能力不同的情况下，可以做分类处理 可以识别当前屏幕宽度、高度用来渲染页面窗口 等等
uni.getSystemInfoSync
与getSystemInfo不同的是
getSystemInfoSync直接使用即可
console.log("获取系统信息");
var data=uni.getSystemInfoSync()
console.log(data);返回的数据一样，需要开发者自己处理
{
"SDKVersion": "",
"appId": "__UNI__3FCF801",
"appLanguage": "zh-Hans",
"appName": "demo",
"appVersion": "1.0.0",
"appVersionCode": "100",
"browserName": "safari",
"browserVersion": "11.0",
"deviceId": "16612229772388048514",
"deviceModel": "iPhone",
"deviceOrientation": "portrait",
"devicePixelRatio": 2,
"deviceType": "phone",
"hostLanguage": "zh-CN",
"hostName": "safari",
"hostVersion": "11.0",
"language": "zh-CN",
"model": "iPhone",
"osName": "ios",
"osVersion": "11.0",
"pixelRatio": 2,
"platform": "ios",
"safeArea": {
"bottom": 667,
"height": 667,
"left": 0,
"right": 375,
"top": 0,
"width": 375
},
"safeAreaInsets": {
"bottom": 0,
"left": 0,
"right": 0,
"top": 0
},
"screenHeight": 667,
"screenWidth": 375,
"statusBarHeight": 0,
"system": "iOS 11.0",
"ua": "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1 HBuilderX",
"uniCompileVersion": "3.5.3",
"uniPlatform": "web",
"uniRuntimeVersion": "3.5.3",
"version": "",
"windowBottom": 0,
"windowHeight": 623,
"windowTop": 44,
"windowWidth": 375
}
