README

在 Laravel 中让服务器端渲染变得更容易。

<html>
    <head>
        <title>My server side rendered app</title>
        <script defer src="{{ mix('app-client.js') }}">
    </head>
    <body>
        {!! ssr('js/app-server.js') !!}
    </body>
</html>

此包是用于 spatie/server-side-rendering 库的 Laravel 桥接器。在开始之前，请查阅说明文档以了解底层概念和注意事项。此说明文档还假定您已经对构建服务器端渲染的 JavaScript 应用程序有一定的了解。

在 spatie/laravel-server-side-rendering-examples 中提供了 Vue 和 React 示例应用程序，如果您想看到它的工作原理。

支持我们

我们投入了大量资源来创建一流的开放源代码包。您可以通过购买我们的付费产品之一来支持我们。

我们非常感谢您从家乡寄给我们明信片，说明您正在使用我们的哪个包。您可以在我们的联系页面上找到我们的地址。我们将所有收到的明信片发布在我们的虚拟明信片墙上。

安装

您可以通过 composer 安装此包

composer require spatie/laravel-server-side-rendering

服务提供程序和 Ssr 别名将被自动注册。

如果您想调整一些设置，您可以可选地发布配置文件。

php artisan vendor:publish --provider="Spatie\Ssr\SsrServiceProvider" --tag="config"

使用方法

先决条件

首先，您需要选择一个执行脚本的引擎。服务器端渲染库包含 V8 和 Node 引擎。默认情况下，该包配置为使用 node，因为您可能已经在系统上安装了它。

在您的 .env 文件中设置 NODE_PATH 环境变量以开始

NODE_PATH=/path/to/my/node

您还需要确保存在 storage/app/ssr 文件夹，或者将 ssr.node.temp_path 配置值更改为其他内容。

如果您想使用 V8 引擎，您可以跳过前面的两个步骤。但是，您需要安装 v8js 扩展。

配置

除了上述内容外，无需其他配置。如果您仍然需要调整设置，则配置文件有详细的说明。

设置您的脚本

您需要构建两个脚本：一个服务器脚本和一个客户端脚本。有关如何构建这些脚本，请参阅您选择的客户端框架的文档。

mix.js('resources/js/app-client.js', 'public/js')
   .js('resources/js/app-server.js', 'public/js');

服务器脚本应传递给 ssr 函数，客户端脚本应手动加载。该包假定您正在使用 Laravel Mix，并将为您解析路径。您可以在配置文件中将 mix 设置为 false 来禁用此行为。

{!! ssr('js/app-server.js') !!}
<script src="{{ mix('js/app-client.js') }}">

您的服务器脚本应调用一个 dispatch 函数，将渲染的 HTML 发送回视图。以下是一个用于服务器端渲染应用程序的 Vue 脚本示例。有关如何将所有内容连接在一起的完整说明，请参阅 spatie/server-side-rendering 的说明文档。

// resources/js/app.js

import Vue from 'vue';
import App from './components/App';

export default new Vue({
    render: h => h(App),
});

// resources/js/app-client.js

import app from './app';

app.$mount('#app');

// resources/js/app-server.js

import app from './app';
import renderVueComponentToString from 'vue-server-renderer/basic';

renderVueComponentToString(app, (err, html) => {
    if (err) {
        throw new Error(err);
    }

    dispatch(html);
});

在视图中渲染应用程序

该包公开了一个 ssr 辅助函数来渲染您的应用程序。

<html>
    <head>
        <title>My server side rendered app</title>
        <script defer src="{{ mix('js/app-client.js') }}"></script>
    </head>
    <body>
        {!! ssr('js/app-server.js')->render() !!}
    </body>
</html>

还有一个外观可供使用。

<html>
    <head>
        <title>My server side rendered app</title>
        <script defer src="{{ mix('js/app-client.js') }}"></script>
    </head>
    <body>
        {!! Ssr::entry('js/app-server.js')->render() !!}
    </body>
</html>

可以在函数或外观调用之后链式调用渲染选项。

<html>
    <head>
        <title>My server side rendered app</title>
        <script defer src="{{ mix('js/app-client.js') }}"></script>
    </head>
    <body>
        {!! ssr('js/app-server.js')->context('user', $user)->render() !!}
    </body>
</html>

可用的选项请参考文档：spatie/server-side-rendering。

测试

composer test

更新日志

有关最近变更的详细信息，请参阅更新日志。

贡献

有关详细说明，请参阅贡献指南。

安全性

如果您发现有关安全性的错误，请通过 security@spatie.be 发送邮件，而不是使用问题跟踪器。

鸣谢

许可证

MIT 许可证（MIT）。更多信息请参阅许可证文件。

spatie / laravel-server-side-rendering

维护者

详细信息