Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 5995
Star 90
Fork 162
H
hello uni-app x
提交 119413f4 编写于 作者: taohebin@dcloud.io's avatar taohebin@dcloud.io
浏览文件
操作

增加网络、设备信息的示例

上级 a77ae9e8
显示空白变更内容
内联 并排
Showing with 1388 addition and 197 deletion
pages.json
浏览文件 @ 119413f4
...@@ -402,6 +402,96 @@ ...@@ -402,6 +402,96 @@
"navigationBarTitleText": "text-decoration-line" "navigationBarTitleText": "text-decoration-line"
} }
} }
,{
"path" : "pages/API/request/request",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/upload-file/upload-file",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/download-file/download-file",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/websocket-socketTask/websocket-socketTask",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/websocket-global/websocket-global",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/get-system-info/get-system-info",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/get-device-info/get-device-info",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/get-app-base-info/get-app-base-info",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/get-system-setting/get-system-setting",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/API/get-app-authorize-setting/get-app-authorize-setting",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
], ],
"globalStyle": { "globalStyle": {
"pageOrientation": "portrait", "pageOrientation": "portrait",
......
pages/API/download-file/download-file.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt">
<view v-if="imageSrc" class="image-container">
<image class="img" :src="imageSrc" mode="center" />
</view>
<view v-else style="margin-top: 50px;">
<view class="uni-hello-text">
点击按钮下载服务端示例图片（下载网络文件到本地临时目录）
</view>
<view class="uni-btn-v">
<button type="primary" @tap="downloadImage">下载</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'downloadFile',
imageSrc: ''
}
},
onUnload() {
this.imageSrc = '';
},
methods: {
downloadImage: function () {
uni.showLoading({
title:'下载中'
})
var self = this
let task = uni.downloadFile({
url: "http://192.168.12.106:8080/downloadfile",
success(res) {
console.log('downloadFile success, res is', res)
self.imageSrc = res.tempFilePath;
uni.hideLoading();
},
fail: (err) => {
console.log('downloadFile fail, err is:', err)
}
});
task!.onProgressUpdate((update) => {
console.log("progress : ", update.progress);
})
}
}
}
</script>
<style>
.img {
width: 500rpx;
height: 500rpx;
margin: 0 auto;
}
.image-container {
display: flex;
justify-content: center;
align-items: center;
}
</style>
pages/API/get-app-authorize-setting/get-app-authorize-setting.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">是否授权使用摄像头</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="cameraAuthorized"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">是否授权使用定位</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="locationAuthorized"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">定位准确度</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="locationAccuracy"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">是否授权使用麦克风</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="microphoneAuthorized"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">是否授权通知</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="notificationAuthorized"/>
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" @tap="getAppAuthorizeSetting">获取App授权设置</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'getAppAuthorizeSetting',
cameraAuthorized:"",
locationAuthorized:"",
locationAccuracy:"",
microphoneAuthorized:"",
notificationAuthorized:""
}
},
onUnload:function(){
},
methods: {
getAppAuthorizeSetting: function () {
const res = uni.getAppAuthorizeSetting();
this.cameraAuthorized = res.cameraAuthorized;
this.locationAuthorized = res.locationAuthorized;
this.locationAccuracy = res.locationAccuracy ?? "unsupported";
this.microphoneAuthorized = res.microphoneAuthorized;
this.notificationAuthorized = res.notificationAuthorized;
}
}
}
</script>
<style>
.uni-pd {
padding-left: 30rpx;
}
</style>
pages/API/get-app-base-info/get-app-base-info.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">AppId</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="appId"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">AppName</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="appName"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">应用版本名</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="appVersion"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">应用版本号</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="appVersionCode"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">应用设置的语言</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="appLanguage"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">是否是UniAppX</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="isUniAppX"/>
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" @tap="getAppBaseInfo">获取App基础信息</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'getAppBaseInfo',
appId:"",
appName:"",
appVersion:"",
appVersionCode:"",
appLanguage:"",
isUniAppX:""
}
},
onUnload:function(){
},
methods: {
getAppBaseInfo: function () {
const res = uni.getAppBaseInfo();
this.appId = res.appId ?? "";
this.appName = res.appName ?? "";
this.appVersion = res.appVersion ?? "";
this.appVersionCode = res.appVersionCode ?? "";
this.appLanguage = res.appLanguage ?? "";
this.isUniAppX = res.isUniAppX ? "是": "否";
}
}
}
</script>
<style>
.uni-pd {
padding-left: 30rpx;
}
</style>
pages/API/get-device-info/get-device-info.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备品牌</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceBrand"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备 id </view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceId"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备型号</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceModel"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备类型</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceType"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备方向</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceOrientation"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备像素比</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="devicePixelRatio"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">操作系统及版本</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="system"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">客户端平台</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="platform"/>
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" @tap="getDeviceInfo">获取设备信息</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'getDeviceInfo',
deviceBrand:"",
deviceId:"",
deviceModel:"",
deviceType:"",
deviceOrientation:"",
devicePixelRatio:"",
system:"",
platform:""
}
},
onUnload:function(){
},
methods: {
getDeviceInfo: function () {
const res = uni.getDeviceInfo();
this.deviceBrand = res.deviceBrand ?? "";
this.deviceId = res.deviceId ?? "";
this.deviceModel = res.deviceModel ?? "";
this.deviceType = res.deviceType ?? "";
this.deviceOrientation = res.deviceOrientation ?? "";
this.devicePixelRatio = res.devicePixelRatio + "";
this.system = res.system ?? "";
this.platform = res.platform ?? "";
}
}
}
</script>
<style>
.uni-pd {
padding-left: 30rpx;
}
</style>
pages/API/get-system-info/get-system-info.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备型号</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="model"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">客户端平台</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="platform"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">操作系统版本</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="system"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">语言</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="language"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">版本</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="version"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">屏幕宽度</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="screenWidth"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">屏幕高度</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="screenHeight"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">可使用窗口高度</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="windowHeight"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">可使用窗口的顶部位置</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="windowTop"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">可使用窗口的底部位置</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="windowBottom"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">状态栏的高度</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="statusBarHeight"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">DPI</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="pixelRatio"/>
</view>
</view>
<!-- #ifdef MP -->
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">基础库版本</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="SDKVersion"/>
</view>
</view>
<!-- #endif -->
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" @tap="getSystemInfo">获取设备系统信息</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'getSystemInfo',
model:"",
platform:"",
system:"",
language:"",
version:"",
screenWidth:"",
screenHeight:"",
windowHeight:"",
windowTop:"",
windowBottom:"",
statusBarHeight:"",
pixelRatio:"",
SDKVersion:""
}
},
onUnload:function(){
},
methods: {
getSystemInfo: function () {
uni.getSystemInfo({
success: (res) => {
this.model = res.model;
this.platform = res.platform;
this.system = res.system;
this.language = res.language ?? "";
this.version = res.version;
this.screenWidth = res.screenWidth + "";
this.screenHeight = res.screenHeight + "";
this.windowHeight = res.windowHeight + "";
this.windowTop = res.windowTop + "";
this.windowBottom = res.windowBottom + "";
if (res.statusBarHeight == null){
this.statusBarHeight = "";
}else{
this.statusBarHeight = res.statusBarHeight!! + "";
}
this.pixelRatio = res.pixelRatio + "";
this.SDKVersion = res.SDKVersion;
}
})
}
}
}
</script>
<style>
.uni-pd {
padding-left: 30rpx;
}
</style>
pages/API/get-system-setting/get-system-setting.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">蓝牙的系统开关</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="bluetoothEnabled"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">地理位置的系统开关</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="locationEnabled"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">Wi-Fi 的系统开关</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="wifiEnabled"/>
</view>
</view>
<view class="uni-list-cell">
<view class="uni-pd">
<view class="uni-label" style="width:180px;">设备方向</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="deviceOrientation"/>
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" @tap="getSystemSetting">获取设备设置</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'getSystemSetting',
bluetoothEnabled:"",
locationEnabled:"",
wifiEnabled:"",
deviceOrientation:""
}
},
onUnload:function(){
},
methods: {
getSystemSetting: function () {
const res = uni.getSystemSetting();
this.bluetoothEnabled = (res.bluetoothEnabled ?? false) ? "开启" : "关闭";
this.locationEnabled = (res.locationEnabled ?? false) ? "开启" : "关闭";
this.wifiEnabled = (res.wifiEnabled ?? false) ? "开启" : "关闭";
this.deviceOrientation = res.deviceOrientation ?? "";
}
}
}
</script>
<style>
.uni-pd {
padding-left: 30rpx;
}
</style>
pages/API/request/request.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt">
<view class="uni-hello-text">
请点击按钮向服务器发起请求
</view>
<view class="uni-textarea uni-common-mt">
<textarea :value="res"></textarea>
</view>
<view class="uni-btn-v uni-common-mt">
<button type="primary" @click="sendRequest" :loading="loading">发起请求（Callback）</button>
</view>
</view>
</view>
</template>
<script>
const duration = 2000
export default {
data() {
return {
title: 'request',
loading: false,
res: ''
}
},
methods: {
sendRequest() {
this.loading = true;
uni.request({
url: "http://192.168.12.106:8080/postHalo",
dataType: "json",
responseType: "json",
method: "POST",
data: {
platform: "ios",
},
header: {
"Content-Type": "application/json",
},
timeout: 6000,
sslVerify: false,
withCredentials: false,
firstIpv4: false,
success(res) {
console.log('request success', res)
uni.showToast({
title: '请求成功',
icon: 'success',
mask: true,
duration: duration
});
this.res = '请求结果 : ' + JSON.stringify(res);
},
fail(err) {
console.log('request fail', err);
uni.showModal({
content: err.errMsg,
showCancel: false
});
},
complete() {
this.loading = false;
},
});
}
}
}
</script>
pages/API/upload-file/upload-file.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt">
<view class="demo">
<image v-if="imageSrc" :src="imageSrc" class="image" mode="widthFix"></image>
<view v-else class="uni-hello-addfile" @click="chooseImage">+ 选择图片</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'uploadFile',
imageSrc: ''
}
},
onUnload() {
this.imageSrc = '';
},
methods: {
chooseImage: function() {
uni.chooseImage({
count: 1,
sizeType: ['compressed'],
sourceType: ['album'],
success: (res) => {
console.log('chooseImage success, temp path is', res.tempFilePaths[0])
var imageSrc = res.tempFilePaths[0]
uni.uploadFile({
url: 'http://192.168.12.106:8080/uploadFile', //仅为示例，非真实的接口地址
filePath: imageSrc,
name: 'file',
formData: {
'user': 'test'
},
success: (res) => {
console.log('uploadImage success, res is:', res)
uni.showToast({
title: '上传成功',
icon: 'success',
duration: 1000
})
this.imageSrc = imageSrc
},
fail: (err) => {
console.log('uploadImage fail', err);
uni.showModal({
content: err.errMsg,
showCancel: false
});
},
});
},
fail: (err) => {
console.log('chooseImage fail', err)
}
})
}
}
}
</script>
<style>
.image {
width: 100%;
}
.demo {
background: #FFF;
padding: 50rpx;
justify-content: center;
align-items: center;
}
.uni-hello-addfile {
text-align: center;
line-height: 300rpx;
background: #FFF;
padding: 50rpx;
margin-top: 10px;
font-size: 38rpx;
color: #808080;
}
</style>
\ No newline at end of file
pages/API/websocket-global/websocket-global.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head title="websocket通讯示例"></page-head>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<view class="websocket-msg">{{showMsg}}</view>
<button class="uni-btn-v" type="primary" @click="connect">连接websocket服务</button>
<button class="uni-btn-v" v-show="connected" type="primary" @click="send">发送一条消息</button>
<button class="uni-btn-v" type="primary" @click="close">断开websocket服务</button>
<view class="websocket-tips">发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</view>
</view>
</view>
</view>
</template>
<script>
import CloseSocketOptions from 'uts.sdk.modules.DCloudUniWebsocket.CloseSocketOptions';
export default {
data() {
return {
connected: false,
connecting: false,
msg: "",
roomId: '',
platform :"",
}
},
computed: {
showMsg():string {
if (this.connected) {
if (this.msg.length > 0) {
return '收到消息：' + this.msg
} else {
return '等待接收消息'
}
} else {
return '尚未连接'
}
}
},
onLoad() {
this.platform = uni.getSystemInfoSync().platform;
},
onUnload() {
const closeOptions = new CloseSocketOptions();
uni.closeSocket(closeOptions);
uni.hideLoading()
},
methods: {
connect() {
if (this.connected || this.connecting) {
uni.showModal({
content: '正在连接或者已经连接，请勿重复连接',
showCancel: false
})
return
}
this.connecting = true
uni.showLoading({
title: '连接中...'
})
uni.connectSocket({
url: 'ws://192.168.12.106:8080/ws',
success(res) {
// 这里是接口调用成功的回调，不是连接成功的回调，请注意
},
fail(err) {
// 这里是接口调用失败的回调，不是连接失败的回调，请注意
}
})
uni.onSocketOpen((res) => {
this.connecting = false
this.connected = true
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '连接成功'
})
console.log('onOpen', res);
})
uni.onSocketError((err) => {
this.connecting = false
this.connected = false
uni.hideLoading()
uni.showModal({
content: '连接失败，可能是websocket服务不可用，请稍后再试',
showCancel: false
})
console.log('onError', err);
})
uni.onSocketMessage((res) => {
this.msg = res.data as string
console.log('onMessage', res)
})
uni.onSocketClose((res) => {
this.connected = false
this.msg = ""
console.log('onClose', res)
})
},
send() {
uni.sendSocketMessage({
data: 'from ' + platform + ' : ' + parseInt((Math.random() * 10000).toString()).toString(),
success(res) {
console.log(res);
},
fail(err) {
console.log(err);
}
})
},
close() {
const closeSocketOptions = new CloseSocketOptions();
uni.closeSocket(closeSocketOptions)
}
}
}
</script>
<style>
.uni-btn-v {
padding: 10rpx 0;
}
.uni-btn-v {
margin: 20rpx 0;
}
.websocket-room {
height: 40px;
line-height: 40px;
text-align: center;
border-bottom: solid 1px #DDDDDD;
margin-bottom: 20px;
}
.websocket-msg {
padding: 40px 0px;
text-align: center;
font-size: 14px;
line-height: 40px;
color: #666666;
}
.websocket-tips{
padding: 40px 0px;
text-align: center;
font-size: 14px;
line-height: 24px;
color: #666666;
}
</style>
pages/API/websocket-socketTask/websocket-socketTask.uvue 0 → 100644
浏览文件 @ 119413f4
<template>
<view>
<page-head title="websocket通讯示例"></page-head>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<view class="websocket-msg">{{showMsg}}</view>
<button class="uni-btn-v" type="primary" @click="connect">连接websocket服务</button>
<button class="uni-btn-v" v-show="connected" type="primary" @click="send">发送一条消息</button>
<button class="uni-btn-v" type="primary" @click="close">断开websocket服务</button>
<view class="websocket-tips">发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</view>
</view>
</view>
</view>
</template>
<script>
import SocketTask from 'uts.sdk.modules.DCloudUniWebsocket.SocketTask';
import CloseSocketOptions from 'uts.sdk.modules.DCloudUniWebsocket.CloseSocketOptions';
import SendSocketMessageOptions from 'uts.sdk.modules.DCloudUniWebsocket.SendSocketMessageOptions';
export default {
data() {
return {
connected: false,
connecting: false,
socketTask: null as SocketTask | null,
msg: "",
platform :"",
}
},
computed: {
showMsg(): string {
if (this.connected) {
if (this.msg.length > 0) {
return '收到消息：' + this.msg
} else {
return '等待接收消息'
}
} else {
return '尚未连接'
}
}
},
onReady() {
this.platform = uni.getSystemInfoSync().platform;
},
onUnload() {
uni.hideLoading()
let task = this.socketTask;
if (task != null) {
const closeOptions = new CloseSocketOptions();
task.close(closeOptions)
}
},
methods: {
connect() {
if (this.connected || this.connecting) {
uni.showModal({
content: '正在连接或者已经连接，请勿重复连接',
showCancel: false
})
return
}
this.connecting = true
uni.showLoading({
title: '连接中...'
})
this.socketTask = uni.connectSocket({
url: 'ws://192.168.12.106:8080/ws',
success(res) {
// 这里是接口调用成功的回调，不是连接成功的回调，请注意
},
fail(err) {
// 这里是接口调用失败的回调，不是连接失败的回调，请注意
}
})
this.socketTask?.onOpen((res) => {
this.connecting = false
this.connected = true
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '连接成功'
})
console.log('onOpen', res);
})
this.socketTask?.onError((err) => {
this.connecting = false
this.connected = false
uni.hideLoading()
uni.showModal({
content: '连接失败，可能是websocket服务不可用，请稍后再试',
showCancel: false
})
console.log('onError', err);
})
this.socketTask?.onMessage((res) => {
this.msg = res.data as string
console.log('onMessage', res)
})
this.socketTask?.onClose((res) => {
this.connected = false
this.socketTask = null
this.msg = ""
console.log('onClose', res)
})
},
send() {
const data = 'from ' + platform + ' : ' + parseInt((Math.random() * 10000) + "").toString()
let content = new SendSocketMessageOptions(data, function(res) {
console.log(res);
}, function(err) {
console.log(err);
}, null);
this.socketTask?.send(content)
},
close() {
let task = this.socketTask;
if (task != null) {
let closeOptions = new CloseSocketOptions();
task.close(closeOptions)
}
}
}
}
</script>
<style>
.uni-btn-v {
padding: 10rpx 0;
}
.uni-btn-v {
margin: 20rpx 0;
}
.websocket-msg {
padding: 40px 0px;
text-align: center;
font-size: 14px;
line-height: 40px;
color: #666666;
}
.websocket-tips {
padding: 40px 0px;
text-align: center;
font-size: 14px;
line-height: 24px;
color: #666666;
}
</style>
\ No newline at end of file
pages/tabBar/API/API.uvue
浏览文件 @ 119413f4
...@@ -124,8 +124,29 @@ ...@@ -124,8 +124,29 @@
url: "get-network-type", url: "get-network-type",
}, },
{ {
name: "获取设备系统信息", name: "获取系统信息",
url: "get-system-info", url: "get-system-info",
enable:true
},
{
name: "获取设备信息",
url: "get-device-info",
enable:true
},
{
name: "获取APP基础信息",
url: "get-app-base-info",
enable:true
},
{
name: "获取设备设置",
url: "get-system-setting",
enable:true
},
{
name: "获取APP授权设置",
url: "get-app-authorize-setting",
enable:true
}, },
{ {
name: "打电话", name: "打电话",
...@@ -215,14 +236,17 @@ ...@@ -215,14 +236,17 @@
{ {
name: "发起一个请求", name: "发起一个请求",
url: "request", url: "request",
enable: true
}, },
{ {
name: "上传文件", name: "上传文件",
url: "upload-file", url: "upload-file",
enable: true
}, },
{ {
name: "下载文件", name: "下载文件",
url: "download-file", url: "download-file",
enable: true
}, },
] as Page[], ] as Page[],
}, },
...@@ -235,11 +259,13 @@ ...@@ -235,11 +259,13 @@
{ {
name: "socketTask", name: "socketTask",
url: "websocket-socketTask", url: "websocket-socketTask",
enable: true
}, },
// #endif // #endif
{ {
name: "全局websocket", name: "全局websocket",
url: "websocket-global", url: "websocket-global",
enable: true
}, },
] as Page[], ] as Page[],
}, },
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或