Question

我在the official tutorial之后启用了NestJS应用中的CORS，因此我的main.ts如下所示：

import { FastifyAdapter, NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule, new FastifyAdapter(), { cors: true });
  await app.listen(3000);
}
bootstrap();

，并且当我使用npm run start:dev运行应用程序时，它可以工作。

但是，当我尝试先使用npm run webpack编译应用程序，然后使用node server.js运行该应用程序时，CORS将无法正常工作。

来自客户端的http请求将失败，并显示以下信息：

对预检请求的响应未通过访问控制检查：所请求的资源上不存在“ Access-Control-Allow-Origin”标头。因此，不允许访问来源“ http://localhost:8000”。响应的HTTP状态代码为404。

Answer 1

尝试使用此处https://docs.nestjs.com/techniques/security#cors

中描述的方法

const app = await NestFactory.create(ApplicationModule);
app.enableCors();
await app.listen(3000);

Answer 2

如果使用graphql运行NestJs，则会遇到Apollo服务器将覆盖CORS设置see link的问题。这在下面解决了问题。我为此浪费了8个小时。 :-(我希望您能看到并且您不这样做。请参见link和link

        GraphQLModule.forRoot({
            debug: process.env.NODE_ENV !== 'production',
            playground: process.env.NODE_ENV !== 'production',
            typePaths: ['./**/*.graphql'],
            installSubscriptionHandlers: true,
            context: ({req}) => {
                return {req};
            },
            cors: {
                credentials: true,
                origin: true,
            },
        }),

然后在您的main.ts中：

        app.enableCors({
            origin: true,
            methods: 'GET,HEAD,PUT,PATCH,POST,DELETE,OPTIONS',
            credentials: true,
        });

Answer 3

伤心地知道，你也尝试：

const app = await NestFactory.create(ApplicationModule);
app.enableCors();
await app.listen(3000);

它仍然无法正常工作。

确保在服务器端启用了cors，该操作应如下所示：

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  res.header('Access-Control-Allow-Headers', 'Content-Type, Accept');
  next();
});

还要确保您的浏览器受cors支持。如果上述所有方法仍然无效，建议您下载Allow-Control-Allow-Origin Chrome扩展程序，它应该可以解决您的问题。

Answer 4

也许您使用以下白名单获得 undefined。如果您不想阻止 REST 工具 或 服务器到服务器请求，请添加!origin 检查原点函数，如下所示：

const whitelist = ['example.com', 'api.example.com'];
app.enableCors({
  origin: function (origin, callback) {
    if (!origin || whitelist.indexOf(origin) !== -1) {
      callback(null, true)
    } else {
      callback(new Error('Not allowed by CORS'))
    }
  },
  ...
});

Answer 5

我可以通过提供自己的origin函数来使其工作。完整的enableCors函数类似于NestJS或任何NodeJS服务器，例如：

var whitelist = ['https://website.com', 'https://www.website.com'];
app.enableCors({
origin: function (origin, callback) {
  if (whitelist.indexOf(origin) !== -1) {
    console.log("allowed cors for:", origin)
    callback(null, true)
  } else {
    console.log("blocked cors for:", origin)
    callback(new Error('Not allowed by CORS'))
  }
},
allowedHeaders: 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept, Observe',
methods: "GET,PUT,POST,DELETE,UPDATE,OPTIONS",
credentials: true,
});

和appOptions（如果您使用的是NestJS Express）：

const app = await NestFactory.create<NestExpressApplication>(AppModule);

Answer 6

某种程度上，问题是使用re.sub进行编译的。如果我使用import re s = ',Areas for further improvement,The school’s leaders are rightly seeking to improve the following areas:,,========2========,,3/5,Continue to focus on increasing performance at the higher levelsPupils’,literacy and numeracy skills across the curriculumStandards,in science throughout the schoolPupils’,numerical reasoning skills' new_s = re.sub('[A-Z]', lambda x:f',{x.group()}', re.sub('[,:\=]+', '', s))进行编译，它将可以正常工作。

感谢@ georgii-rychko通过评论提出建议。

Answer 7

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const PORT = 5000;
  const app = await NestFactory.create(AppModule);

  app.enableCors({credentials: true, origin: "http://localhost:3000"});

  await app.listen(PORT, () => console.log(`Server started`));
}

bootstrap();

粘贴您的 url 客户端，而不是“http://localhost:3000”

NestJS在生产中启用cors

7 个答案: