前后端服务器分离时，前端如何上传图片到前端服务器？-灵析社区

给你提供个大概得思路 ### 1.先要准备一个后台上传服务。用java、node等等都可以实现。 你这里提到了纯前端，我以node为例子,假设你的文件要保存到服务器的`/home/uploads`目录下 const http = require('http'); const fs = require('fs'); const path = require('path'); const formidable = require('formidable'); const server = http.createServer((req, res) => { if (req.method === 'POST' && req.url === '/upload') { const form = new formidable.IncomingForm(); form.parse(req, (err, fields, files) => { if (err) { console.error('文件解析失败:', err); res.writeHead(500, {'Content-Type': 'text/plain'}); res.end('文件解析失败'); return; } const uploadDir = './uploads'; if (!fs.existsSync(uploadDir)) { fs.mkdirSync(uploadDir); } const fileName = fields.fileName; // 获取前端传递过来的文件名 const filePath = path.join(uploadDir, fileName); // 使用前端传递的文件名 const writeStream = fs.createWriteStream(filePath); fs.createReadStream(files.file.path).pipe(writeStream); writeStream.on('close', () => { console.log('文件上传成功:', filePath); res.writeHead(200, {'Content-Type': 'text/plain'}); res.end('文件上传成功'); }); }); } else { res.writeHead(404, {'Content-Type': 'text/plain'}); res.end('Not Found'); } }); const PORT = 3000; server.listen(PORT, () => { console.log(`Server is running on port ${PORT}`); }); ### 2.配置nginx的转发。 转发上传接口、配置静态文件访问 #转发上传接口 location /upload { proxy_pass http://localhost:3000/upload; } #配置静态文件访问 location /oss/ { alias /home/upload/; autoindex on; # 打开目录浏览功能，可选 } ### 3.前端axios上传 const formData = new FormData(); formData.append('file', file); axios.post('/upload', formData, { headers: { 'Content-Type': 'multipart/form-data' }, params: { fileName: fileName // 将文件名作为请求参数传递给后端 } }) ### 4.你的文件地址就是你的nginx的domain+/oss/你的上传的文件名 * * * 我只是给你大概列个思路，具体代码你可以gpt或者网上找示例