CORS Issue, requests from angular app are blocked #7558

Discussions
2

Responses to the discussion on Github

derrickmehaffy107d ago

Collaborator

The default settings for CORs shouldn’t cause you issues, but it also looks like you are setting them in the wrong file.

VukMNE107d ago

Author

@derrickmehaffy Thank you for attention and responding.

The file security.json that I wrote this setting is located in: config/environments/development

VukMNE106d ago

Author

@derrickmehaffy I undestand your disbelief, but I did everything according to the strapi documentation, and the requests from angular app are still getting blocked.

derrickmehaffy105d ago

Collaborator

I see the confusion here, you are using the old beta docs but are using the stable release, in which case the relevant docs are: https://strapi.io/documentation/v3.x/concepts/middlewares.html#security-middlewares

VukMNE105d ago

Author

Thanks for the reply.

Unfortunately, I still have the same problem.

Here is my ./config/middleware.js

module.exports = {
  settings: {
    cors: {
	  enabled: true,
      origin: ['*']
    }
  }
};

error_strapi

Here is my strapi project.

Here is my angular app.

If you run both of these projects on your computer, you will get the error from the picture above.

derrickmehaffy104d ago

Collaborator

Hi @VukMNE So in looking through both projects, in your ztk-sajt/src/app/shared/services/data.service.ts You have two headers set that shouldn’t be sent from the angular app.

On lines 19 and 20:

  constructor(private http: HttpClient) {
    this.config = new Config();
    this.baseUrl = this.config.baseUrl;
    this.header = new HttpHeaders({
      'Content-Type': 'application/json',
      // 'Access-Control-Allow-Headers': '*',
      // 'Access-Control-Allow-Origin': '*'
    });
  }

You are sending two Access-Control-Allow-* headers from the angular app to Strapi, these should never be sent in a Request and are only send in a response. Angular should only send Access-Control-Request-* and Strapi will respond with Access-Control-Allow-* headers.

VukMNE104d ago

Author

I see, thanks. It works smoothly without those headers now.

petersg83104d ago

Maintainer

Hi :slight_smile:
I think you missed some parts in the migration guide: https://strapi.io/documentation/v3.x/migration-guide/migration-guide-beta.20-to-3.0.0.html#middlewares

Can you please move your security.json file to ./config/env/development/middleware.js ?

Update content:

module.exports = {
  settings: {
    cors: {
      enabled: true,
      origin: '*',
      expose: ['WWW-Authenticate', 'Server-Authorization', 'Access-Control-Expose-Headers'],
      maxAge: 31536000,
      credentials: true,
      methods: ['GET', 'POST', 'PUT', 'PATCH', 'DELETE', 'OPTIONS', 'HEAD'],
      headers: [
        'Content-Type',
        'Authorization',
        'X-Frame-Options',
        'Origin',
        'Access-Control-Allow-Headers',
        'access-control-allow-origin',
      ],
    },
  },
};

VukMNE104d ago

Author

Thanks. After moving file to this location, it is working smoothly now :slight_smile:

ducdk23d ago

i config in ./config/env/product/middleware.js but not working