Flask API deployed, having CORS issue: facing The 'Access-Control-Allow-Origin' header has a value 'http://localhost/3000' that is not equal to the supplied origin

1

Access to fetch at ‘our_url’ from origin ‘http://localhost:3000’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: The ‘Access-Control-Allow-Origin’ header has a value ‘http://localhost/3000’ that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

we’ve made these changes in the code

` app = Flask(name)
CORS(app, resources={r"/api/": {“origins”: ""}})

@app.after_request
def add_cors_headers(response):
    response.headers["Access-Control-Allow-Origin"] = "http://localhost/3000" # <- You can change "*" for a domain for example "http://localhost"
    response.headers["Access-Control-Allow-Methods"] = "POST, GET, OPTIONS, PUT, DELETE"
    response.headers["Access-Control-Allow-Headers"] = "Accept, Content-Type, Origin"
    response.headers["Access-Control-Allow-Credentials"] = "true"
    return response

`

let me know if you need anything else

2

Hi there,

In a hosted environment, the origin host will not be localhost. You may need to edit this to include the external hostname for your Render service. We do have some available environment variables on services, including RENDER_EXTERNAL___HOSTNAME.

Best,

3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.