magento2前端存储，localStorage和section解析

由于私有内容特定于个人用户，因此在客户端（即 Web 浏览器）上处理它是合理的。

使用我们的customer-data JS 库将私有数据存储在本地存储，使用可自定义的规则使私有数据失效，并与后端同步数据。

此示例在可缓存页面上显示客户的姓名。

创建节源
节源类负责检索节的数据。 作为最佳实践，我们建议您将代码放在 Vendor/ModuleName/CustomerData 命名空间中。 你的类必须实现 Magento\Customer\CustomerData\SectionSourceInterface 接口。

将以下内容添加到组件的依赖注入配置 (di.xml) 中

<type name="Magento\Customer\CustomerData\SectionPoolInterface">
    <arguments>
        <argument name="sectionSourceMap" xsi:type="array">
            <item name="custom-name" xsi:type="string">Vendor\ModuleName\CustomerData\ClassName</item>
        </argument>
    </arguments>
</type>

创建块和模板
要呈现私有内容，请创建一个块和一个模板来显示用户不可知的数据； 此数据由 UI 组件替换为用户特定的数据。

不要在块中使用 $_isScopePrivate 属性。 此属性已过时，将无法正常工作。
用占位符替换块中的私有数据（使用 Knockout 语法）。 根元素上的 init 范围是 data-bind=”scope: ‘compareProducts'”，您可以在其中定义布局中的范围名称（在此示例中为 compareProducts）。

初始化组件如下：

<script type="text/x-magento-init">
    {"<css-selector>": {"Magento_Ui/js/core/app": <?php echo $block->getJsLayout();?>}}
</script>

配置 UI 组件
UI 组件在店面上呈现块数据。 要初始化 UI 组件，您必须通过调用 _super() 方法并定义一个属性来存储客户数据来触发父初始化方法。 customerData.get() 方法返回一个 Knockout 的 observable。

initialize: function () {
    this._super();
    this.compareProducts = customerData.get('compare-products');
}

例子

所有属性都在 UI 组件初始化的模板中可用。

在布局中定义 UI 组件的示例

使私人内容无效
在 Vendor/ModuleName/etc/frontend 目录中的 Sections.xml 配置文件中指定触发私有内容块缓存失效的操作。 Magento 在 POST 或 PUT 请求上使缓存无效。

客户部分旨在将私人数据缓存在浏览器存储中。这意味着在采取适当措施之前不会更新任何客户部分。

以下是一些例外情况：

商店和网站切换后，任何这些操作后客户部分购物车都会更新。
客户购物车生命周期选项 section_data_lifetime 默认为 60 分钟。预定时间过后，部分购物车将更新。
客户购物车中的产品信息不会同时更新（产品名称、价格、产品启用/禁用）。信息将在先发生的事情之后更新：section_data_lifetime 时间过去或更新购物车触发的操作。
以下示例向 app/code/Magento/Catalog/etc/frontend/sections.xml 添加注释，以便您可以查看代码在做什么。

<?xml version="1.0"?>
<!--
/**
 * Copyright © 2016 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
    <!-- invalidates the "compare-products" section when a user
    adds a product to the comparison, resulting in a "catalog/product_compare/add" POST request -->
    <action name="catalog/product_compare/add">
        <section name="compare-products"/>
    </action>
    <!-- invalidates the section when a customer removes a product from the comparison -->
    <action name="catalog/product_compare/remove">
        <section name="compare-products"/>
    </action>
    <!-- invalidates the section when a customer clears all products from the comparison -->
    <action name="catalog/product_compare/clear">
        <section name="compare-products"/>
    </action>
</config>

有些部分允许您在不指定部分的情况下声明“操作”节点，例如，在注销时：

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
  <action name="customer/account/logout"/>
</config>

这告诉 Magento 使所有部分无效。 但是，如果您在另一个 .xml 文件中为此操作声明了部分，它将覆盖初始部分，并且只有新添加的部分将无效。 如果您需要在某个操作上重新加载所有部分，请使用 * 作为部分名称或使用空操作并确保它们不会被任何其他规则覆盖：

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
    <action name="customer/account/editPost">
        <section name="*"/>
    </action>
</config>

仅使用 HTTP POST 或 PUT 方法来更改状态（例如，添加到购物车、添加到心愿单等）并且不要期望看到这些方法的缓存。使用 GET 或 HEAD 方法可能会触发缓存并阻止更新私有内容。有关缓存的更多信息，请参阅 RFC-2616 第 13 节。
其他例子：

查看
顾客
版本私有内容
存储在浏览器本地存储中的私有内容使用 private_content_version cookie 来存储版本。

版本控制的工作原理如下：

用户执行一些操作，例如添加到购物车，这会导致对 Magento 应用程序的 POST 或 PUT 请求。
服务器为该用户生成 private_content_version cookie 并将响应返回给浏览器。
JavaScript 将 private_content_version cookie 的存在解释为页面上存在私有内容，因此它向 Magento 服务器发送 AJAX 请求以获取当前的私有内容。
服务器的回复缓存在浏览器的本地存储中。

从本地存储中检索具有相同数据版本的后续请求。

任何未来的 HTTP POST 或 PUT 请求都会更改 private_content_version 的值，并导致浏览器缓存更新的内容。
客户数据失效机制不再依赖于 private_content_version。
可缓存页面清单
页面使用 GET 请求

页面仅呈现可缓存的块

页面呈现时没有敏感的私人数据；会话和客户 DTO 对象为空

特定于当前会话（客户）和页面的功能应使用 JavaScript 编写（例如，相关产品列表应排除购物车中已有的项目）

模型和块级别应该标识自己的失效支持

如果您计划使用相同的 URL 显示不同的公共内容，请声明一个自定义上下文变量

不可缓存的页面清单
使用 POST 请求修改 Magento 状态（例如，添加到购物车、愿望清单等）

无法缓存的块应在布局中标记为不可缓存。但是，请注意，向页面添加不可缓存的块会阻止整页缓存缓存该页面。

不使用布局的控制器应该设置 no-cache HTTP headers