对接socket.io成功,添加背景音乐

master
chen 2022-07-28 18:19:08 +08:00
parent 781c4dfdc7
commit cf10515965
8 changed files with 209 additions and 96 deletions

94
App.vue
View File

@ -1,17 +1,30 @@
330606<script>
<script>
// import io from '@/jsFile/socket.io.js';
// const socket = io("ws://7and5.cn:2120",{
// query: {},
// transports: [ 'websocket', 'polling' ],
// timeout: 5000,
// });
export default {
globalData:{
projectname:'', //
lat:'', //
lng:'' ,//
hostapi:'https://7and5.cn' //
hostapi:'https://7and5.cn' ,//
// uid:1,
// socketInit:false,
// bgmMusic:null,
// ifPlayIng:false,
},
// show
onLaunch: function() {
// this.connect();
//
// #ifdef H5
// this.globalData.hostapi = 'https://7and5.cn';
// this.globalData.hostapi = '/web';
// #ifdef H5 || APP-PLUS
this.globalData.bgmMusic = uni.createInnerAudioContext();
// #endif
// #ifdef MP-WEIXIN
this.globalData.bgmMusic = wx.createInnerAudioContext();
// #endif
},
onShow: function() {
@ -21,9 +34,80 @@
// GPS
this.$toolAll.tools.checkOpenGPSServiceByAndroidIOS();
}
},
onLoad() {
},
onHide: function() {
},
methods:{
connect() {
socket.io.reconnect();
console.log(this.uid,1234);
socket.on('connect', ()=> {
socket.emit('login', this.uid);
console.log('连接成功');
});
//线
socket.on('disconnect', ()=> {
socket.connect();//
console.log('关闭链接后重新链接');
// this.openSettings();
});
//线广
socket.on('loginout', (data)=> {
console.log("会员下线",data);
});
//线广
socket.on('login_msg', (msg)=> {
console.log("会员上线",msg);
});
//
socket.on('new_msg', (msg)=> {
console.log(msg);
this.offMusic();
uni.showToast({
title:msg
})
this.bofang();
});
},
bofang(){
this.globalData.bgmMusic.autoplay = true;//
// this.bgmMusic.loop = true;//
this.globalData.bgmMusic.src = 'http://m801.music.126.net/20220728102722/4a7c3c7692a5f0b808f03f8ab7d02bfb/jdymusic/obj/wo3DlMOGwrbDjj7DisKw/4800358085/4a32/22b6/02f5/d96abc3bed5758b0e7172ea66aec841d.mp3';//
this.globalData.bgmMusic.volume = 1;//
this.globalData.bgmMusic.onPlay(()=>{
console.log('背景音乐播放中');
this.globalData.ifPlayIng = true;
});
},
//
offMusic(){
if(this.globalData.ifPlayIng){
this.globalData.bgmMusic.stop();
this.globalData.bgmMusic.onStop(()=>{
console.log('背景音乐停止了');
});
this.globalData.ifPlayIng = false;
}
},
// uniapp
openSettings() {
uni.getSystemInfo({
success(res) {
if(res.platform == 'ios'){
plus.runtime.openURL("app-settings://");
} else if (res.platform == 'android'){
var main = plus.android.runtimeMainActivity();
var Intent = plus.android.importClass("android.content.Intent");
var mIntent = new Intent('android.settings.SOUND_SETTINGS');
main.startActivity(mIntent);
}
}
});
},
}
};
</script>

10
jsFile/socket.io.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -13,6 +13,9 @@ Vue.component('container-subgroup',containerSubgroupTwo);//全局注册头部状
import share from './jsFile/share.js';// 全局注册分享事件
Vue.mixin(share);
import store from './store'
Vue.prototype.$store = store
// 常用工具
import tools from '@/jsFile/tools.js';
Vue.prototype.$toolAll = tools;

View File

@ -17,9 +17,7 @@
"delay" : 0
},
/* */
"modules" : {
"Maps" : {}
},
"modules" : {},
/* */
"distribute" : {
/* android */
@ -110,5 +108,6 @@
}
}
}
}
},
"template" : "index.html"
}

View File

