1

I have an app that all queries and mutations work fine, but one mutation in special the cors policy block it.

Access to fetch at 'backend' from origin 'frontend' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

If I get this same mutation and try on graphql playground or postman, the mutation works perfectly.

I already try to add an interceptor in my front-end to ignore cors, but doesn’t work.

import { GraphQLRequest } from 'apollo-link';
import { Service } from 'typedi';
import { Context } from 'vm';
import { GraphqlInterceptor } from '@app/core/graphql';

@Service()
export class CorsGraphqlInterceptor implements GraphqlInterceptor {
  async before(_req: GraphQLRequest, { headers = {} }: Context): Promise<Context> {
    headers['Access-Control-Allow-Origin'] = '*';
    // headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept';
    // headers['Sec-Fetch-Mode'] = 'no-cors';
    // headers['Sec-Fetch-Site'] = 'none';
    return { headers };
  }
}

As you can see the request have the header 'Access-Control-Allow-Origin' but show this error yet.

access-control-allow-origin: *

Someone already pass by the same problem? Thanks!

Develop_SP
  • 382
  • 5
  • 19
  • Your JavaScript requires permission from the server you are requesting the data from for it to access the data. It cannot give itself permission to access data on other servers. – Quentin Apr 14 '21 at 21:17
  • It have permission, it's only one mutation that occurs this. The rest of all site works perfectly. – Develop_SP Apr 15 '21 at 11:39

0 Answers0