Flask flash not appearing on deployment

Question

@app.route("/communicate", methods = ["POST"])
def communicate():
  data = request.get_json()
  for i in data:
    flash(i)
    
  print(data)
  return "Hello"

I have this /communicate link that gets the json data from an event listener with

if (messages.length > 0) {
    e.preventDefault()
    let data = JSON.stringify(messages)
    
    fetch(`${window.origin}/communicate`, {
    method: "POST",
    credentials: "include",
    body: JSON.stringify(messages),
    cache: "no-cache",
    headers: new Headers({
      "content-type": "application/json"
    })
  })
    location.reload()
  }

When I'm testing the exact same code on my local the flash inside the for loop is working. However, when I deployed it on heroku and pythonanywhere it stopped working.

Note: The /communicate route on deployment still gets the data from the js perfectly fine, it's just the flashing of every content of data that is bugging.

I tried these methods:

• Removing location.reload()
• Changing the get_flashed_messages() to a specific html file instead of being on base.html

Side note: I used location.reload() to refresh the page and load/update the flashed messages.

Thanks~

Answer 1

I see that using things such as flash() would just bring me more harm than using plain javascript and use empty small tags

const name = document.getElementById('username')
const password = document.getElementById('password')
const form = document.getElementById('mainform')
const second_password = document.getElementById("secure_pass")


const password_error = document.getElementById("password-error")
const second_error = document.getElementById("second-error")
const name_error = document.getElementById("name-error")

form.addEventListener('submit', (e) => {
  let messages = []
  if (name.value === '' || name.value == null) {
    messages.push('Filler')
    name_error.innerText = "Name is required."
  }
  else{
    name_error.innerText = ""
  }

  
  
  
  
  if (password.value != second_password.value || second_password.value != password.value){
    
    messages.push("Filler")
    second_error.innerText = "Password doesn't match"
  }
  else{
    second_error.innerText = ""
  }
  

  if (password.value.length >= 20) {
    messages.push('Filler')
    password_error.innerText = "Password should be less than 20 characters"
  }
  else if (password.value.length <= 8){
    messages.push('Filler')
    password_error.innerText = "Password should be atleast 8 characters"
  }
  else{
    password_error.innerText = ""
  }

  if (password.value === 'password') {
    messages.push('Password cannot be password \n')
  }

  if (messages.length > 0) {
    e.preventDefault()    
  }
 
})

P.s don't mind the "filler" I just made it to add a counter to prevent submit.

let count = 0 
count += 1 

Is simpler