如何在数据库中存储包含照片和格式的文章？

Question

查看Storehouse上的一些文章，例如this one。他们很好，照片很丰富，这使他们很有吸引力，但他们不仅仅是文章。他们有照片和其他无关的组件，从我的角度来看，这使得它们更复杂，用于存储它们。简而言之，在数据库级别为个人站点或项目创建类似文章实现的最佳方式是什么？

通过这个，我的意思是说，我要写一篇文章，分为8段，其中一段是<section>的兄弟姐妹，在这些部分之间有＃＆＃ 39; d是不同布局的各种照片 - 例如视差照片，全页照片和画廊风格的查看器 - 甚至可能是引号。这产生了一个相当复杂的HTML结构，比明文文章更简单，文章只能作为文本存储在数据库中，然后只在网页上的两个标签之间输出。如何在数据库和数据库中存储所有这些信息，HTML标签，类名等。申请适当的方式？

我提出了一些想法，但我并不完全确定最佳做法或每个选项的优缺点。

选项1：将所有内容以纯文本形式存储在数据库字段中。

这是最简单的，也是最丑陋的。所有内容，图像标记，类名以及所有内容都以纯文本形式存储在article_text表中的article字段内。

选项2：将文章文本和格式存储在数据库字段中，然后将图像存储在另一个表中。

这是1＆amp; S的混合解决方案。 3.基本上，您可以参考文章中的图像部分，如下所示：

{{ imageSection1 }}

说，并让你的应用程序逻辑集成并编织成最终产品。这在数据库方面很容易，但在applogic方面却更加混乱。

选项3：单独存储所有内容。

每个段落都是article_collation表中的自己的条目，图像，注释和引号存储在它们自己的独立表中。这似乎是分离应该单独存储的不同元素的最有效方法，但它会使程序逻辑变得模糊不清，并可能因此而变得不那么有效。

---

每个人都有重大问题IMO，我不知道该怎么做。输入？建议？是否有任何工具可以使这更容易？

Answer 1

我非常喜欢使用XML，然后动态地将其转换为输出格式（使用xslt等）。这允许您以结构化的方式表示您的内容，但仍然可以引用一些连贯的内容。这有助于版本控制，使用差异等工具，甚至将其打包并将其作为文件列表（而不是需要重新组装的数据库表）进行传输。

它还允许在未来基于HTML的系统（如PDF输出）中对您的内容使用完全不同的用途。

看看Martin Fowler的文章：http://martinfowler.com/articles/writingInXml.html

有几个开放标准＆＃34;用于发布值得关注的XML内容。 NLM很常见。我对它有经验，并且发现它非常（可能已经完成）。

Answer 2

我会选择选项3：分开存储所有内容。这将是复杂但最灵活的。它允许您一次扩展一个CMS。

表格结构的大致轮廓：

article
- article_id (PK)
- title

display
- display_id (PK)
- name

section
- section_id (PK)
- article_id (FK)
- display_id (FK)
- sort

content
- content_id (PK)
- section_id (FK)
- title
- description
- image
- sort

以display表开头的示例值：

1: pass-through
2: horizontal-slideshow
3: vertical-sections

以下是最终页面的样子（类和ID将显示数据的样子）：

<div id="article-1" class="article">
    <h1 class="title">Article Title</h1>
    <div id="section-1" class="section display-pass-through">
        <div id="content-11" class="content">
            <h2 class="title">Introduction</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
        </div>
    </div>
    <div id="section-2" class="section display-horizontal-slideshow">
        <div id="content-21" class="content">
            <h2 class="title">Slide 1</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
            <img class="image">
        </div>
        <div id="content-22" class="content">
            <h2 class="title">Slide 2</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
            <img class="image">
        </div>
        <div id="content-23" class="content">
            <h2 class="title">Slide 3</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
            <img class="image">
        </div>
    </div>
    <div id="section-3" class="section display-vertical-sections">
        <div id="content-31" class="content">
            <img class="image">
            <h2 class="title">Heading 1</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
        </div>
        <div id="content-32" class="content">
            <img class="image">
            <h2 class="title">Heading 2</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
        </div>
        <div id="content-33" class="content">
            <img class="image">
            <h2 class="title">Heading 3</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
        </div>
    </div>
    <div id="section-4" class="section display-pass-through">
        <div id="content-41" class="content">
            <h2 class="title">Conslusion</h2>
            <div class="description">Lorem ipsum dolor sit amet.</div>
        </div>
    </div>
</div>

您可以根据需求增加添加其他显示选项（单个电影和电影播放列表是两个趋势示例）。使用语义标记显示内容，无论其属于哪个部分。您可以使用JavaScript和CSS类来控制部分的外观（例如，对于水平幻灯片，您可以使用CSS隐藏除第一张幻灯片之外的所有幻灯片，并使用JavaScript添加prev / next控件）。

注意：上述想法可以推广为只使用一个自引用表。泛化太多和/或使用自引用表都有自己的问题。但是，内容的嵌套方式和深度没有限制;与您编写HTML内容的方式非常相似。