从查询参数中提取受众数据,然后返回clothing。您可以从任何来源(例如 cookies)获取此信息,但我们将坚持使用查询参数以使本教程简单易懂。
提取任何builder.userAttributes.*查询参数。这些对于 Builder Studio 等 Builder 编辑功能很重要。
将请求 URL 重写为指向/builder/[hash],其中[hash]包含以 Base64 编码的受众和builder.userAttributes.*查询参数。
返回重写的 URL 会触发静默重定向到本教程中先前 卢森堡 Whatsapp 数据 创建的页面,该页面会解码受众并使用它来定位适当的 Builder 页面。
从用户的角度来看,地址栏 URL 不会改变,也没有重定向的迹象。它就是正常工作。
接下来,您可以创建 Next.js 页面模板,它将获取并呈现您的个性化 Builder 页面。
步骤 4:创建 Next.js 页面模板
Builder 的 SDK 在框架的页面模板内呈现您在 Builder 中创建的页面。
在您的项目目录中创建一个 Next.js 页 s内容如下:
渲染你的 Builder 页面,该页面由within获取getStaticProps。这是将 Builder 与任何 Next.js 应用程序集成的基本流程。
该示例还添加了一些用于个性化您的页面的详细信息:
该页面将从下一步创建的中间件的查询参数接收的个性化数据作为自定义定位属性传递给 Builder。Builder使用这些定位属性来选择要加载的页面。
为了使定位发挥作用,接下来我们将设置自定义定位属性。
步骤 5:
在您的 Builder 仪表板中,单击左侧导航栏中的“帐户设置”。
Builder.io 账户设置)
单击自定义定位属性的编辑按钮。
Builder.io 自定义定位属性