koa2中使用koa-multer上传图片成功后,访问图片地址提示需要token

使用jwt进行了路由鉴权

app.use(koajwt({
  secret:"jianshu-server-jwt"
}).unless({
  path: ['/user/login']
}))

koa-multer上传图片成功后,访问图片地址提示需要token,怎么解决?烦请知道的同学指点,谢谢

如果使用koa2和koa-multer上传图片成功,但访问图片地址时提示需要token,很可能是上传后保存的文件路径和访问路径不匹配导致的。以下是一些可能的解决方案:

检查文件存储路径是否正确
在使用koa-multer上传文件时,我们需要使用“path”模块生成存储路径,并将其添加到文件上传中间件中。例如:

const multer = require('koa-multer');
const path = require('path');

const storage = multer.diskStorage({
  destination: function (req, file, callback) {
    callback(null, './uploads');
  },
  filename: function (req, file, callback) {
    const ext = path.extname(file.originalname);
    callback(null, Date.now() + ext);
  }
});

const upload = multer({ storage: storage });

在这个例子中,我们指定存储路径为“./uploads”,表示上传的文件将会保存在该目录下。如果你访问的图片路径并不匹配该存储路径,你可以将路径更改为匹配的路径。

使用静态文件服务
如果你的应用程序使用了koa-static等静态文件服务中间件来提供图片文件服务,请确保将图片文件存储在静态目录中,中间件的静态目录应该与你的存储路径一致。例如:

const Koa = require('koa');
const path = require('path');
const serve = require('koa-static');

const app = new Koa();

// Serve the "uploads" directory as a static directory
app.use(serve(path.join(__dirname, './uploads')));

app.listen(3000, () => {
  console.log('Server is running on http://localhost:3000');
});

在这个例子中,“uploads”目录被提供为静态目录服务,“koa-static”中间件会自动将该目录下的文件提供为静态文件服务,你可以访问http://localhost:3000/uploads/目录下的文件。请注意,此时必须将存储路径和中间件的静态目录设置为相同的路径。

如果这些方法都无法解决问题,请检查你的应用程序中是否存在其他中间件或业务逻辑会影响图片访问,你可能需要仔细检查代码以找出问题的根源。

不知道你这个问题是否已经解决, 如果还没有解决的话:
  • 以下回答来自chatgpt:

    回答:

    该问题的解决方案是在服务端添加中间件进行token验证。

    1. 在服务端创建一个token的中间件,验证请求中是否携带token,并验证token是否有效。可以使用jsonwebtoken库进行验证,代码如下:
    const jwt = require('jsonwebtoken');
    const secret = 'your_secret';
    
    function authenticateToken(req, res, next) {
      const token = req.headers['authorization'];
      if (token == null) return res.sendStatus(401);
      jwt.verify(token, secret, (err, user) => {
        if (err) return res.sendStatus(403);
        req.user = user;
        next();
      });
    }
    
    1. 在上传图片路由的中间件添加token的验证,代码如下:
    const upload = require('koa-multer')();
    const router = require('koa-router')();
    
    router.post('/upload', authenticateToken, upload.single('file'), async (ctx) => {
      //处理上传逻辑
    })
    

    其中,authenticateToken是自定义的token验证中间件,在上传图片的路由中间件中添加了该中间件,表示只有携带有效token的请求才能访问该路由。

    1. 在上传图片成功后的返回结果中包含图片地址加上token,代码示例如下:
    const token = jwt.sign({ userID: user.id }, secret, { expiresIn: '1h' });
    const imageUrl = `http://your_domain/uploads/${filename}?token=${token}`;
    ctx.body = {
      success: true,
      imageUrl,
    };
    

    这里通过jwt.sign方法生成token,然后拼接在图片地址后面,返回给客户端,客户端访问图片时就需要携带该token。

    以上就是解决koa-multer上传图片需要token访问提示的完整方案。


如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^