满足实际用途

Question

我刚刚发现了contenteditable属性，我正在考虑它的实际用途。

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

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

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

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

谢谢你的时间！

Answer 1

• 安全性是的，您不希望任何人更新您的网页，但这与contenteditable本身无关。人们现在可以使用浏览器的开发工具更改互联网上任何页面的内容，但除了伪造有趣的屏幕截图之外，如果服务器不接受更新，它们对他们没什么用处。这里更重要的问题是通过确保用户添加到页面的内容是“安全的”来防止cross-site scripting攻击之类的事情（例如，这就是为什么博客通常不允许评论中的大多数HTML标记）。 / LI>
• 在登录后使内容可编辑只需在用户登录后在服务器端逻辑中添加contenteditable属性。或者，当用户点击“编辑”时，使用JavaScript添加该属性按钮。我不希望它改变整个页面的标记，因为这种方法是明智的，无论如何，页面已经在服务器端生成，模板中充满了存储在数据库中的内容。如果您正在谈论使静态网站可编辑，那么，是的，您还有很多工作要做，但是您有计划让人们编辑网页的工作要做。
• 保存新内容是的，使用Ajax执行此操作。 JSON不是必需的，它是你要发回的HTML内容，对吗？以HTML格式发送回来，请记住上面关于跨站点脚本的评论，并在服务器端进行安全检查（绝不信任用户输入）。您如何确认用户已完成编辑取决于您，就像您必须添加编程逻辑以使用Ajax发回更改并在服务器上处理这些更改一样，您将不得不在必要时添加显示编辑工具（粗体，斜体等按钮）的逻辑 - 添加一个按钮以同时执行更新。