|
@@ -43,13 +43,14 @@
|
|
|
</div>
|
|
|
<script src="js/jquery-3.5.1.min.js"></script>
|
|
|
<script>
|
|
|
+ var baseIp = "192.168.0.114"
|
|
|
var socket;
|
|
|
if (!window.WebSocket) {
|
|
|
window.WebSocket = window.MozWebSocket;
|
|
|
}
|
|
|
|
|
|
if (window.WebSocket) {
|
|
|
- socket = new WebSocket("ws://192.168.0.114:8088/websocket");
|
|
|
+ socket = new WebSocket("ws://" + baseIp + ":8088/websocket");
|
|
|
socket.onopen = function(event) {
|
|
|
console.log("连接成功!")
|
|
|
};
|
|
@@ -60,29 +61,28 @@
|
|
|
console.log("连接断开!")
|
|
|
};
|
|
|
socket.onmessage = function(event) {
|
|
|
- console.log(event.data)
|
|
|
- const objInfo = JSON.parse(JSON.parse(event.data).msg);
|
|
|
- if (objInfo.type == "text") { //文字信息
|
|
|
+ const objInfo = JSON.parse(event.data);
|
|
|
+ const httpReg = new RegExp(/http:/);
|
|
|
+ if (!httpReg.test(objInfo.msg)) { //文字信息
|
|
|
const html = `<div class="br">
|
|
|
- <div class="av">
|
|
|
- <img src="img/avator.png" />
|
|
|
- </div>
|
|
|
- <div class="br-in">${objInfo.val}</div>
|
|
|
- </div>`
|
|
|
+ <div class="av">
|
|
|
+ <img src="img/avator.png" />
|
|
|
+ </div>
|
|
|
+ <div class="br-in">${objInfo.msg}</div>
|
|
|
+ </div>`
|
|
|
$(".xx-list").append(html);
|
|
|
} else { //图片信息
|
|
|
const html = `<div class="br">
|
|
|
- <div class="av">
|
|
|
- <img src="img/avator.png" />
|
|
|
- </div>
|
|
|
- <div class="br-in">
|
|
|
- <img src="${objInfo.val}" />
|
|
|
- </div>
|
|
|
- </div>`
|
|
|
+ <div class="av">
|
|
|
+ <img src="img/avator.png" />
|
|
|
+ </div>
|
|
|
+ <div class="br-in">
|
|
|
+ <img src="${objInfo.msg}" />
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
$(".xx-list").append(html);
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
} else {
|
|
|
alert("您的浏览器不支持WebSocket");
|
|
|
}
|
|
@@ -116,30 +116,14 @@
|
|
|
name
|
|
|
} = this.files[0]; //上传的图片对象
|
|
|
const imgSize = size; //上传图片大小
|
|
|
- const limitSize = 5 * (1024 ** 2); //限制图片大小
|
|
|
+ const limitSize = 5 * 102400; //限制图片大小
|
|
|
const nameArr = name.split(".");
|
|
|
const fileFormat = nameArr[nameArr.length - 1]; //上传文件格式
|
|
|
// 判断文件格式
|
|
|
const bool = imgReg.test(fileFormat);
|
|
|
if (bool) {
|
|
|
if (imgSize <= limitSize) {
|
|
|
- fileReader.onload = function() {
|
|
|
- const html = `<div class="zj">
|
|
|
- <div class="zj-in">
|
|
|
- <img src="${this.result}" />
|
|
|
- </div>
|
|
|
- <div class="av">
|
|
|
- <img src="img/avator.png" />
|
|
|
- </div>
|
|
|
- </div>`
|
|
|
- console.log(this.result)
|
|
|
- $(".xx-list").append(html);
|
|
|
- sent(JSON.stringify({
|
|
|
- val: this.result,
|
|
|
- type: "img"
|
|
|
- }));
|
|
|
- }
|
|
|
- fileReader.readAsDataURL(this.files[0]);
|
|
|
+ putImg(this.files[0]);
|
|
|
} else {
|
|
|
hiddenTip("图片太大!");
|
|
|
}
|
|
@@ -160,10 +144,7 @@
|
|
|
</div>`
|
|
|
$(".xx-list").append(html); //插入自己的
|
|
|
// 发送到其他人
|
|
|
- sent(JSON.stringify({
|
|
|
- val,
|
|
|
- type: "text"
|
|
|
- }));
|
|
|
+ sent(val);
|
|
|
$(".put-info>input").val(""); //清空输入的数据
|
|
|
})
|
|
|
|
|
@@ -174,6 +155,36 @@
|
|
|
$(".tip").css("display", "none")
|
|
|
}, 1000)
|
|
|
}
|
|
|
+
|
|
|
+ // 图片上传
|
|
|
+ function putImg(file) {
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append("file", file);
|
|
|
+ formData.append("websiteId", "a9302e81ba4c11ec899bd8bbc1a0725c");
|
|
|
+ $.ajax({
|
|
|
+ url: "http://192.168.0.95:8089/cms/file/fileUpload",
|
|
|
+ type: "post",
|
|
|
+ cache: false,
|
|
|
+ contentType: false,
|
|
|
+ processData: false,
|
|
|
+ data: formData,
|
|
|
+ success(res) {
|
|
|
+ const html = `<div class="zj">
|
|
|
+ <div class="zj-in">
|
|
|
+ <img src="${res.obj}" />
|
|
|
+ </div>
|
|
|
+ <div class="av">
|
|
|
+ <img src="img/avator.png" />
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+ $(".xx-list").append(html);
|
|
|
+ sent(res.obj)
|
|
|
+ },
|
|
|
+ error(err) {
|
|
|
+ console.log("请求错误")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
</script>
|
|
|
</body>
|
|
|
|