Html 实际应用

我刚刚发现了

contenteditable

属性，我正在考虑它的实际用途

我认为快速更新页面会很棒，但也有一些问题，例如：

• 安全性：您显然不希望任何人更新您的页面，因此允许编辑内容应该受到相当严格的控制
• 登录后使页面内容可编辑。这难道不需要修改整个页面的标记吗？这本身不是一个问题，但我可以想象这是一个相当大的工作
• 保存新内容。理论上，这可以通过ajax和json来完成，以将新页面标记保存在数据库的字段中，不是吗？另外，您如何向网站确认“我已经完成了更改，您现在可以保存它”

我喜欢在你将要看到的地方快速编辑页面内容的想法。我对在我的网站上实现这样一个东西感到非常兴奋，但在尝试之前我可以使用一些指导

有人能解决上面列出的问题，以及我认为可能不相关的任何问题吗

谢谢你的时间

• 安全性是的，您不希望任何人更新您的页面，但这与

  内容可编辑

  本身无关。人们现在可以使用浏览器的开发工具更改互联网上任何页面的内容，但是，除了伪造有趣的屏幕截图，如果服务器不接受更新，这对他们没有多大用处。这里更重要的问题是通过确保用户添加到页面的内容是“安全的”（例如，这就是为什么博客通常不允许评论中的大多数HTML标记）来防止攻击
• 登录后使内容可编辑用户登录后，只需在服务器端逻辑中添加

  contenteditable

  属性即可。或者，当用户单击“编辑”按钮时，使用JavaScript添加它。我不希望它改变整个页面的标记，因为为了使这种方法合理，页面已经在服务器端从一个填充了存储在数据库中的内容的模板生成。如果你说的是使一个静态站点可编辑，那么，是的，你会有很多工作要做，但是你会有很多工作要做，不管你计划如何让人们编辑页面
• 保存新内容是的，使用Ajax进行保存。JSON并不是真正必要的，它是您想要发回的HTML内容，对吗？将其作为HTML发送回去，只需记住上面关于跨站点脚本的评论，并在服务器端进行安全检查（永远不要相信用户输入）。如何确认用户完成编辑取决于您，正如您必须添加编程逻辑以使用Ajax发送更改并在服务器上处理这些更改一样，您还必须添加显示编辑工具的逻辑（粗体、斜体等按钮）必要时-添加一个按钮以同时执行更新

---

我是否可以建议您不要试图保存整个页面的标记，例如，您应该为一篇博客文章设置所有CSS规则，在这里您可以编辑标题/副标题/日期/作者/内容等。。。然后在保存时，而不是抓取标记时，抓取每个字段的内容，并将其保存为模型数据，等等。是的，你只需要把它作为一个JS强制性的网络应用。如果您确切地知道每页需要编辑的内容（而不是一个div上的空白板或所有内容），并且您授权，那么添加编辑功能并不是一项大任务。