javascript - glitch.com如何更新其页面？

Question

Closed. This question needs to be more focused。它当前不接受答案。
                            
                        
                    
                
                            
                                
                
                        
                            
                        
                    
                        
                            想改善这个问题吗？更新问题，使其仅通过 editing this post专注于一个问题。
                        
                        在4个月前关闭。
                                                                                            
                
        
Glitch是在线的HTML / CSS / Javascript代码编辑器。在他们的编辑器中，只要更改一行代码，它就会在网站上更新。甚至无需单击“保存”按钮。而且该页面也不必刷新。它只是更新代码。每当服务器上发生任何更改时，我都希望更新我的网站。研究完之后，人们只是告诉我用ajax或node.js编写类似的东西。我不明白该怎么做。有人可以帮我指出正确的方向吗？提前致谢。

最佳答案

这里有两个不同的，完全不相关的问题。我都会回答他们。


  glitch.com如何更新其页面？


这是协作编辑。在基本级别上，您需要一种定期且实时地从服务器发送/接收数据的方法。 Web Sockets是一种选择的技术，它允许您以所需的任何格式发送/接收数据包。

接下来，您需要一种在页面上更新数据的方法。这是简单的DOM操作，其中在元素上设置了innerText，innerHTML和其他属性。

现在，实际的挑战... Glitch如何处理协作。有整本关于Operational Transform主题的书。这个想法是，来自多个源的更改可以异步合并，然后在所有端进行更新。可以将其视为实时版本控制。


  每当服务器上发生任何更改时，我都希望更新我的网站。


这完全不相关的原因是，不需要双向通信。无需进行业务转型。这是一个简单得多的问题。

如果需要立即实时更新页面，则需要客户端和服务器之间的持久连接。尽管您可以如上所述使用Web套接字，但实际上有一个易于实现的抽象... Server-Sent Events。您将需要构建一些服务器端组件，以在页面更改时通知客户端，以便客户端可以重新加载它。

如果不需要实时更新，并且可以延迟一两分钟而满意，则可以考虑使用Fetch API进行简单轮询。发出HTTP HEAD请求，并检查用于保持版本控制的某些标头，例如eTag。如果eTag更改，请重新加载页面。

如果您觉得花哨的话，实际上可以使用Fetch API加载页面数据并使用它来修补DOM。

如您所见，这是一个非常广泛的主题。您不仅可以使用一线魔法来为您完成所有这些任务。我建议检查所有这些概念，并对其有所了解。试试看，并在有问题时发布特定问题。

关于javascript - glitch.com如何更新其页面？ ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57650513/

上一篇：javascript - 无法将数字设置为文档路径 Firestore

下一篇：javascript - 登录/注销后强制所有页面访问刷新/清除缓存

相关文章：

javascript - 如何访问 .ajax() 异步函数内的局部变量

javascript - 如何使用javascript将 Canvas 大小调整为像素数量

内部带有 ajax 和 jQuery slider 的 jQuery UI 选项卡。 95% 完成

java - PHP 中的服务器端重定向

mysql - XML 与数据库

html - 使用 C CGI 提供 HTML 模板/表单

javascript - ReactJS 区分来自多个组件的点击。

javascript - 拉斐尔 vs jsDraw2D

javascript - 浏览器的后退前进按钮显示出奇怪的行为。历史.js

javascript - 从其他页面调用 slideDown()

Answer 1

这里有两个不同的，完全不相关的问题。我都会回答他们。


  glitch.com如何更新其页面？


这是协作编辑。在基本级别上，您需要一种定期且实时地从服务器发送/接收数据的方法。 Web Sockets是一种选择的技术，它允许您以所需的任何格式发送/接收数据包。

接下来，您需要一种在页面上更新数据的方法。这是简单的DOM操作，其中在元素上设置了innerText，innerHTML和其他属性。

现在，实际的挑战... Glitch如何处理协作。有整本关于Operational Transform主题的书。这个想法是，来自多个源的更改可以异步合并，然后在所有端进行更新。可以将其视为实时版本控制。


  每当服务器上发生任何更改时，我都希望更新我的网站。


这完全不相关的原因是，不需要双向通信。无需进行业务转型。这是一个简单得多的问题。

如果需要立即实时更新页面，则需要客户端和服务器之间的持久连接。尽管您可以如上所述使用Web套接字，但实际上有一个易于实现的抽象... Server-Sent Events。您将需要构建一些服务器端组件，以在页面更改时通知客户端，以便客户端可以重新加载它。

如果不需要实时更新，并且可以延迟一两分钟而满意，则可以考虑使用Fetch API进行简单轮询。发出HTTP HEAD请求，并检查用于保持版本控制的某些标头，例如eTag。如果eTag更改，请重新加载页面。

如果您觉得花哨的话，实际上可以使用Fetch API加载页面数据并使用它来修补DOM。

如您所见，这是一个非常广泛的主题。您不仅可以使用一线魔法来为您完成所有这些任务。我建议检查所有这些概念，并对其有所了解。试试看，并在有问题时发布特定问题。