Question

＆lt; p＆gt;我在基于ESP8266的服务器和客户端（firefox）之间的基于Web的配置界面上工作。该页面基于带有标记的封装表。 an具有属性值=“”=“”，其中=“”allow =“”to =“”give =“”=“”name =“”attribute =“”a =“”predefined =“”value。= “”this =“”value =“”is =“”shown =“”in =“”a =“”page =“”and =“”can =“”be =“”“changed =”“by =”“ =“”uses =“”和=“”send =“”back =“”to =“”=“”server =“”as =“”config =“”data =“”on =“”a = “”summit。＆＃xa; the =“”page =“”is =“”stored =“”in =“”progmem =“”and =“”i =“”can =“”not =“”access = “”=“”value =“”attributes =“”in =“”order =“”to =“”update =“”他们=“”in =“”case =“”the =“”new =“” enter =“”config =“”data =“”changes =“”他们。=“”<=“”p =“”/>

==我的问题是：是否有，如果是这样的话，在PROGMEM存储页面中使用更新的配置数据将其修复的方法是什么。

==如果没有方法可以做到这一点，那么显示带有动态配置数据的基于PROGMEM的网页的最佳方式是什么。

Config page with some predefined values

constexpr foo_struct make_foo_struct(int x, int y, int z) {
    foo_struct f{};
    f.x = x; f.y = y; f.z = z;
    return f;
}

Answer 1

你可以让你的ESP8266提供一个额外的JavaScript文件，只需设置一些全局变量。每次请求时，ESP8266都会从配置值重新创建此文件。

因此，当浏览器发出请求时：GET /config.js HTTP/1.1

服务器响应：

window.config = {
  ssid: "my network ssid",
  password: "my network password",
  //... continue with other config values
};

确保在html中包含脚本标记，以使浏览器获取JS文件。为了设置value标签的初始<input>，您可以使用更多JS：

<body>
  ...
  <!-- put this at the end of your HTML <body> -->
  <script src="/config.js"></script>
  <!-- now you can access your `window.config` in javascript -->

  <script>
  var inputs = document.getElementsByTagName('input');

  for (var i = 0; i < inputs.length; i++) {
    var input = inputs[i];
    // make sure names used in config.js match an input's `name` attribute
    input.value = window.config[input.name]; 
  }
  </script>
</body>

总之，您提供存储在PROGMEM中的静态（永不更改）HTML文档。

当浏览器加载页面时，会呈现<table>，但所有<input>元素最初都有空值。
浏览器会看到<script src="/config.js">并返回服务器以获取config.js。
ESP8266构造config.js并将其发送到浏览器。
浏览器运行config.js，它会在window.config中存储一些值。
最终运行并设置<input>元素的值。

如果您遇到困难，请随时发表评论。希望这有帮助！

如何动态更改客户端网页中的<input value =“...＆gt;

1 个答案: