制作React图片库的策略搜索引擎优化

我写了一个React图片库或幻灯片。我需要让搜索引擎可以索引替代文本，但因为我的服务器在PHP中，所以React.renderToString的使用受到限制。制作React图片库的策略搜索引擎优化

服务器在PHP + MySQL。 PHP使用Smarty，一个体面的PHP模板引擎来呈现HTML。其余的PHP框架是我自己的。 Smarty模板具有此单笨拙行：

<script> 
    var GalleryData = {$gallery}; 
</script>

其由PHP的控制器功能呈现如下：

return array(
     'gallery'  => json_encode($gallery), 
    );

（$gallery是MySQL查询的结果表）。

而且我的.js：

React.render(<Gallery gallery={GalleryData} />, $('.gallery').get(0));

不是最优雅的设置，但考虑到我的服务器是在PHP中似乎有没有多大的更好的方法来做到这一点

（？）

我在第一枪时做了一个超级快速修复 - 我从Firebug复制了呈现的HTML，并手动将它插入到数据库中的新表中。然后，我简单地从PHP中呈现这些代码，我们很乐意继续浏览器。

有一个复杂因素，那是因为React组件只在第一次渲染时插入到DOM中（据我了解），并且由于该库一次只显示一个图像幻灯片，所以我必须手动在保存HTML代码之前，点击一次所有幻灯片。

但是，现在可以通过CMS编辑替代文本，因此我需要自动执行此过程，或想出一个更好的解决方案。

在Node.js中重写服务器是不成问题的。

我的第一个猜测是我需要安装Node，并编写一个脚本来创建相同的React组件。由于输入数据（包括ALT文字）必须来自MySQL的，我有几个选择：

从注连接到MySQL数据库，并复制查询
在PHP创建响应URL一侧仅返回JSON（把SQL查询到一个共同的功能）
获取整个页面的节点，但提取GalleryData将是一个烂摊子

然后我必须确保所有组件都被渲染到DOM，所以我可以通过手动调用nextSlide（）方法来编写脚本有很多次，因为有幻灯片（少一个）。

最后，我将把渲染的DOM再次保存到数据库（所以Node脚本毕竟需要MySQL连接 - 也许第一个选项是最好的）。

对于这样的基本要求，整个过程看起来非常复杂。我错过了什么吗？

我对Node完全陌生，在浏览器之外构建DOM的整个想法对我来说基本上是新的。我不介意将Node引入到我的架构中，但它只会支持在前端使用React。

请注意，该网站每月大约有15,000次综合浏览量，因此不需要大规模的可扩展性 - 我不使用任何页面缓存，因为这种流量根本不需要。

我可能需要像这样静态渲染一些React组件，但维护一个小的技术开销（例如，在Node中维护一组并行SQL查询）不会是一个大问题。

任何人都可以在这里指导我吗？

来源

2015-02-23 cachvico

你确定React是否适合你的需求？只有在客户端请求新数据时才可以使用React。 – WiredPrairie 2015-02-23 23:14:10

vs Backbone，或者vs nothing/jQuery？我的React图片库是我编写的代码中更优雅的代码之一--React的好处（或者Javascript方面的任何等效的应用程序框架），很容易看到。也许Backbone会更容易插入？但不知何故，我怀疑总体上并不容易。 – cachvico 2015-02-23 23:23:33

试图用JavaScript框架来适应基于PHP的系统可能不是最好的选择......无论您选择哪一个。 – WiredPrairie 2015-02-24 00:58:31

我想你应该尝试使用PHP在服务器端渲染React组件。这是一个PHP lib要做到这一点。

但是，是的，你基本上需要使用PHP代码中的V8js。然而，这是一种实验性的，你可能需要使用其他的。（这种“其他方式”可能会使用Node/Express来渲染你的组件Here is some thoughts on how to do it。）

来源

2015-02-23 22:50:11

制作React图片库的策略搜索引擎优化

回答

相关问题