如何在swagger ui文档中使用本地json文件

我试图使用本地swagger.json文件在swagger文档中显示

我的swagger.json文件位于/home/user1/swagger ui/dist/swagger.json下，index.html位于同一目录下。我修改了index.html，如下所示

 window.swaggerUi = new SwaggerUi({
    spec: ../swagger.json
    url: url,
    dom_id: "swagger-ui-container",

---

使用docker run-p 80:8080 swagger ui builder启动docker实例后，访问不会显示文档。附加屏幕截图以供参考。请帮我解决这个问题。

问题中提供的示例根本无法工作（缺少coma和

spec

不是招摇过市的属性）

要显示与

index.html

位于同一文件夹中的

swagger.json

文件，只需替换

url=”http://petstore.swagger.io/v2/swagger.json“

by

url=“swagger.json”

在

index.html

中

原始索引.html

      var url = window.location.search.match(/url=([^&]+)/);
      if (url && url.length > 1) {
        url = decodeURIComponent(url[1]);
      } else {
        url = "http://petstore.swagger.io/v2/swagger.json";
      }

      [...]

      window.swaggerUi = new SwaggerUi({
        url: url,
        dom_id: "swagger-ui-container",
        supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
        onComplete: function(swaggerApi, swaggerUi){
          if(typeof initOAuth == "function") {
            initOAuth({
              clientId: "your-client-id",
              clientSecret: "your-client-secret-if-required",
              realm: "your-realms",
              appName: "your-app-name",
              scopeSeparator: ",",
              additionalQueryStringParams: {}
            });
          }

修改：

      var url = window.location.search.match(/url=([^&]+)/);
      if (url && url.length > 1) {
        url = decodeURIComponent(url[1]);
      } else {
        url = "swagger.json";
      }

      [...]

      window.swaggerUi = new SwaggerUi({
        url: url,
        dom_id: "swagger-ui-container",
        supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
        onComplete: function(swaggerApi, swaggerUi){
          if(typeof initOAuth == "function") {
            initOAuth({
              clientId: "your-client-id",
              clientSecret: "your-client-secret-if-required",
              realm: "your-realms",
              appName: "your-app-name",
              scopeSeparator: ",",
              additionalQueryStringParams: {}
            });
          }

---

我找到了一个解决方案（如果您安装了node，那么这个解决方案非常快速、轻松）：

使用Node，全局安装包http服务器

npm安装-g http服务器

将目录更改为json所在的位置，并运行命令

httpserver--cors

（必须启用cors才能工作）

打开大摇大摆的用户界面（即dist/index.html）

键入输入字段并单击“浏览”

---

我有几个招摇过市的文件，并想很容易地在它们之间切换。所以我修改了index.html以获得第一个URL参数，并用它打开了swagger ui

我有不同文件的书签：

html？文件1

html？文件2

等等

window.onload=函数（）{
var url=window.location.search.substring（1）；
如果（url.length==0）{
url=“swagger.json”；
}
//建制
const ui=SwaggerUIBundle({
url:url，
dom_id:“#招摇过市用户界面”，
深度链接：是的，
预设：[
SwaggerUIBundle.presets.api，
昂首阔步
],
插件：[
SwaggerUIBundle.plugins.DownloadUrl
],
布局：“独立布局”
})
window.ui=ui
}

如果否决我的回答的人解释为什么它没有用，那就太好了。你知道这一点吗？解决方案是否可行？你做了什么？我也有同样的问题，在我的本地iis中一切都正常，但当我将其移动到远程服务器时，它就不工作了。它抛出无法读取文件错误。

<script>
window.onload = function() {

  var url = window.location.search.substring(1);

  if (url.length == 0) {
  url = "swagger.json";
  }

  // Build a system
  const ui = SwaggerUIBundle({
    url: url,
    dom_id: '#swagger-ui',
    deepLinking: true,
    presets: [
     SwaggerUIBundle.presets.apis,
     SwaggerUIStandalonePreset
    ],
    plugins: [
     SwaggerUIBundle.plugins.DownloadUrl
    ],
    layout: "StandaloneLayout"
 })
window.ui = ui
}
</script>