本文出自APICloud官方論壇，感謝論壇版主 Mr.ZhouHeng 的分享。
第一步我們需要在開發控制台創建一個Native App應用以及添模塊的准備工作：
按照下圖步驟
輸入完點創建完成之后
最好點擊添加按鈕之后返回看看你是否添加了需要的模塊，添加完模塊之后在點擊自定義的
然后雲端操作就完成 接下來我們把雲端代碼拉取到本地
通過svn拉取本地 使用開發工具直接打開拉取到本地的代碼進行開發；
如果你們使用的是官網工具apicloud-studio-2.exe
那么請看下面的鏈接教程把代碼拉取到本地：
https://docs.apicloud.com/Dev-Tools/studio-dev-guide
拉取代碼成功之后在工具的結構：
然后我們再打開Wi-Fi文檔
https://docs.apicloud.com/Client-API/Device-Access/wifi
這個路徑其實直接在模塊對應點擊模塊名字就能進入到模塊文檔的 ，每個模塊都有這個；
ios需要特別注意文檔里面提示需要添加的文件：
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" /> <meta name="format-detection" content="telephone=no, email=no, date=no, address=no"> <title>wifi_frm</title> <link rel="stylesheet" type="text/css" href="../css/api.css" /> <link rel="stylesheet" type="text/css" href="../css/box.css" /> <style media="screen"> <style>html, body { background-color: #ededed; } .list-item { margin-top: 1px; padding: 15px 10px; font-size: 14px; line-height: 180%; position: relative; background-color: #fff; } .list-item:after { content: " "; position: absolute; z-index: 77; left: 0; top: 0; width: 200%; height: 200%; border-bottom: 1px solid #d4d4d4; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scale(.5, .5); transform: scale(.5, .5); } .left { padding: 0px 10px; line-height: 220%; color: #333; } .list-item .title { padding: 0px 10px; line-height: 220%; color: #333; position: relative; z-index: 88; } .list-item .right { position: relative; z-index: 99; } .list-item .right .state { display: inline-block; vertical-align: middle; border-radius: 20px; width: 38px; height: 21px; text-align: center; line-height: 20px; font-size: 12px; color: #fff; } .list-item .right .open { background-color: #00acff; } .list-item .right .open::after { content: " "; float: right; margin-top: 1px; margin-right: 1px; width: 19px; height: 19px; border-radius: 50%; background-color: #fff; box-shadow: 0px 0px 1px 1px #d4d4d4; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .list-item .right .close { background-color: #ededed; } .list-item .right .close::after { content: " "; float: left; margin-top: 1px; margin-left: 1px; width: 19px; height: 19px; border-radius: 50%; background-color: #fff; box-shadow: 0px 0px 1px 1px #d4d4d4; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } .center { text-align: center; } .list-item .active { color: #00acff } </style> </head> <body> <!-- v-cloak --> <div class="list" v-cloak> <div class="list-item flex-wrap"> <div class="title flex-con ellipsis-1">{{state == true ? '已經開啟WLAN' : '已經關閉WLAN'}}</div> <div class="right" v-if="show===true" @click="fnSwitch(state)"> <div class="state" :class="state == true ? 'open' : 'close'"></div> </div> </div> <div class="list-item flex-wrap"> <div class="left">設備當前連接的wifi:</div> <div class="title flex-con ellipsis-1">{{current}}</div> </div> <div class="list-item flex-wrap center" v-if="show===true"> <div class="title flex-con " :class="tab == false ? 'active' : ''" @click="fnScanWifi()">獲取附近的wifi</div> <div class="title flex-con" :class="tab == true ? 'active' : ''" @click="fnGetWifi()">獲取已經配置過的wifi</div> </div> <div class="list-item flex-wrap" v-if="show===true&&state===true" v-for="(list,index) in items"> <div class="left">{{tab == false ? '附近' : '已經配置'}}wifi:</div> <div class="title flex-con ellipsis-1">{{list.ssid}}</div> </div> </div> </body> <script src="../script/api.js"></script> <script src="../script/fastclick.js"></script> <script src="../script/vue.min.js"></script> <script> var eWifi; apiready = function() { fnInVue(); } function fnInVue() { window.ListVue = new Vue({ el: ".list", data: { current: '', items: [], show: false, state: false, tab: false }, mounted: function() { this.$nextTick(function() { fnInit(); }); }, methods: { fnSwitch: function(states) { console.warn(states); if (states) { fnCloseWifi(); } else { fnOpenWifi(); } }, fnScanWifi: function() { if (this.tab === false) { return; } this.tab = false; fnScanWifiList(); }, fnGetWifi: function() { if (this.tab === true) { return; } this.tab = true; fnGetConfiguredNetworks(); }, } }); } function fnInit() { eWifi = api.require('wifi'); // 判斷是ios還是安卓 從而是否顯示對應權限 window.ListVue.show = api.systemType == 'ios' ? false : true; // 獲取當前wifi fnObtainCurrent(); // 獲取附近鏈接的wifi fnScanWifiList(); }; // 獲取當前wifi function fnObtainCurrent() { 后面代碼請下載源碼自行研究 </script> </html> 復制代碼