堆栈内存溢出
  繁体   English   中英

如何使用支持多个文件的 arduino 制作 web 服务器？

[英]How can I make a web server with arduino that support multiple file?

 原文  2020-12-16 02:53:26  5   4    c++/ server/ arduino/ esp8266

问题描述

I am wondering how I can make a http server for arduino however the problem I am encountering is that I don't understand how I can server static html file on it. 我查看的所有教程都直接通过如下代码加载了 html：

/*
  Web Server

 A simple web server that shows the value of the analog input pins.
 using an Arduino Wiznet Ethernet shield.

 Circuit:
 * Ethernet shield attached to pins 10, 11, 12, 13
 * Analog inputs attached to pins A0 through A5 (optional)

 created 18 Dec 2009
 by David A. Mellis
 modified 9 Apr 2012
 by Tom Igoe
 modified 02 Sept 2015
 by Arturo Guadalupi
 
 */

#include <SPI.h>
#include <Ethernet.h>

// Enter a MAC address and IP address for your controller below.
// The IP address will be dependent on your local network:
byte mac[] = {
  0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED
};
IPAddress ip(192, 168, 1, 177);

// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);

void setup() {
  // You can use Ethernet.init(pin) to configure the CS pin
  //Ethernet.init(10);  // Most Arduino shields
  //Ethernet.init(5);   // MKR ETH shield
  //Ethernet.init(0);   // Teensy 2.0
  //Ethernet.init(20);  // Teensy++ 2.0
  //Ethernet.init(15);  // ESP8266 with Adafruit Featherwing Ethernet
  //Ethernet.init(33);  // ESP32 with Adafruit Featherwing Ethernet

  // Open serial communications and wait for port to open:
  Serial.begin(9600);
  while (!Serial) {
    ; // wait for serial port to connect. Needed for native USB port only
  }
  Serial.println("Ethernet WebServer Example");

  // start the Ethernet connection and the server:
  Ethernet.begin(mac, ip);

  // Check for Ethernet hardware present
  if (Ethernet.hardwareStatus() == EthernetNoHardware) {
    Serial.println("Ethernet shield was not found.  Sorry, can't run without hardware. :(");
    while (true) {
      delay(1); // do nothing, no point running without Ethernet hardware
    }
  }
  if (Ethernet.linkStatus() == LinkOFF) {
    Serial.println("Ethernet cable is not connected.");
  }

  // start the server
  server.begin();
  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());
}


void loop() {
  // listen for incoming clients
  EthernetClient client = server.available();
  if (client) {
    Serial.println("new client");
    // an http request ends with a blank line
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        // if you've gotten to the end of the line (received a newline
        // character) and the line is blank, the http request has ended,
        // so you can send a reply
        if (c == '\n' && currentLineIsBlank) {
          // send a standard http response header
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
          client.println("Connection: close");  // the connection will be closed after completion of the response
          client.println("Refresh: 5");  // refresh the page automatically every 5 sec
          client.println();
          client.println("<!DOCTYPE HTML>");
          client.println("<html>");
          // output the value of each analog input pin
          for (int analogChannel = 0; analogChannel < 6; analogChannel++) {
            int sensorReading = analogRead(analogChannel);
            client.print("analog input ");
            client.print(analogChannel);
            client.print(" is ");
            client.print(sensorReading);
            client.println("<br />");
          }
          client.println("</html>");
          break;
        }
        if (c == '\n') {
          // you're starting a new line
          currentLineIsBlank = true;
        } else if (c != '\r') {
          // you've gotten a character on the current line
          currentLineIsBlank = false;
        }
      }
    }
    // give the web browser time to receive the data
    delay(1);
    // close the connection:
    client.stop();
    Serial.println("client disconnected");
  }
}

该代码会导致一个问题，即您无法在不存储在另一台服务器上的情况下旁加载图像。 事实上，我希望我可以从像 sd 卡这样的存储介质加载多个文件，我可以使用<script src="app.js></script>标签从 sd 卡上的某个位置加载内容。

