node express项目中使用了connect-history-api-fallback中间件后原有的获取图片接口加载失败

发布于 2022-09-07 08:11:28 字数 1866 浏览 16 评论 0

如题

接口代码如下

/ get /avatar/file_id
router.get('/avatar', async (req, res, next) => {
    const id = req.query.file_id
    const url = await FileModel.getFilePath(id)
    res.set('content-type', 'image/jpg')
    let stream = fs.createReadStream(url)
    let responseData = []; // 存储文件流
    if (stream) { // 判断状态
        stream.on('data', chunk => {
            responseData.push(chunk)
        })
        stream.on('end', () => {
            let finalData = Buffer.concat(responseData)
            res.write(finalData)
            res.end();
        });
    }
})

FileModel.getFilePath 代码如下

// 获取文件路径
handleFile.getFilePath = async function  (id) {
    let fileObject = await handleFile.getFileById(id)
    return path.join(__dirname, `../uploads/${fileObject.filename}`)
}

index.js 引入 history 代码如下

const express = require('express')
const session = require('express-session')
const bodyParser = require('body-parser')
const routes = require('./routes')
const history = require('connect-history-api-fallback')
const path = require('path')
const favicon = require('serve-favicon')

const app = new express()

app.use(history())
app.use(bodyParser.urlencoded({extended: true}))
app.use(express.static(path.join(__dirname, '../dist')))
app.use(favicon(path.join(__dirname, './favicon.ico')))



const sessionStore = new session.MemoryStore({ reapInterval: 3600 * 1000 })
app.use(session({
    secret: 'Stefanie Sun',
    store: sessionStore,
    resave: true, // 强制更新 session
    saveUninitialized: true,  // 
    cookie: { maxAge: 3600 * 1000 }, // 过期时间
    rolling: true
}))


routes(app)

但是在界面中使用获取图片接口时报了 304 且获取不到文件

clipboard.png

我将 history 删掉后就一切正常
求问这个怎么解决

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

怕倦 2022-09-14 08:11:28

解决了,其实是用了connect-history-api-fallback中间件后所有的get请求都会变成index,所以get请求根本没有执行,设置rewrites就行了

app.use(history({
    rewrites: [
      {
        from: /^\/api\/.*$/,
        to: function(context) {
            return context.parsedUrl.path
        }
      }
    ]
  }))

设置了rewrites之后表示所有带api的get都代理到parsedUrl.path,其实就是原来的路径

野稚 2022-09-14 08:11:28

这个包是干啥的啊,能对stream流使用吗

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文