CODEWITHSUNDEEP
corsswaggerdocumentation
Iago Alexandre
Iago Alexandre

Reputation: 473

Failed to fetch. Possible Reasons: CORS Network Failure URL scheme must be "http" or "https" for CORS request

I'm trying to make a request to my local API from the Swagger documentation, but it always gives this error when I make the request

enter image description here

Upvotes: 26

Views: 115391

Answers (14)

rajlaxmi meshram
rajlaxmi meshram

Reputation: 3

I use laravel recently got this same error , So I set this parameter 'APP_URL, APP_WEB_URL, L5_SWAGGER_CONST_HOST' in my env file and then run swagger generate command this resolved my issue. I am adding image for reference enter image description here

Upvotes: 0

Ankit Sahay
Ankit Sahay

Reputation: 2043

In my case, the API was implemented using Flask and the API itself did not have CORS enabled.

I enabled it by adding following piece of code:

from flask_cors import CORS, cross_origin

app = Flask(__name__)
CORS(app)

PS: you will need to install flask-cors by runnings:

pip install flask-cors

Upvotes: 0

Aspiring Dev 23000
Aspiring Dev 23000

Reputation: 333

I use Spring boot, and in my Swagger config i fixed it by changing :

 @Server(
       url = "localhost:8080",
       description = "LOCAL"
 )

to :

 @Server(
     url = "http://localhost:8080",
     description = "LOCAL"
 )

Also declare this Bean in your swagger config :

    @Bean
    public CorsFilter corsFilter() {
            UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

            CorsConfiguration config = new CorsConfiguration();
            config.setAllowCredentials(true);
            config.addAllowedOrigin("*");
            config.addAllowedHeader("*");
            config.addAllowedMethod("*");

            source.registerCorsConfiguration("/v3/api-docs", config);
            return new CorsFilter(source);
    }

Upvotes: 0

siba36
siba36

Reputation: 193

In my case, I solved the issue by changing the site settings of the API that I'm using, in particular by allowing this permission: enter image description here

Upvotes: -1

Amey Chavan
Amey Chavan

Reputation: 9

I was encounter with same issue -To solve this make sure the port at which your application is running and port mention in server.js (servers URL ) of swagger is same. enter image description here

And then try again enter image description here

Upvotes: -1

Bart van Woesik
Bart van Woesik

Reputation: 166

For all users that also use FastApi, this resolved my issue:

from fastapi.middleware.cors import CORSMiddleware

# Define CORS settings
origins = ["*"]  # Allow requests from any origin

# Add CORS middleware
app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["GET", "POST", "PUT", "DELETE", "OPTIONS"],
    allow_headers=["*"],
)

Upvotes: 1

takashe1san
takashe1san

Reputation: 139

I know this is stupid but check if the server is runing

Upvotes: -1

Balraj
Balraj

Reputation: 41

With Open API Swagger Implementation, it worked for me by adding this to main application class.

@OpenAPIDefinition(
  servers = {
    @Server(url = "/myapp/", description = "Default Server URL")
  }
)

This allows both http and https connections without needing to select the scheme explicitly. So, both local (http) and dev server (https) works good.

Upvotes: 3

Olcaytp
Olcaytp

Reputation: 9

Choose the "http" option at the run icon on the top of the screen: enter image description here

Upvotes: 0

Konstantin Grigorov
Konstantin Grigorov

Reputation: 1612

A bit of an edge-case situation, but if you are running from a container, ensure you are doing your port forwarding correctly.

enter image description here

As one of the answers above states, your application should be running on localhost:<port_of_choice> instead of 127.0.0.1:<port_of_choice>

Upvotes: 1

Soukaina EL HAYOUNI
Soukaina EL HAYOUNI

Reputation: 391

First check that your address is not blocked by cors, for dev tests you can use Access-Control-Allow-Origin:*. If it doesn't work for you, check that you are not using an extension on your browser, such as those that block ads. You delete it from your browser, restart it and test again, it will work.

Upvotes: 9

Jood80
Jood80

Reputation: 150

In swagger.json I accidently sat my host port to http://localhost:3000 and my server was running on port :5000. Once I updated the host port to match the one I'm using to send my requests using swagger ui, the problem's gone.

Upvotes: 3

Yalchin Mammadli
Yalchin Mammadli

Reputation: 567

In my case, I was accessing the web application via 127.0.0.1:3000, once I changed it to localhost:3000, it worked, hope that helps

Upvotes: 8

aseman arabsorkhi
aseman arabsorkhi

Reputation: 362

after Starting IIS Express ... web API register on 2 URL, one port is for http, and the other one is for https. when you call http port you see this error:Failed to fetch. Possible Reasons: CORS Network Failure URL scheme must be "http" or "https" for CORS request. change the port to https Port.

Upvotes: 3

Related Questions