最近做毕设，需要上传图片，因为在本地服务器运行，所以想着前端上传后，通过node服务器接收图片，存储在指定的目录下。

一、前端实现

1、前端的页面和上传图片是利用element-ui组件实现的，"/admin/userManager/uploadImg" 是上传图片接口，前端与后台对接的方式和其他接口一样，这里就不详讲了，代码如下所示

2、上传文件前校验的代码：

二、后台实现

1、因为node后台代码用的是koa框架，所以相对于用的文件模块是koa-formidable，同时要引入fs模块和path模块如下所示

2、利用fs模块和koa-formidable模块上传图片，并把图片内容移动指定的目录，代码如下：

三、 效果图（左为上传前的照片，右为上传后的照片）

           

上传图片，通过node服务器存储在指定目录的更多相关文章

  1. 快速搭建vsftp 服务器并配置指定目录

    1  搭建vsftp 服务器 前期准备: 1.用root 进入系统 2.使用命令 rpm  -qa|grep vsftpd 查看系统是否安装了ftp,若安装了vsftp,使用这个命令会在屏幕上显示vs ...

  2. 在Node.js中在保持目录结构的情况下压缩指定目录

    最近在做一个文件升级的功能,需要从下载服务器中指定目录下的文件.在学习了zlib后发现这个模块达不到这个功能 在查找资料后发现后发现 archiver 模块很好用,不过我也发现大部分中文资料没有如果查 ...

  3. 获取小众ftp服务器指定目录内容列表

    今天获取小众ftp服务器指定目录内容列表时费劲急了. ///parama url="ftp://x.x.x.x/dir_name" public string GetFTPDir( ...

  4. linux下nginx服务器域名指定目录

    一般,域名指定ip之后,需要在ip所在的机器去指定相应站点的目录,否则域名会不起作用: 下面说说linux下的nginx服务器指定目录的细节: 域名绑定目录的配置文件都放到这里: /usr/local ...

  5. koa-static node服务器设置静态目录

    最近毕设需要用到上传照片,但当node服务器成功获取前端传来的图片时,又不知道如何在页面获取服务器image目录下的图片,一直报以下错误: 问题主要是无法找到图片url,虽然可以一个个在app.js文 ...

  6. python 实现统计ftp服务器指定目录下文件夹数目、文件数目及所有文件大小

    本次主要为满足应用方核对上传到ftp服务器的文件是否缺漏. 主要要求:指定目录下,文件夹数目/文件数目/所有文件大小,类似Windows如下功能: 模块介绍: from ftplib import F ...

  7. PHP遍历指定目录，并存储目录内所有文件属性信息

    项目需要,需要写一个函数,能够遍历指定目录中的所有文件,而且这个目录中的子目录也要遍历.输出文件的属性信息,并存储. 想想需求,不就是一个ls -al命令吗,实现获取相关属性就好了,再加上一个遍历OK ...

  8. socket实现两台FTP服务器指定目录下的文件转移（不依赖第三方jar包）

    通过socket实现两台FTP服务器指定目录下的文件转移,其中包含了基础了ftp文件列表显示.上传和下载.这里仅供学习用,需掌握的点有socket.ftp命令.文件流读取转换等 完整代码如下: Ftp ...

  9. php实现远程网络文件下载到服务器指定目录(方法一)

    PHP实现远程网络文件下载到服务器指定目录(方法一) <?php function getFile($url, $save_dir = '', $filename = '', $type = 0 ...

随机推荐

  1. Go 只读/只写channel

    Go中channel可以是只读.只写.同时可读写的. //定义只读的channel read_only := make (<-chan int) //定义只写的channel write_onl ...

  2. 基础知识：语言、编程、计算机组成、cpu、存储器

    2019年3月18日一.    语言:一种事物与另外一种事物沟通的介质.              编程语言:程序员与计算机沟通的介质.    编程:把要让计算机做的事用一种编程语言表达出来.    ...

  3. 关于视频断点续播和H5的本地存储

    前段时间,需要在下实现一个视频的断点续播功能,呃,我不会呀,这就很尴尬了.然后呢,在下就想起了一个叫做localStorage的东西.这是个什么东西呢?在网上查阅了一些资料后,在下发现这是webSto ...

  4. 学习day03

    1.结构标记  *****   做布局    1.<header>元素    <header></header>    ==> <div id=&quo ...

  5. IM多类型holder封装

    如标题,这是一个在列表多类型视图时的一个简化封装方法,减少多余代码,提高复用性,更好迭代扩展,先看视图列表效果图 GitHub:https://github.com/1024477951/Fragme ...

  6. BASE64编码的图片在网页中的显示问题的解决

    BASE64位转码有两种: 一种是图片转为Base64编码,这种编码是直接可以在页面通过<img src='base64编码'/>的方式显示 Base64 在CSS中的使用 .demoIm ...

  7. 『cURL』curl: (6) Could not resolve host无法解析主机地址

    最近在学数据挖掘时,获取数据有两种途径: 开放数据,可以直接使用和存储的数据: 网络数据,通过爬虫或云市场api(付费或免费)获取数据 我通过教程,在阿里云购买一个天气数据api,尝试使用cURL获取 ...

  8. Python之excel文件追加内容

    首先要安装三个模块:xlrd,xlwt,xlutils 命令:pip install xlrd xlwt xlutils 示例代码: #!/usr/bin/env python # -*- codin ...

  9. 当锚点遇到fixed

    问题:页面内容导航fixed+锚点错位 solution: 锚点定位跟外边距没有关系. 我们使用内边距padding-top=fixed导航高度来使锚点可以精准定位: 此时新的问题产生了,内边距的存在 ...

  10. ubuntu如何安装chromium浏览器并设置成中文版

    在Ubuntu上使用APT安装Chromium有3种方法: 1.在Ubuntu软件中心输入chromium,然后在结果中选择安装即可. 2.在新立得软件包管理器中输入chromium,然后标记安装即可 ...