@ -76,6 +76,7 @@
}
this.$requst.post('/universal/api.login/login',params).then(res=>{
if(res.code==1) {
this.$store.commit('setUid',res.data.uid);
// token
uni.setStorageSync('token',res.data.token);
} else {

View File

@ -62,18 +62,18 @@
return {
windowHeight: uni.getSystemInfoSync().windowHeight,
ifPhone:false,
login_phone:'',//
login_phone:'17366921088',//
ifCode:false,
login_code:'',//
ifunitName:false,
login_unitName:'',//
login_unitName:'湖南争鸣光电科技有限公司',//
ifPassword:false,
login_password:'',//
login_password:'123456',//
codeText:'获取验证码' ,//
flagCode:true ,//
countDown:null,
login_type:'mobile',// account
login_type_text:'账号密码'
login_type_text:'账号密码',
};
},
onLoad() {
@ -94,6 +94,8 @@
this.$requst.post('/universal/api.login/login',params).then(res=>{
if(res.code==1) {
this.$toolAll.tools.showToast('登录成功');
this.$store.commit('setUid',res.data.uid);
// socket
// token
uni.setStorageSync('token',res.data.token);
// (1234)

View File

@ -29,7 +29,7 @@
<!-- 项目总数实时故障公告 -->
<view class="project-notice-box">
<view class="disjcac pad-sx20 bbot">
<view class="disjcac fc width50" @click="change">
<view class="disjcac fc width50">
<view class="fon26 col9">项目总数</view>
<view class="fon60 bold">{{project_count || 0}}</view>
</view>
@ -239,20 +239,7 @@
import footTabOne from '@/components/foot-tabs/foot-tab-one.vue';
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
import {getPlanType} from '@/jsFile/public-api.js';
import io from '@hyoga/uni-socket.io';
// const socket = io('http://7and5.cn:2120', {
// transports: [ 'websocket']
// });
// const socket = io('http://7and5.cn:2120', {
// query: {},
// transports: [ 'websocket', 'polling' ],
// timeout: 5000,
// });
var socket = io("ws://7and5.cn:2120",{
query: {},
transports: [ 'websocket', 'polling' ],
timeout: 5000,
});
import io from '@/jsFile/socket.io.js';
export default {
components:{
pitera,
@ -342,9 +329,17 @@
contactPhone:'',//
project_count:0,//
project_error_count:0,//
uid:1,
socket:null,
socketInit:false
socketInit:false,
bgmMusic:null,
ifPlayIng:false,
}
},
computed:{
uid() {
return this.$store.state.uid
},
ifConnect(){
return this.$store.state.ifConnect
}
},
onShow() {
@ -353,6 +348,12 @@
console.log(this.role,'角色id')
},
onLoad(options) {
// #ifdef H5 || APP-PLUS
this.bgmMusic = uni.createInnerAudioContext();
// #endif
// #ifdef MP-WEIXIN
this.bgmMusic = wx.createInnerAudioContext();
// #endif
// url
this.$toolAll.tools.obtainUrl();
//
@ -361,79 +362,70 @@
this.getIncrementServiceType();
//
this.getFaultsList();
if(!this.ifConnect && this.uid){
this.connect();
}
},
methods: {
connectEv(){
socket.io.reconnect();
},
connect() {
if(!this.socketInit) {
this.socketInit = true;
const socket = io("ws://7and5.cn:2120",{
query: {},
transports: [ 'websocket', 'polling' ],
timeout: 5000,
});
socket.on('connect', ()=> {
socket.emit('login', this.uid);
this.$store.commit('setConnect',true);
console.log('连接成功');
});
socket.on('connect', function() {
console.log("连接成功");
//SOCKET
socket.emit('conn',{ uid: this.uid,userSig:"登录票据" })
});
//线
socket.on('disconnect', ()=> {
socket.connect();//
console.log('关闭链接后重新链接');
this.openSettings();
});
socket.on('reconnect', function() {
console.log("重连成功");
});
//线广
socket.on('login', function(data) {
console.log("会员上线",data.uid);
// this.openSettings();
});
//线广
socket.on('loginout', function(data) {
console.log("会员下线",data.uid);
socket.on('loginout', (data)=> {
console.log("会员下线",data);
});
//线广
socket.on('login_msg', (msg)=> {
console.log("会员上线",msg);
});
//
socket.on('broadcastingListen', function (data) {
for(i=0;i<data.length;i++){
console.log(data[i]) //msg
}
});
socket.on('login_msg', (msg)=> {
console.log(msg);
});
socket.on('new_msg', (msg)=> {
console.log(msg);
// this.offMusic();
uni.showToast({
title:msg
})
this.bofang();
});
//
// this.socket.on('broadcastingListen', (data)=> {
// for(i=0;i<data.length;i++){
// console.log(data[i]) //msg
// }
// });
} else {
socket.io.reconnect();
},
bofang(){
this.bgmMusic.autoplay = true;//
// this.bgmMusic.loop = true;//
this.bgmMusic.src = 'http://m801.music.126.net/20220728102722/4a7c3c7692a5f0b808f03f8ab7d02bfb/jdymusic/obj/wo3DlMOGwrbDjj7DisKw/4800358085/4a32/22b6/02f5/d96abc3bed5758b0e7172ea66aec841d.mp3';//
this.bgmMusic.volume = 1;//
this.bgmMusic.play(()=>{
console.log('背景音乐播放中');
this.ifPlayIng = true;
});
},
//
offMusic(){
if(this.ifPlayIng){
this.bgmMusic.stop();
this.bgmMusic.onStop(()=>{
console.log('背景音乐停止了');
});
this.ifPlayIng = false;
}
},
change(){
this.uid++;
socket.io.disconnect();
this.connectEv();
},
connectEv(){
socket.on('connecting', function() {
console.log("正在连接");
});
socket.on('reconnect', function() {
console.log("重新连接到服务器");
});
socket.on('connect_failed', function() {
console.log("连接失败");
});
socket.on('reconnecting', function() {
console.log("正在重连");
});
},
// uniapp
openSettings() {
uni.getSystemInfo({

22
store/index.js Normal file
View File

@ -0,0 +1,22 @@
// 页面路径store/index.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);//vue的插件机制
//Vuex.Store 构造器选项
const store = new Vuex.Store({
state:{//存放状态
uid:'',
ifConnect:false
},
mutations: {
setUid(state, str) {
state.uid = str;
},
setConnect(state, str) {
state.ifConnect = str;
}
}
})
export default store