Aquí es donde estoy activando el evento Pusher.
@app.route('/post-question', methods=['POST']) def add_question(): data_received = json.loads(request.data) data = { 'id':'post-{}'.format(uuid.uuid4().hex), 'title':data_received['title'], 'question':data_received['content'], 'status': 'active', 'event_name': 'created' } pusher.trigger("CHANNEL", 'question-created', data) return jsonify(data)Aquí está el enlace del canal Pusher:
<script> function appendToList(data) { const html = ` <div id="${data.id}"> <header> <h1>${data.title}</h1> </header> <div> <p>${data.question}</p> </div> </div> ` let list = document.querySelector('#post-list') list.innerHTML += html } $(document).ready(() => { $(document).on('click', "#submit", function(event) { $.post({ url: '/post-question', type: 'POST', contentType: 'application/json;charset=UTF-8', dataType: 'JSON', data: JSON.stringify({'title': $("#question-title").val(), 'content': $("#question-content").val()}), success : function(response) { console.log(response); }, error : function(xhr) { console.log(xhr); } }).done(function(response) { $("#question-form").reset() }) }) }) Pusher.logToConsole = true; const pusher = new Pusher('*', { cluster: '*', encrypted: true }); const channel = pusher.subscribe('CHANNEL') channel.bind('question-created', data => { appendToList(data); }) </script>Activa correctamente el evento y aparece correctamente en otra ventana en tiempo real, pero por alguna razón, cuando recargo la página, todas las publicaciones desaparecen; y la publicación también desaparece en la ventana actual.
Creo que podría ser un problema con la forma en que estoy presentando las publicaciones, pero no lo sé. ¿Alguien sabe como arreglar esto?
¡Gracias por adelantado!
El primer comentario es correcto. Pusher se encarga de la comunicación en tiempo real y los nuevos eventos. Para mostrar publicaciones antiguas/existentes cada vez que la página (re)carga, debe consultarlas y representarlas en su aplicación. Puede elegir hacerlo del lado del servidor o del lado del cliente.