Javascript 使用可以在浏览器中渲染的Node/Restify返回生成的SVG？_Javascript_Node.js_Svg_Restify

Javascript 使用可以在浏览器中渲染的Node/Restify返回生成的SVG？

javascript node.js svg

Javascript 使用可以在浏览器中渲染的Node/Restify返回生成的SVG？,javascript,node.js,svg,restify,Javascript,Node.js,Svg,Restify,我目前正在向现有节点添加一个新的GET端点（v8.11.2） )+Restify（^7.6.0）服务，目标是根据查询参数生成自定义SVG 到目前为止，我已经让我的端点在浏览器中返回svg文本，只需将其作为响应发送回去： res.send('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="400" height="180"> &

我目前正在向现有节点添加一个新的GET端点（v8.11.2） )+Restify（^7.6.0）服务，目标是根据查询参数生成自定义SVG

到目前为止，我已经让我的端点在浏览器中返回svg文本，只需将其作为响应发送回去：

res.send('<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> ');

及

在调用带有svg内容的

res.send

之前，浏览器会尝试下载图像，而不是渲染图像

我也尝试过使用url作为图像src的裸体html页面，但没有成功，如下所示：

<html>
  <head></head>
  <body>
    <img src="http://localhost:8080/marker/svg" alt="">
  </body>
</html>

这是一个精简的裸体服务器，仍然复制相同的问题：

var restify = require('restify');

function respond(req, res, next) {
  res.header('Content-Type', 'image/svg+xml');
  res.send('<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> ');
}

var server = restify.createServer();
server.get('/', respond);

server.listen(8080, function() {
  console.log('%s listening at %s', server.name, server.url);
});

var restify=require（'restify'）；
功能响应（req、res、next）{
res.header（'Content-Type'，'image/svg+xml'）；
res.send（“”）；
}
var server=restify.createServer（）；
获取（“/”，响应）；
listen（8080，函数（）{
console.log（“%s”在%s、server.name、server.url上侦听）；
});

我希望能够在浏览器中点击localhost:8080/api/svg，然后像直接打开/提供svg文件一样查看svg。提前谢谢你

使用sendRaw（）而不是send（）。send（）过滤您的数据内容。

您尝试过sendRaw（）吗？@sancelot成功了，谢谢！我将把它作为答案发布；-）。谢谢

<html>
  <head></head>
  <body>
    <img src="http://localhost:8080/marker/svg" alt="">
  </body>
</html>

var restify = require('restify');

function respond(req, res, next) {
  res.header('Content-Type', 'image/svg+xml');
  res.send('<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> ');
}

var server = restify.createServer();
server.get('/', respond);

server.listen(8080, function() {
  console.log('%s listening at %s', server.name, server.url);
});