如何在 laravel 应用程序中为单个 vue 组件实现 SSR？答案

【问题标题】：How to implement SSR for single vue component inside of laravel application?如何在 laravel 应用程序中为单个 vue 组件实现 SSR？
【发布时间】：2019-08-01 16:38:59
【问题描述】：

我正在做一个 laravel 项目。 vue组件很多，由于SEO需要做SSR。我不能使用 nuxt.js 或类似的东西，因为我的应用不是 SPA。我有默认的混音设置：

const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.sass', 'public/css');
mix.disableSuccessNotifications();

我将 vue 组件放到 laravel 视图（刀片模板）中，例如 <example-component></example-component>。只有在这种情况下，我如何才能为那里的组件实现 SSR？

由于 SEO，我需要将此组件作为呈现的 html 添加到响应中，而不是 <example-component></example-component>。

【问题讨论】：

SSR 是什么意思？
@arun 服务器端渲染
您可能不需要为 SEO 执行 SSR。只为 SEO 提供必要的信息就足够了。 Google 不认为这是在伪装。
@RaduDiță 在这里问问题之前，我在 webmasters.stackoverflow 上问过这个问题：webmasters.stackexchange.com/questions/121490 看看，我想我需要在这里做 SSR
这是一个很好的资源sebastiandedeyne.com/server-side-rendering-javascript-from-php

标签： laravel vue.js server-side-rendering

【解决方案1】：

服务端渲染不是单行的，但是有一个laravel的包可以做，请查看：

https://github.com/spatie/laravel-server-side-rendering

【讨论】：

【解决方案2】：

目前的解决方案需要使用 Node，或者在极端情况下 PHP 与 V8Js 引擎结合使用。

请参阅https://ssr.vuejs.org/guide/#integrating-with-a-server 以帮助您入门。 vue-server-renderer 基于预先呈现 HTML 的 Node/express.js 实现。

我还没有尝试过任何基于 PHP 的解决方案，很遗憾，这是我目前能给你的最佳答案。

【讨论】：

我不会将 PHP 渲染器视为“极端情况”——您可以熟悉和分离让 SSR 完成您喜欢的事情。这就是为什么 RoR 和 Laravel 的包如此受欢迎的原因

【解决方案3】：

只使用刀片。不要使用 Vue 的组件。您可以将它们用于 Clawer、搜索引擎（如表单、付款、预订、购物车、结帐）等不必要的事情，

【讨论】：