Google AMP Laravel

Question

我最近推出了一个基于 laravel 的电子商务网站。现在我真的认为实施 AMP 是个好主意，因为它现在支持电子商务（甚至 shopify 和 ebay 都在实施它）

所以我的问题是我们如何在 laravel 上实施 AMP？有没有办法在桌面版上使用 desktopMainTempalte.blade.php 而在移动版上切换到 mobileMainTemplate.blade.php？我只是不想为移动设备创建一个与 m.domain.com 不同的域。我想要一些有创意的东西，但我不确定我是否朝着正确的方向前进。

如果你们处在我的位置，你们会做什么？

Answer 1

我用 AMP 创建了一个网站，我的解决方案很简单，就是为路由添加新的 GET 规则：mobile/{articleSlug}/{pageNumber?}，并在 Controller 中添加新功能来支持它，这会为新的 AMP 布局加载所有必要的东西。

如果我没记错的话，您不能在同一条路线上同时拥有 AMP 页面和普通页面 - Google 不知道如何在它们之间进行转换。

Answer 2

有多种方法可以将 AMP 页面实现到您的 Web 应用程序（无论使用何种框架）。

一个例子是 https://www.theguardian.com 这样做的方式：通过创建一个新的 sumbomain "amp.theguardian.com" 并且主站点 "www.theguardian.com" 上的每个页面都有一个规范的 link相同的页面，但 AMP 版本，反之亦然。

示例：普通页面：LINK 页面的 AMP 版本：LINK

如您所见，它们是相同的，但又不完全相同。普通页面具有的大部分元素都从 amp 页面中删除（因为 AMP 不允许它们或者对 AMP 来说是一种不好的做法）。

好了！在您的 Laravel 项目中实施 AMP 的一种方法是使用单独的视图 (resources/views/amp) 和处理它们的控制器。

HERE.

关于您的 AMP 视图可以具有哪些功能的一个很好的指南

Answer 3

使用不同的路由和控制器来做同样的事情但有不同的观点是非常困难的。您可以这样做以获得更好的方法。

对 /amp/ 个网址使用相同的 Web 控制器
通过修改 view() helper

安培路线

要赶上 /amp/ 路线，请将此添加到您的 RouteServiceProvider.php

protected function mapAmpRoutes()
{
    Route::group([
        'middleware' => 'web',
        'namespace' => $this->namespace,
        'prefix' => 'amp',
    ], function ($router) {
        require base_path('routes/web.php');
    });
}

同时更改您的 map 方法：

public function map()
{
    $this->mapAmpRoutes(); // <-- Add this

    $this->mapWebRoutes();

    $this->mapApiRoutes();
}

此时所有像 example.com/amp/... 这样的地址都将引用您的 web.php 路由。

Amp 查看文件

现在您应该自定义 view() 助手来为 amp 呈现不同的视图。在 app/Http 目录下创建一个 helpers.php 并带有视图函数：

function view($view = null, $data = [], $mergeData = [])
{
    $factory = app(Illuminate\Contracts\View\Factory::class);

    if (func_num_args() === 0) {
        return $factory;
    }

    //if amp, add '-amp' to view name
    if(request()->segment(1) == 'amp'){
        if(view()->exists($view . '-amp')){
            $view .= '-amp';
        }else{
            abort(404);
        }
    }
    return $factory->make($view, $data, $mergeData);
}

只有将此函数添加到 bootstrap/autoload.php 文件后才会加载此函数

require __DIR__.'/../app/Http/helpers.php'; // <-- add this (should be before require vendor/autoload.php)
require __DIR__.'/../vendor/autoload.php';

编辑： 如果您没有找到 bootstrap/autoload.php 文件，请搜索 vendor/autoload.php，因为 laravel 已将其删除。（感谢 MinderMondo 的评论）

您现在可以为带有“-amp”后缀的放大器添加您喜欢的任何视图。例如，如果您有 index.blade.php，放大器视图名称应为 index-amp.blade.php。

Google AMP Laravel

Google AMP with Laravel

laravel

amp-html

laravel-blade

安培路线

Amp 查看文件