How to use node+koa+axios to realize the function of picture upload and echo

Today, the editor to share with you how to use node+koa+axios to achieve picture upload and echo function of the relevant knowledge, detailed content, clear logic, I believe that most people are too aware of this knowledge, so share this article for your reference, I hope you have something to gain after reading this article, let's take a look at it.

Some libraries that you need to master before development

Koa: used to set up a web server

Koa2-cors: solving cross-domain problems

@ koa/router: routing processing of koa

Koa-body: the acquisition of koa parameters

Koa-static: static content

@ koa/multer multer: plug-in for uploading images

Code structure

Implementation code

1. Step 1: build a simple web service with koa+koa-router

/ / main.jsconst Koa = require ('koa') / / introduce koaconst Router = require (' koa-router') / / introduce koa-routerconst koaBody = require ('koa-body') router.get (' /' Async (ctx) = > {ctx.type = 'html' ctx.body =' hello worldview'}) app.use (router.routes ()) .use (router.allowedMethods ()) .use (koaBody ()) / start the service to listen for local port 3000 app.listen (3000, () = > {console.log ('the application has been launched Http://localhost:3000')})

Now we can open http://localhost:3000 and see hello world.

two。 Then we create a new upload folder and add code for static content to the code

/ / the new mian.js code const serve = require ('koa-static') const path = require (' path') app.use (serve (path.join (_ _ dirname,'. / upload')

At this point, if you add a photo to the upload folder, you can see it through http://localhost:3000/***.png. (*: add a suffix to your own new photo name)

3. Add a new index.html file and add the following code

Document