Access to XMLHttpRequest blocked by CORS policy · Issue #1035 · mher/flower

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement . We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Describe the bug
A flower request made through axios in react is apparently blocked by CORS

To Reproduce
Steps to reproduce the behavior:

Using axios in react on localhost:3000, make request to flower API as follows:

    axios.post('http://localhost:5555/api/task/apply/celery_app.tasks.call_main_task', {
        headers: {
          'Content-Type': 'application/json'
        data: {
          "args": [newMessage]
A celery server is running with the task call_main_task running.
A flower instance is serving the celery task.
Flower console shows:
[E 201029 09:17:16 web:1792] Uncaught exception OPTIONS /api/task/apply/celery_app.tasks.call_main_task (127.0.0.1)
    HTTPServerRequest(protocol='http', host='localhost:5555', method='OPTIONS', uri='/api/task/apply/celery_app.tasks.call_rasa_nlp', version='HTTP/1.1', remote_ip='127.0.0.1')
    Traceback (most recent call last):
      File "/Users/aaronbriel/pinklion/ai/jugglechat/.venv/lib/python3.7/site-packages/tornado/web.py", line 1701, in _execute
        result = method(*self.path_args, **self.path_kwargs)
    TypeError: options() takes 1 positional argument but 2 were given
^Cmake: *** [start_flower] Error 1
Browser console log shows:
Access to XMLHttpRequest at 'http://localhost:5555/api/task/apply/celery_app.tasks.call_main_task' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
xhr.js:177 POST http://localhost:5555/api/task/apply/celery_app.tasks.call_main_task net::ERR_FAILED
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:13
dispatchRequest @ dispatchRequest.js:52
Promise.then (async)
request @ Axios.js:61
Axios.<computed> @ Axios.js:87
wrap @ bind.js:9
handleNewUserMessage @ Chat.tsx:89
onSendMessage @ index.js:20
callCallback @ react-dom.development.js:3945
dispatchDiscreteEvent @ react-dom.development.js:5889
createError.js:16 Uncaught (in promise) Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:84)
Trying various constructions of the post call did not resolve the issue. Normal curl requests work fine.
Expected behavior

I expected a response from the POST request to the flower API. Looking at #429 implies that the issue was resolved. Using the master branch in case #994 was not yet available in pypi didn't resolve the issue.
System information

flower   -> flower:0.9.5 tornado:6.0.4 humanize:3.1.0

software -> celery:4.4.7 (cliffs) kombu:4.6.11 py:3.7.9

billiard:3.6.3.0 py-amqp:2.6.1

platform -> system:Darwin arch:64bit

kernel version:18.7.0 imp:CPython

loader   -> celery.loaders.app.AppLoader

settings -> transport:amqp results:disabled