Websocket.send method not doing anything in javascript even if the connection established successfully

guys, I had to implement WebSockets using channels in Django,but even after the connection is established successfully, WebSocket.send method is not working in javascript and it works only inside websocket.onopen here's my javascript code for the socket

let noteSocket = null
function connect(){
    noteSocket = new WebSocket('ws://' + window.location.host + `/ws/mycourses/{{ 
course.productId }}/chapters/{{ last_followed.chapter.chapterId }}/lessons/{{ 
last_followed.lessonId }}/notes/`)
noteSocket.onopen = function(e) {
  console.log("Successfully connected to the WebSocket.");
}
noteSocket.onclose = function(e) {
  console.log("WebSocket connection closed unexpectedly. Trying to reconnect in 
    2s...");
  setTimeout(function() {
      console.log("Reconnecting...");
      connect();
  }, 2000);
};
noteSocket.onmessage = function(e){
  const data = JSON.stringify(e.data)
  renderNote(data.note, data.timestamp)
}

}

after executing the connect function I get these in the Django development server terminal

WebSocket CONNECT /ws/mycourses/879521fa-75f9-4c95-8b61-039f7503ecae/chapters/91a12b16-35f7-4702-a002-35b228010a94/lessons/90a125ad-570e-437e-ac67-46cdeb55a068/notes/ [127.0.0.1:53424]

and I get from my browser console:

Successfully connected to the WebSocket.

I am using google chrome, and my os is arch Linux(note: I even tried in firefox but it didn't work)

Back to Top