我强硬的解决方案之一是使用SD 卡arduino 库。 但是，它给我带来了一个问题，因为我不确定是否可以从位于 web 页面的 html 文件加载位于 sdcard 中的样式表、脚本和其他资源（ <img src="logo.jpg alt="logo /> . 我很难通过位于 sdcard 中的文件来加载网页。

4 个解决方案

解决方案1
 1  2020-12-16 17:18:24

您不必在服务器端（Arduino）决定要发送哪些文件； 网络浏览器本身将为它在 HTML 页面中遇到并希望拥有的每个图像、脚本、样式表等发送一个GET 。

服务器所要做的就是使用正确的文件来响应每个GET ，并且所有单独的文件都必须存在于 Arduino 的 memory 中，或者像 SD 卡这样的外部存储上。

您可以采取的一种捷径是制作独立的 web 页面，将所有图像、脚本和样式表包含在一个文件中，就像我在此处所做的那样。 这样做很痛苦，但它简化了网络服务器代码，因为只有一个文件要服务，如果你使用的 Arduino 的 memory 足够大，它的内容可以放在代码中的变量中。

如果您不关心编写自己的网络服务器，您可以使用网络服务器库，并将您需要的文件放在 SD 卡上。 库中实现的网络服务器将使用正确的文件响应浏览器发送的每个GET ，仅此而已。

如果这不能回答您的问题，请告诉我，我将进行编辑或扩展。

PS。 我举了一个例子，说明如何提供一个自包含的 web 页面，该页面经过 gzip 压缩和 Base64 编码，然后作为const char*变量放入 Arduino 代码中，在 ZE1ADBCBB92C622D0B3E619F9BFZ07 上。 实际的 gzip 压缩、Base64 编码的 web 页面在这里，webserver 部分的代码在这里，function 发送一个 gzip 压缩的 Base64 编码 Z2567A5EC9705EB7AC2DZ940 页面到浏览器是33E61 。

解决方案2
 0  2020-12-16 15:48:31

要从网络服务器提供文件，您必须查看 HTTP 请求标头以查看请求的文件。

您应该已经能够在串行监视器中看到这些标题，因为您正在使用：

    char c = client.read();
    Serial.write(c);

GET 请求的第一行如下所示：

GET /test.html HTTP/1.1

要不就：

GET / HTTP/1.1

您通常会返回 index.html 的位置。

所以在这里你可以只返回 test.html 的内容（例如来自 memory 或 SD 卡）。

如果您的 test.html 文件包含对其他文件的引用（例如 logo.jpg），浏览器将自动发送一个新的 logo.jpg GET 请求（后跟其他 header 字段）：

GET /logo.jpg HTTP/1.1

您还必须调整Content-Type响应 header 字段：

Content-Type: image/jpeg

文件（或数据）的长度应包含在响应标头中，例如：

Content-Length: 520

或者，可以使用分块传输编码（主要用于预先不知道总大小的动态内容）。

解决方案3
 -1  2020-12-16 03:24:05

对不起，我没有任何具体的答案给你。 但是看看这里或 web 上的另一个示例程序应该会有所帮助。

虽然我认为我会选择 Raspberry Pi 作为嵌入式网络服务器，因为它有一个操作系统。

解决方案4
 -1 已采纳  2020-12-16 16:18:20

您可以使用库 awot。 它基本上是 arduino 的快速 js，这意味着你可以轻松地做一个安静的 api。 在 awot 的网站上，他们有关于如何在 awot 网站上的 arduino 上部署 React 应用程序的教程。

这是awot的链接： https://awot.net/

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 我如何使Kaaproject成为Arduino的网关 如何有效地连接多个 Arduino 字符串？ （Arduino）我可以在parseInt（）中跳过多个字符吗？ 如何使鼠标支持适用于 OSX 上的 ncurses？ 如何使 STL 的 C++ 编译器支持模板？ 如何添加此代码以使用我的 arduino 打印一个完整的三角形？ 如何确保我的 Arduino 秒表的计时准确？ 如何使服务器成为多线程？ 如何动态更改 a.wav 或.wav 的速度。 实时使用 arduino 的 aiff 文件 我不知道如何在不将它附加到 arduino 上的引脚 0 的情况下使 fade = 0
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM