H5获取手机设备信息、app版本信息、ip地址

获取手机设备的相关信息，如IMEI、IMSI、型号、厂商等。通过plus.device获取设备信息管理对象。
获取当前运行环境信息、与其它程序进行通讯等。通过plus.runtime可获取运行环境管理对象。

直接上demo

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <link href="../../css/mui.min.css" rel="stylesheet" />
        <script src="../../js/mui.js"></script>
        <script src="../../js/vue.js"></script>
        <style>
            body{max-width: 750px; min-width: 320px; margin: 0 auto; background-color: #F5F5F5;overflow-x: hidden;
                font-family: -apple-system,Helvetica,sans-serif;}
            div{font-size: .26rem; color: #474747;line-height: 2;}
            span{font-size: .28rem; color: #D1021F;}
        </style>
        <script>
            (function(doc, win) {
                var w = document.documentElement.clientWidth;
                if (w > 750) {
                    w = 750
                } else if (w < 320) {
                    w = 320
                }
                var f = w / 750 * 100 + "px";
                document.documentElement.style.fontSize = f;
                var docEl = doc.documentElement,
                    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                    recalc = function() {
                        var clientWidth = docEl.clientWidth > 750 ? 750 : docEl.clientWidth;
                        if (clientWidth > 750) {
                            clientWidth = 750
                        } else if (clientWidth < 320) {
                            clientWidth = 320
                        }
                        if (!clientWidth) return;
                        docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
                    };
            
                if (!doc.addEventListener) return;
                win.addEventListener(resizeEvt, recalc, false);
                doc.addEventListener('DOMContentLoaded', recalc, false);
            })(document, window);
        </script>
    </head>

    <body>
        <header class="mui-bar mui-bar-nav">
            <h1 class="mui-title">我的手机信息</h1>
        </header>
        <div id="content" class="mui-content mui-content-padded">
            <div class="mui-text-left" v-for="item in list">
                {{item.title}}
                <span>
                    {{item.value}}
                </span>
            </div>
        </div>

        <script type="text/javascript">
            var spans = document.getElementsByTagName('span');
            var VM = new Vue({
                el: ".mui-content",
                data: {
                    list:[]
                },
                
            })
            mui.plusReady(function() {
                //获取系统名称
                var name = plus.os.name;
                VM.list.push({
                    "title": "系统名称",
                    "value": name
                })
                //获取系统版本
                var version = plus.os.version;
                VM.list.push({
                    "title": "系统版本",
                    "value": version
                })
                //设备型号
                VM.list.push({
                    "title": "设备型号",
                    "value": plus.device.model
                })
                //获取生产厂商
                var vendor2 = plus.device.vendor
                VM.list.push({
                    "title": "生产厂商",
                    "value": vendor2
                })
                //获取系统供应商
                var vendor = plus.os.vendor
                VM.list.push({
                    "title": "系统供应商",
                    "value": vendor
                })
                //获取系统语言信息
                var language = plus.os.language;
                VM.list.push({
                    "title": "系统语言信息",
                    "value": language
                })

                var types = {}; //网络类型
                types[plus.networkinfo.CONNECTION_UNKNOW] = "未知";
                types[plus.networkinfo.CONNECTION_NONE] = "未连接网络";
                types[plus.networkinfo.CONNECTION_ETHERNET] = "有线网络";
                types[plus.networkinfo.CONNECTION_WIFI] = "WiFi网络";
                types[plus.networkinfo.CONNECTION_CELL2G] = "2G蜂窝网络";
                types[plus.networkinfo.CONNECTION_CELL3G] = "3G蜂窝网络";
                types[plus.networkinfo.CONNECTION_CELL4G] = "4G蜂窝网络";
                var network = types[plus.networkinfo.getCurrentType()];
                VM.list.push({
                    "title": "网络类型",
                    "value": network
                })
                //获取设备的唯一标示
                plus.device.getInfo({
                    success: function(e) {
                        VM.list.push({
                            "title": "国际移动设备身份码imei",
                            "value": e.imei
                        })
                        VM.list.push({
                            "title": "国际移动用户识别码imsi",
                            "value": e.imsi
                        })
                        VM.list.push({
                            "title": "设备的唯一标识",
                            "value": e.uuid
                        })
                    },
                    fail: function(e) {
                        console.log('getDeviceInfo failed: ' + JSON.stringify(e));
                    }
                });
                //获取APP版本信息
                plus.runtime.getProperty(plus.runtime.appid, function(inf) {
                    var ver = inf.version;
                    VM.list.push({
                        "title": "APP名称",
                        "value": inf.name
                    })
                    VM.list.push({
                        "title": "APP版本信息",
                        "value": "版本："+inf.version+"；版本号："+inf.versionCode
                    })
                    console.log(JSON.stringify(inf))
                })
                
                
            });
            //获取IP地址信息
            function addScriptTag(src) {
                var script = document.createElement('script');
                script.setAttribute("type", "text/javascript");
                script.src = src;
                document.body.appendChild(script);
            }
            
            function foo(data) {
                var json = data.data[0];
                
                VM.list.push({
                    "title": "位置",
                    "value": json.location
                })
                VM.list.push({
                    "title": "IP地址",
                    "value": json.origip
                })
                console.log("IPInfo:"+ JSON.stringify(json));
            };
            window.onload = function() {
                addScriptTag(
                    'https://sp0.baidu.com/8aQDcjqpAAV3otqbppnN2DJv/api.php?query=ip&co=&resource_id=6006&t=1562124098965&ie=utf8&oe=gbk&cb=foo&format=json&tn=baidu'
                );
            }
        </script>
    </body>
</html>

注意：
获取IP地址和plus.device.getInfo都是异步的，所以在使用的时候要注意时机

效果图：

Android.jpg

Android和IOS获取imei、imsi、uuid时须知：

imei: (String 类型 )设备的国际移动设备身份码

如果设备不支持或无法获取（如用户未授权）则返回空字符串。如果设备存在多个身份码，则以“,”字符分割拼接，如“862470039452950,862470039452943”。
平台支持

Android - ALL (支持): 需要用户授权才能获取，如果用户拒绝获取设备信息则返回空字符串。
iOS - ALL (不支持): 无法获取设备身份码，返回空字符串。

imsi: (Array[ String ] 类型 )设备的国际移动用户识别码

字符串数组类型，获取设备上插入SIM的国际移动设备身份码。如果设备支持多卡模式则返回所有SIM身份码。如果设备不支持或没有插入SIM卡则返回空数组。
平台支持

Android - ALL (支持): 如果无法获取国际移动用户标识（如用户未授权）则返回空数组。
iOS - ALL (不支持): 无法获取设备移动用户识别码，返回空数组。

uuid: (String 类型 )设备标识

设备的唯一标识号。
平台支持

Android - ALL (支持): 与设备的imei号一致。 注意：如果无法获取设备imei则使用设备wifi的mac地址，如果无法获取设备mac地址则随机生成设备标识号（不同App在同一台设备上获取的值一致）。
iOS - ALL (不支持): 根据包名随机生成的设备标识号。 注意：设备重置（刷机）后会重新生成

其他的属性和方法，参考html5plus官网：
http://www.html5plus.org/doc/zh_cn/device.html

欢迎转载，但是请注明出处

Github
个人博客