我最近遇到了这个问题。
幸运的是我找到了一个可行的解决方案
解决方案有点hacky
第一个解决方案
是给你获取api的招摇的JSON文件托管它并将其与招摇的用户界面资源管理器
- 为您服务招摇的JSON文件静态地使用 nestjs
- 获取路径招摇的JSON文件在你的 vercel 服务器上
- 将它与招摇的用户界面资源管理器
如何实现解决方案 1
脚步
- 在您的本地机器/开发机器上将
NODE_ENV变量设置为发展.
在你的.env 文件
NODE_ENV="development"
在你的app.module.ts
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { ServeStaticModule } from '@nestjs/serve-static';
import { join } from 'path';
@Module({
imports: [
ServeStaticModule.forRoot({
rootPath: join(__dirname, '..', 'swagger-static'),
serveRoot: process.env.NODE_ENV === 'development' ? '/' : '/swagger',
}),
],
controllers: [AppController],
providers: [AppService],
})
export class AppModule {}
- 每次您的应用程序开始开发时，您都会生成您的 api
s swagger json 并存储在
swagger.json文件中大摇大摆的静态文件夹在你项目的根目录
这个issue on github讨论了如何生成一个招摇的JSON文件为你的 api
下面是关于如何生成swagger.json文件的代码sn-p
在你的main.ts
import { NestFactory } from '@nestjs/core';
import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
import { AppModule } from './app.module';
import { resolve } from 'path';
import { writeFileSync } from 'fs';
async function bootstrap() {
const app = await NestFactory.create(AppModule);
const options = new DocumentBuilder()
.setTitle('Cats example')
.setDescription('The cats API description')
.setVersion('1.0')
.addTag('cats')
.build();
const document = SwaggerModule.createDocument(app, options);
SwaggerModule.setup('/swagger', app, document);
await app.listen(process.env.PORT || 3000);
// get the swagger json file (if app is running in development mode)
if (process.env.NODE_ENV === 'development') {
const pathToSwaggerStaticFolder = resolve(process.cwd(), 'swagger-static');
// write swagger json file
const pathToSwaggerJson = resolve(
pathToSwaggerStaticFolder,
'swagger.json',
);
const swaggerJson = JSON.stringify(document, null, 2);
writeFileSync(pathToSwaggerJson, swaggerJson);
console.log(`Swagger JSON file written to: '/swagger-static/swagger.json'`);
}
}
bootstrap();
方案二（推荐）
是在开发中获取丢失的 swagger 文件并在 vercel 上手动静态地提供它们（您的生产服务）
如何实现解决方案 2
脚步
- 在您的本地机器/开发机器上将
NODE_ENV变量设置为发展.
在你的.env 文件
NODE_ENV="development"
在你的app.module.ts
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { ServeStaticModule } from '@nestjs/serve-static';
import { join } from 'path';
@Module({
imports: [
ServeStaticModule.forRoot({
rootPath: join(__dirname, '..', 'swagger-static'),
serveRoot: process.env.NODE_ENV === 'development' ? '/' : '/swagger',
}),
],
controllers: [AppController],
providers: [AppService],
})
export class AppModule {}
-
每次您的应用程序开始开发时，您都会进行 http 调用以获取生产服务器上丢失的 swagger ui 资源。
在我的例子中，丢失的文件是swagger-ui-bundle.js、swagger-ui-init.js、swagger-ui-standalone-preset.js和swagger-ui.css
-
在您的应用程序启动后的 main.ts 文件中，检查您的应用程序是否正在开发中，获取缺少的 swagger 资源，然后将它们存储在大摇大摆的静态文件夹在你的根目录
import { NestFactory } from '@nestjs/core';
import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
import { AppModule } from './app.module';
// core
import { resolve } from 'path';
import { writeFileSync, createWriteStream } from 'fs';
import { get } from 'http';
async function bootstrap() {
const app = await NestFactory.create(AppModule);
const options = new DocumentBuilder()
.setTitle('Cats example')
.setDescription('The cats API description')
.setVersion('1.0')
.addTag('cats')
.build();
const document = SwaggerModule.createDocument(app, options);
SwaggerModule.setup('/swagger', app, document);
await app.listen(process.env.PORT || 3000);
// get the swagger json file (if app is running in development mode)
if (process.env.NODE_ENV === 'development') {
// write swagger ui files
get(
`${serverUrl}/swagger/swagger-ui-bundle.js`, function
(response) {
response.pipe(createWriteStream('swagger-static/swagger-ui-bundle.js'));
console.log(
`Swagger UI bundle file written to: '/swagger-static/swagger-ui-bundle.js'`,
);
});
get(`${serverUrl}/swagger/swagger-ui-init.js`, function (response) {
response.pipe(createWriteStream('swagger-static/swagger-ui-init.js'));
console.log(
`Swagger UI init file written to: '/swagger-static/swagger-ui-init.js'`,
);
});
get(
`${serverUrl}/swagger/swagger-ui-standalone-preset.js`,
function (response) {
response.pipe(
createWriteStream('swagger-static/swagger-ui-standalone-preset.js'),
);
console.log(
`Swagger UI standalone preset file written to: '/swagger-static/swagger-ui-standalone-preset.js'`,
);
});
get(`${serverUrl}/swagger/swagger-ui.css`, function (response) {
response.pipe(createWriteStream('swagger-static/swagger-ui.css'));
console.log(
`Swagger UI css file written to: '/swagger-static/swagger-ui.css'`,
);
});
}
}
bootstrap();
-
现在，每次您的应用程序开始开发时，都会在本地获取丢失的 swagger 并存储在大摇大摆的静态文件夹
-
在生产文件中丢失将根据您的 vercel 服务器上的请求提供
-
将您的更改推送到 vercel 并测试您的招摇。现在一切都应该正常工作