Search code examples
dockervue.jsnginxnestjs

NestJS, Vue and nginx in different docker containers gives an CORS error

NestJS container with enabled CORS:

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { ValidationPipe } from '@nestjs/common';
import * as cors from 'cors';

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

  app.use(cors({ origin: '*' }));

  app.useGlobalPipes(new ValidationPipe());
  await app.listen(8802);
}

bootstrap();

Vue container with requests to adress: https://api:8802

Error messages:

In Firefox:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource 

In Chrome:
net::ERR_HTTP2_PROTOCOL_ERROR

I tried everything and nothing works

Solution

  • As per the NestJS docs, you should be able to use:

    app.enableCors();

    Or:

    const app = await NestFactory.create(AppModule, { cors: true });

    Instead of:

    app.use(cors({ origin: '*' }));