Django + Vue.js GET /ws HTTP/1.1 404 2292 error every second

Issue

I am building a project with Vue.js on the front-end and Django on the back-end. I am using port 8000 for Django and port 8080 for Vue.js. Every time I route to something on the 8080 port, I get this error like this that gets printed out every second:

[01/Apr/2022 17:18:57] "GET /ws HTTP/1.1" 404 2292
Not Found: /ws

This is my vue.config.js:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    proxy: {
      '^/ws': {
        target: 'http://localhost:8000'
      }
    }
  }
})

Here is the Django urls.py:

urlpatterns = [
    path('favicon.ico', include('django.contrib.staticfiles.urls')),
    path('admin/', admin.site.urls),
    path('api/', include('users.urls')),
    path('api/', include('leagues.urls')),
]

I can’t figure out why this happens or how to fix it.

Solution

I found the solution to a similar way as Thomas. It seems that the default behavior of setting a proxy in vue.config.js is to send a GET request to /ws. I had to change the /ws in Thomas’s answer to /api since that is what the back-end uses for their routes, so I ended up with this:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    proxy: {
      '^/api': {
        target: 'http://localhost:8000'
      }
    }
  }
})

Answered By – amicharski

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0