带有ReactJS模板的python Flask应用程序上的SEO问题

如何解决带有ReactJS模板的python Flask应用程序上的SEO问题

我在Google SEO的ReactJS SPA网站（由ec2 aws上的Flask应用服务）上遇到了问题。

1-链接问题 （为简化起见：GSC = Google Search Console）

我可以找到一些在Google搜索中编入索引的链接，而这些链接在我的网站上甚至是不可能的：您无法到达这些链接，因为它们根本不存在，但是google合并了我网站的两种类型的链接不遵守站点地图，发明了一些链接，另一些未建立索引（尽管在GSC上一切正常）。

ex:
first type of link: /product/url-of-product
second type if link: /brand/url/brand
link I can find in google search results: /brand/url-of-product

在网站上没有任何地方可以找到这些类型的链接，它们在站点地图中不存在，因此，我不知道这些链接从何处出现以及Google为什么为此索引。

对于所有可用的链接，某些链接未为GSC编制索引，但实际上是GSC的结果，而其他却是相反的，即使GSC表示已编制索引，我也找不到它们（所有链接都在网站地图以帮助Google）

2-在Google图片中，我网站上的图片与错误的链接相关联（而在GSC上一切正常）

当我在GSC上抓取页面时，可以查看页面的屏幕截图，一切都很好。在google image上，我可以从我网站的其他页面找到一些与图片的链接，而我不知道为什么google将某些图片与其他链接进行匹配。

很抱歉，如果不清楚，但是我也面临的问题对我来说也不清楚，因为google index错了我的网站。

针对我项目的技术部分 （为简化理解，我将其简化）

我的Flask应用在Python 3.6.6上运行。该应用程序使用flask模板，该模板可用于ReactJS应用程序：

package.json
{
    ...
    "react": "^16.9.0","react-dom": "^16.9.0","react-router-dom": "5.0.0",...
}

react-router-dom使用路由器/交换机创建我网站上的每个页面：

App.js
render() {
    return(
        <Router>
            <Switch>
                <Route path="/:lang/product/:" exact render={(e) => return ProductComponent />} />
                <Route path="/:lang/brand/:" exact render={(e) => return BrandComponent />} />
            </Switch>
        </Router>
    )
}

我需要创建元数据服务器端（首先尝试react-helmet，但不适用于这种堆栈），因此在我的应用程序一代中，我使用了：

__init__.py
@app.route('/',defaults={'path': ''})
@app.route('/<path:path>')
def index(path):
    data_html = generate_content_html(path)
    return render_template("index.html",title = data_html['title'],desc = data_html['desc'],lang_user = data_html['lang'])

generate_content_html()返回正确的标题/描述和语言，我将其分配给有python参数的index.html文件。

index.html
<html lang="{{lang_user}}" xml:lang="{{lang_user}}" xmlns="http://www.w3.org/1999/xhtml">
<head>
    {% if title %}
    <title>{{title}}</title>
    {% else %}
    <title>Sommelier du Parfum</title>
    {% endif %}
    {% if desc %}
    <Meta name="description" content="{{desc}}">
    {% else %}
    <Meta name="description"
        content="Lorem ipsum description for the example">
    {% endif %}
</head>
<body style="overflow-x: hidden;">
    <div id="app"></div>
</body>
</html>

这很好。元数据运行良好。

我的网站运行了几个月（自3月以来），除了这里提到的那些问题之外，没有任何其他问题。

解决方案？

所以我现在的重点是理解和解决 SEO问题，因为我在Google上的某些索引页面运行正常，而其他页面则运行错误。

由于我的特殊堆栈，我尝试在ReactJS部分实现预渲染，但未成功，因为我的页面不是直接在js中呈现，而是在随后加载js的python中呈现。我只获得了一个白色的“着陆页”，而我的python参数只用黑色写了出来，所以并不是我真正想要的。

所以我在这里，试图了解如何解决这些问题，了解问题的根源。

如果我可以提供其他帮助，请告诉我。

在此先感谢您尝试帮助我的人。

NB：

为提供帮助，这是我的网站的名称： sommelierduparfum.com

搜索错误可能会出现在Google搜索产品名称+我的网站名称中（ ex：侍酒师的梦想家）

对不起，我的英语，我是法语，并且正在努力。