使用javascript将文件发送到socket.io

我是socket.io上的新用户，我在创建的应用程序上使用socket.io作为聊天功能。我在发送文件时遇到问题。我试着从互联网上搜索参考资料，它引用了一个上传的socketio文件库。现在我对使用这个库感到困惑，我被编写算法所束缚。因此，我需要帮助完成这项工作，以便它能够顺利运行。现在我将文件保存到数据库中，目录使用PHP

对不起，我的英语不好^_^ app.js

文件html

$（文档）.ready（函数（）{
var socket=io.connect（'http://localhost:3001');
$（document）.on（“click”，“.sendpesan”，函数（）{
var site=$（“#site”）.val（）；
var id_penerima=$（“#id_penerima”）.val（）；
var id_komen=$（“#id_komen”）.val（）；
var id_运算符=$（“#id_运算符”）.val（）；
var id_pengirim=$（“#id_pengirim”）.val（）；
var pesan=$（“#pesan”）.val（）；
var字符串=”；
var file_input=$（“#uplaod”）；
var file=document.getElementById（“上载”）.files[0]；
var formdata=new formdata（）；
formdata.append（“站点”，站点）；
append（“userfile”，file）；
formdata.append（“id_penerima”，id_penerima）；
formdata.append（“id\u pengirim”，id\u pengirim）；
formdata.append（“id_komen”，id_komen）；
追加（“id\u运算符”，id\u运算符）；
formdata.append（“比桑”，比桑）；
$.ajax({
键入：“POST”，
url:“index.php/Mors/save_pesan”，
contentType:false，
processData:false，
数据：formdata，
成功：功能（响应）{
//$（“#上传证据关闭”）。单击（）；
//警报（“苏克斯”）；
//file_input.replaceWith（file_input.val（“”）.clone（true））；
toastr.options={
关闭按钮：对，
是的，
showMethod:'slideDown'，
超时：1500
};
var split=响应。split（“-”）；
如果（拆分[0]=“pesan berhasil disimpan”）{
toastr.success（'Pesan Berhasil dikirim'，'INFORMASI'）；
var uploader=新的SocketIOFileUpload（socket）；
uploader.listenInput（文件）；
发出（“私有消息”{
“内容”：文件，
“useridnya”：id_pengirim，
“topik”：“komenid”+id_komen，
});
}否则{
toastr.成功（“Pesan Gagal dikirim”，“INFORMASI”）；
}
document.getElementById（“聊天室表单”）.reset（）；
$（“#比桑”）.val（字符串）；
$（'.text_filex'）.html（''）；
}
});
});
var html=''；
socket.on（“新消息”，函数（数据）{
var img=新图像（）；
img.src='data:image/jpeg；base64'+data.buffer；
var-gambar=''；
html=“”+
''+
''+
''+
''+
“
”+img+“+data.content+”
”+
''+
''+
//''+数据[i].waktu+''+baca+''+
''+
''
$（“#显示#数据#聊天”）.append（html）；
});

您是否收到任何特定的错误消息？@PedroLobito error未找到，但我无法将图像从socket.io返回到html，所以您可以帮助我

var siofu = require("socketio-file-upload");
var req_express = require('express'),
    app = req_express(), 
    server = require('http').createServer(app),
    io = require('socket.io').listen(server),
    fs = require('fs')

app.use(siofu.router);
server.listen(3001);

var clients = [];

io.sockets.on('connection', function (socket) {
    const uploader = new siofu();
    uploader.listen(socket);

    socket.on('private-message', function(data){
       console.log("data content nya "+data.content)
       socket.join(data.topik)
       io.to(data.topik).emit("new-message", {image: true, buffer: data.toString('base64')});
       console.log("Sending: " + data.content + " to " + data.topik);
    });

    socket.on('disconnect', function() {

       for(var name in clients) {
         if(clients[name].socket === socket.id) {
           delete clients[name];
           break;
         }
       }
       console.log('disconnected client')
    })
});

<script type="text/javascript">
$(document).ready(function() {
var socket = io.connect('http://localhost:3001');

$(document).on("click",".sendpesan",function(){

    var site = $("#site").val();
    var id_penerima = $("#id_penerima").val();
    var id_komen = $("#id_komen").val();
    var id_operator = $("#id_operator").val();
    var id_pengirim = $("#id_pengirim").val();
    var pesan = $("#pesan").val();
    var string="";
    var file_input = $("#uplaod");

    var file = document.getElementById("upload").files[0];
    var formdata = new FormData();

    formdata.append("site", site);
    formdata.append("userfile", file);
    formdata.append("id_penerima", id_penerima);
    formdata.append("id_pengirim", id_pengirim);
    formdata.append("id_komen", id_komen);
    formdata.append("id_operator", id_operator);
    formdata.append("pesan", pesan);
        
    $.ajax({
        type : 'POST',
        url  : "<?php echo base_url();?>index.php/Mors/save_pesan",         
        contentType: false,
        processData: false,
        data: formdata,
        success : function(response){
           
            //$("#do_upload_eviden .close").click();
            //alert('sukses');
            //file_input.replaceWith(file_input.val('').clone(true));

            toastr.options = {
                closeButton: true,
                progressBar: true,
                showMethod: 'slideDown',
                timeOut: 1500
            };

            var split = response.split("-");
            
            if(split[0]=="pesan berhasil disimpan"){
                toastr.success('Pesan Berhasil dikirim', 'INFORMASI');
                var uploader = new SocketIOFileUpload(socket);
                uploader.listenOnInput(file);
                socket.emit("private-message", {
                    "content": file,
                    "useridnya": id_pengirim,
                    "topik" : "komenid"+id_komen,
                });
                
            }else{
                toastr.success('Pesan Gagal dikirim', 'INFORMASI');
            }
            document.getElementById("chat_form").reset();
            

            $("#pesan").val(string);
            $('.text_filex').html('');   

        }
    });
});

var html ='';
socket.on("new-message", function(data){
    var img = new Image();
    img.src = 'data:image/jpeg;base64,' + data.buffer;
    

    var gambar ='';
    html ='<article id="chat-id-1" class="chat-item right">'+
                ' <a href="#" class="pull-right thumb-sm avatar"><img src="<?php echo base_url('assets/image/admin.png');?>" class="img-circle"></a>'+
                '<section class="chat-body">'+
                    '<div class="panel  bg bg-success text-sm m-b-none">'+
                        '<div class="panel-body" style="padding: 5px;">'+
                            '<span class="arrow right"></span>'+
                            ' <p class="m-b-none" > '+img+' '+data.content+' </p>'+
                        '</div>'+
                    '</div>'+
                    //'<small class="text-muted"><i class="fa fa-ok text-success"></i>'+data[i].waktu+' '+baca+'</small>'+
                '</section>'+
            '</article>'

    $("#show_data_chat").append(html);
});