渲染svg文件并使用express提供服务

Question

我想知道如何使用Express渲染和提供svg文件.

现在,我可以将svg作为原始XML文件提供.这是我在做的事情:

路线

router.get('/status', function (req, res, next) {
  res.setHeader('Content-Type', 'image/svg+xml');
  res.sendFile(path.join(__dirname, '../views/status.svg'));
});

SVG

<svg width="400" height="180">
  <rect x="50" y="20" rx="20" ry="20" width="150" height="150" style="fill:red;stroke: black;stroke-width:5;opacity:0.5" />
</svg>

当我点击该路线时,svg文件的原始XML将提供给浏览器.如何首先将其渲染为SVG图像,然后将其提供？

Answer 1

将SVG文件修改为此文件

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="400" height="180">
  <rect x="50" y="20" rx="20" ry="20" width="150" height="150" style="fill:red;stroke: black;stroke-width:5;opacity:0.5" />
</svg>