Ajax는 node js multer와 협력하여 파일 업로드 기능을 구현합니다.

이 글에서는 파일 업로드 기능을 구현하기 위한 Ajax와 node js multer를 주로 소개합니다. 필요한 친구들은 참고하시면 됩니다

Instructions

노드 초보자로서 최근에 지원하는 채팅 소프트웨어를 작업하고 있습니다. 회원가입, 로그인, 온라인 1인 및 다인 채팅, 이모티콘 전송, 각종 파일 업로드 및 다운로드, 친구 추가 및 삭제, 채팅 기록 저장, 알림음 전환, 배경화면 전환, 게임 등의 기능이 있어서 멀티 모듈을 사용하였고, 그리고 다양한 문서 검색 끝에 데모가 만들어졌습니다. 예를 들어, 대부분의 파일 형식을 업로드하는 동시에 웹 페이지에 표시하는 단일 파일 업로드 기능을 성공적으로 구현했습니다

않습니다. 위챗이 보이는 느낌이죠? 네, 위챗의 웹 버전을 기반으로 한 것입니다. 네,

전체적인 효과를 얻으려면 CSS와 HTML을 협력해야 합니다. 초심자인데 블로그 처음 올려보는데 정말 불안하네요. 조만간 github에 코드 올려 놓겠습니다. 관심 있으신 분들은 구경해보세요

바로 아래 코드를 가볍게 사용해 보세요. CMD 명령 Windows 님의 Code

npm install multer -save

Sclient Code

//引入http
const http=require("http");
//引入express
const express=require("express");
//引入multer
const multer=require("multer");
//创建服务器，绑定监听端口
var app=express();
var server=http.createServer(app);
server.listen(8081);
//建立public文件夹，将HTML文件放入其中，允许访问
app.use(express.static("public"));
//文件上传所需代码
//设置文件上传路径和文件命名
var storage = multer.diskStorage({
  destination: function (req, file, cb){
    //文件上传成功后会放入public下的upload文件夹
    cb(null, './public/upload')
  },
  filename: function (req, file, cb){
    //设置文件的名字为其原本的名字，也可以添加其他字符，来区别相同文件，例如file.originalname+new Date().getTime();利用时间来区分
    cb(null, file.originalname)
  }
});
var upload = multer({
  storage: storage
});
//处理来自页面的ajax请求。single文件上传
app.post('/upload', upload.single('file'), function (req, res, next) {
  //拼接文件上传后的网络路径，
  var url = 'http://' + req.headers.host + '/upload/' + req.file.originalname;
  //将其发回客户端
  res.json({
    code : 1,
    data : url
  });
  res.end();
});

whate the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the the code a) 앞으로는 모두에게 도움이 되세요.

관련 기사: AJAX 요청 대기열 사용에 대한 자세한 설명

ajax폭포 흐름 레이아웃 구현 단계에 대한 자세한 설명(코드 포함)

jQuery+json을 사용하여 Ajax 호출 기능 만들기 (코드 포함)

위 내용은 Ajax는 node js multer와 협력하여 파일 업로드 기능을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!