现在如何使用本地存储?还不支持吗?

时间:2019-02-20 03:24:26

标签: amp-html

在AMPHTML中,我想编写一个函数来查看最近的记录,但是我不想使用cookie。

2 个答案:

答案 0 :(得分:0)

通过“编写函数”,我假设您的意思是在AMP扩展的上下文中,因为当前amp-script。仍在开发中,并且不允许自定义JavaScript。如果是这样,那么就没有什么可以阻止您创建自定义放大器组件来实现您想要做的事情了。

答案 1 :(得分:0)

我不知道 AMP 从什么时候开始支持 amp-scripts 或 localStorage,但现在可以使用它们。

他们的网站上有一个例子:https://amp.dev/documentation/examples/components/amp-script/#local-storage

<块引用>

您的脚本可以访问网络存储 API。这使您可以在浏览器会话之间保留用户信息。在这里,我们使用 localStorage 来跟踪用户名。如果您设置了用户名,然后重新加载此页面,用户名将保持不变。

<amp-script layout="fixed-height" script="local-storage-script" height="110" class="sample">
  <div>
    <span>Current username: </span>
    <b id="username-display"></b>
  </div>
  <div>
    <label>Enter new username:</label>
    <input id="username-input" type="text" maxlength="20">
  </div>
  <button id="username-submit">Submit</button>
</amp-script>
<script id="local-storage-script" type="text/plain" target="amp-script">
  const submit = document.getElementById('username-submit');
  const input = document.getElementById('username-input');
  const display = document.getElementById('username-display');

  const oldUsername = localStorage.getItem('username');
  display.textContent = oldUsername ? oldUsername : '(not set)';

  function setUsername() {
    const newUsername = input.value;
    localStorage.setItem('username', newUsername);
    display.textContent = newUsername;
  }

  submit.addEventListener('click', setUsername);
</script>