Question

我在nodejs express应用程序中使用了swagger。不出所料，它应该给ui作为响应，但是我正在获取html代码。我不知道这里出了什么问题。这是我的招摇代码

var swaggerUi = require('swagger-ui-express');
// swagger definition
var swaggerDefinition = {
  info: {
    title: 'expense manager api',
    version: '3.0.0',
    description: 'api docs for all apis',
  },
  host: 'localhost:8080',
  basePath: '/',
};
// options for the swagger docs
var options = {
  // import swaggerDefinitions
  swaggerDefinition: swaggerDefinition,
  // path to the API docs
  apis: ['./server/routes/admin_routes/*.js','./server/routes/user_routes/*.js'],// pass all in array
  };
var swaggerSpec = swaggerJSDoc(options);
app.get('/swagger.json', function(req, res) {   res.setHeader('Content-Type', 'application/json');   res.send(swaggerSpec); });
app.get('/api-docs',swaggerUi.serve,swaggerUi.setup(swaggerSpec));

但是在转到localhost：8080 / api-docs /时，它会提供原始的html代码。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Swagger UI</title>
  <link rel="stylesheet" type="text/css" href="./swagger-ui.css" >
  <link rel="icon" type="image/png" href="./favicon-32x32.png" sizes="32x32" /><link rel="icon" type="image/png" href="./favicon-16x16.png" sizes="16x16" />

  <style>
    html
    {
        box-sizing: border-box;
        overflow: -moz-scrollbars-vertical;
        overflow-y: scroll;
    }
    *,
    *:before,
    *:after
    {
        box-sizing: inherit;
    }

    body {
      margin:0;
      background: #fafafa;
    }
  </style>
</head>

<body>

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="position:absolute;width:0;height:0">
  <defs>
    <symbol viewBox="0 0 20 20" id="unlocked">

我不知道这里出了什么问题。任何帮助都将是非常有用的。谢谢您

Answer 1

根据文档使用app.use（）代替app.get（）。（enter link description here）

app.use('/api-docs',swaggerUi.serve,swaggerUi.setup(swaggerSpec));

Answer 2

之所以会发生这种情况，是因为您的express已配置为始终使用内容类型的应用程序/ json进行响应。将Swagger配置放在其他设置之前，以便您的快递用text / html响应请求

swagger ui在express nodejs中显示原始html代码

2 个答案: