ArduinoでPROGMEMを使う時のサンプル

やりたいこと

Arduino UnoとEthernetShieldをつなげて、2-3KBのHTMLページを表示させたい。
EthernetClient#print()でHTMLのソースを直書きしようとするとコケるので、PROGMEMを使う。

使うもの

Arduino Uno R3(ここで実際に使用しているのはArduino Uno互換の DFRduino UNO R3)
Ethernet Shield(ここで実際に使用しているのはArduino Uno互換の DFRduino Ethernet Shield V2.1)

配線

（ArduinoにEthernet Shieldくっつけただけなので省略）

ソースコード

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

//PROGMEMを使うためのライブラリを読み込む
#include <avr/pgspace.h>

byte mac[] = {0x02, 0x02, 0x02, 0x02, 0x02, 0x02};
IPAddress ip(192,168,0,111);
EthernetServer server(80);

//PROGMEMの中身を設定 HTMLの頭と最後とコンテンツ
PROGMEM const prog_char HTML_HEADER[] = "<!DOCTYPE html><html lang=\"ja\"><head><meta charset=\"UTF-8\"><title>Arduino PROGMEM</title><style>.back{background-color:#00979c;height:30px;width:68px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}.logo{padding:4px 10px;}.logo img{}</style></head><body>";
PROGMEM const prog_char HTML_CONTENTS[] = "<div class=\"back\"><div class=\"logo\"><img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAXCAYAAAB0zH1SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RURDREU1RTkxOTMyMTFFMzlFMjhENzQxRERBQkI2RDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RURDREU1RUExOTMyMTFFMzlFMjhENzQxRERBQkI2RDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpFRENERTVFNzE5MzIxMUUzOUUyOEQ3NDFEREFCQjZENyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFRENERTVFODE5MzIxMUUzOUUyOEQ3NDFEREFCQjZENyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Po3sx30AAAOuSURBVHjapJdbSFRRFIaP9ywlp7ykqV20tBIsiBCCQioqo15MKih6CRK7PkT01JAVSBE9RJBdsIdALCGSQjFI0u6FFVI5RlKmphJeoNQynf5l60y7zTrHM9OC72H23mvN2td/nSCv12tY2DSQB9aCBSABhIEfoAM0gWpQCwYN/ywcrOb42SAZRIJR0ANaQA3H71L8MjgPj0GJa4SAIuDxOrOXYCcIFmJJFIBnDmN/AkdABPtuAM1gux40EdzyBmY3QYpNwtPB1QBj14E0XtQM4NKTfmrj3AVawVebMW9AtpD0HPDYxq+XY3eCMYsx78BcM6YZOAzcFgb3gDNgJUgFsZzEenAR9As+H8FCJWnahVfCuO+8A5t4NSl2MlgOToAOwecJiFITLxIG1YLMCc7rYlAt+L4GU0E4aBD6qS1ngtizQaXge8xM3MXbpBolM8XhZaPdOif8wWVwWmi/Zq6aA0JBueZPR3UmdW7TOrp5toafXHBwySp4F3TfVfwyZQl9LuGFO2gIN/14AEkTk/j2W1kjHx/J9wGPcVv079Vi3QnFY56pPPC/QJUmFjEgAowpbUGAlKuXRYNsGOwBDSxeqpFAFYEBpS1EGEciFA9+gn6lncToG4ji3/NoNi3aMZmhzbYMfGYxUPFYHKlDwmqXWFw+D8ca4nF9/Pu6NjaKhceXZyjP3LRRbWXJZrEkW0m3bh1CW7eF73xhd2NY9lUb49Pgs1BtS1wgTnN0g1LhqFCgTu0PYkGxkORhPoIflDbyzQfB/B9ZoBxUgj6hbkr85+hh2W9o27ovwMtJXLK5nFU29Yypqkct+rdqse7RbOu02RUql8AfOwB22fRvBCct+miVr4BGoY9OxX6trd6U5F5tRuf9XOlCMKKvCq+ybm4/Yxdr/sP03pudJcIfnHWgntHglOBLr1M6iBNUmawUxDtQTbfgW6bWKjGgSRj0AuwASRzI4NqYCq7dXJPoNgjylARyuFjT7T0pIE8wUvkWSACbwX2L+jxFTdwsmNotLhZVao+4hnlukYiXq8V8YfWouvxi4dPHqlrDCtpmMW4A5OplrclS7aH3x6heXmGz9Uv8+PLRjQRwjRpP+oMkrrWHHAbt5/sQ6+CiRXMt1OMw9ghXh+l6rCCbj+VlYAvIHa8N/j6RXhatZnAXVIC3fj6daaAArAOLWGCClbqGhOohC1K9FMAuccNX0Pz5uk7lN5W+8lvHv7QNo834P0vi2DSRyazO7bwoLUL54bPfAgwAepVw0Jtz1EAAAAAASUVORK5CYII=\" alt=\"arduino.png\"></div></div>";
PROGMEM const prog_char HTML_FOOTER[] = "</body></html>";

void setup() {
    Serial.begin(115200);
    while (!Serial) {
        ;
    }
    
    Ethernet.begin(mac, ip);
    server.begin();
    Serial.println(Ethernet.localIP());
}


void loop() {
    EthernetClient client = server.available();

    if (client) {
        boolean isBlankLine = true;
        while (client.available()) {
            char c = client.read();
            
            if (c == '\r') {
            } else if (c == '\n') {
                Serial.println("");
                
                if (isBlankLine) {
                    client.println("HTTP/1.1 200 OK");
                    client.println("Connection: close");
                    client.println("Content-Type: text/html; charset=utf-8");
                    client.println("");

                    //PROGMEMの中身を書き出す
                    html(HTML_HEADER, client);
                    html(HTML_CONTENTS, client);
                    client.println(Ethernet.localIP());
                    html(HTML_FOOTER, client);
                    break;
                }
                isBlankLine = true;
            } else {
                Serial.write(c);
                isBlankLine = false;
            }
        }

        delay(2);
        client.stop();
        Serial.println("client disconnected");
    }
}

void html(const prog_char str[], EthernetClient client)
{
  
    if (!str) {
        return;
    }
  
    char c;
    //pgm_read_byte()でPROGMEMの中身を出力する
    while((c = pgm_read_byte(str++))) {
        client.write(c);
    }
}

#include <SPI.h>

#include <Ethernet.h>

//PROGMEMを使うためのライブラリを読み込む

#include <avr/pgspace.h>

byte mac[] = {0x02, 0x02, 0x02, 0x02, 0x02, 0x02};

IPAddress ip(192,168,0,111);

EthernetServer server(80);

//PROGMEMの中身を設定 HTMLの頭と最後とコンテンツ

PROGMEM const prog_char HTML_HEADER[] = "<!DOCTYPE html><html lang=\"ja\"><head><meta charset=\"UTF-8\"><title>Arduino PROGMEM</title><style>.back{background-color:#00979c;height:30px;width:68px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}.logo{padding:4px 10px;}.logo img{}</style></head><body>";

PROGMEM const prog_char HTML_CONTENTS[] = "<div class=\"back\"><div class=\"logo\"><img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAXCAYAAAB0zH1SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RURDREU1RTkxOTMyMTFFMzlFMjhENzQxRERBQkI2RDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RURDREU1RUExOTMyMTFFMzlFMjhENzQxRERBQkI2RDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpFRENERTVFNzE5MzIxMUUzOUUyOEQ3NDFEREFCQjZENyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFRENERTVFODE5MzIxMUUzOUUyOEQ3NDFEREFCQjZENyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Po3sx30AAAOuSURBVHjapJdbSFRRFIaP9ywlp7ykqV20tBIsiBCCQioqo15MKih6CRK7PkT01JAVSBE9RJBdsIdALCGSQjFI0u6FFVI5RlKmphJeoNQynf5l60y7zTrHM9OC72H23mvN2td/nSCv12tY2DSQB9aCBSABhIEfoAM0gWpQCwYN/ywcrOb42SAZRIJR0ANaQA3H71L8MjgPj0GJa4SAIuDxOrOXYCcIFmJJFIBnDmN/AkdABPtuAM1gux40EdzyBmY3QYpNwtPB1QBj14E0XtQM4NKTfmrj3AVawVebMW9AtpD0HPDYxq+XY3eCMYsx78BcM6YZOAzcFgb3gDNgJUgFsZzEenAR9As+H8FCJWnahVfCuO+8A5t4NSl2MlgOToAOwecJiFITLxIG1YLMCc7rYlAt+L4GU0E4aBD6qS1ngtizQaXge8xM3MXbpBolM8XhZaPdOif8wWVwWmi/Zq6aA0JBueZPR3UmdW7TOrp5toafXHBwySp4F3TfVfwyZQl9LuGFO2gIN/14AEkTk/j2W1kjHx/J9wGPcVv079Vi3QnFY56pPPC/QJUmFjEgAowpbUGAlKuXRYNsGOwBDSxeqpFAFYEBpS1EGEciFA9+gn6lncToG4ji3/NoNi3aMZmhzbYMfGYxUPFYHKlDwmqXWFw+D8ca4nF9/Pu6NjaKhceXZyjP3LRRbWXJZrEkW0m3bh1CW7eF73xhd2NY9lUb49Pgs1BtS1wgTnN0g1LhqFCgTu0PYkGxkORhPoIflDbyzQfB/B9ZoBxUgj6hbkr85+hh2W9o27ovwMtJXLK5nFU29Yypqkct+rdqse7RbOu02RUql8AfOwB22fRvBCct+miVr4BGoY9OxX6trd6U5F5tRuf9XOlCMKKvCq+ybm4/Yxdr/sP03pudJcIfnHWgntHglOBLr1M6iBNUmawUxDtQTbfgW6bWKjGgSRj0AuwASRzI4NqYCq7dXJPoNgjylARyuFjT7T0pIE8wUvkWSACbwX2L+jxFTdwsmNotLhZVao+4hnlukYiXq8V8YfWouvxi4dPHqlrDCtpmMW4A5OplrclS7aH3x6heXmGz9Uv8+PLRjQRwjRpP+oMkrrWHHAbt5/sQ6+CiRXMt1OMw9ghXh+l6rCCbj+VlYAvIHa8N/j6RXhatZnAXVIC3fj6daaAArAOLWGCClbqGhOohC1K9FMAuccNX0Pz5uk7lN5W+8lvHv7QNo834P0vi2DSRyazO7bwoLUL54bPfAgwAepVw0Jtz1EAAAAAASUVORK5CYII=\" alt=\"arduino.png\"></div></div>";

PROGMEM const prog_char HTML_FOOTER[] = "</body></html>";

void setup() {

Serial.begin(115200);

while (!Serial) {

;

}

Ethernet.begin(mac, ip);

server.begin();

Serial.println(Ethernet.localIP());

}

void loop() {

EthernetClient client = server.available();

if (client) {

boolean isBlankLine = true;

while (client.available()) {

char c = client.read();

if (c == '\r') {

} else if (c == '\n') {

Serial.println("");

if (isBlankLine) {

client.println("HTTP/1.1 200 OK");

client.println("Connection: close");

client.println("Content-Type: text/html; charset=utf-8");

client.println("");

//PROGMEMの中身を書き出す

html(HTML_HEADER, client);

html(HTML_CONTENTS, client);

client.println(Ethernet.localIP());

html(HTML_FOOTER, client);

break;

}

isBlankLine = true;

} else {

Serial.write(c);

isBlankLine = false;

}

delay(2);

client.stop();

Serial.println("client disconnected");

}

void html(const prog_char str[], EthernetClient client)

{

if (!str) {

return;

}

char c;

//pgm_read_byte()でPROGMEMの中身を出力する

while((c = pgm_read_byte(str++))) {

client.write(c);

}

結果

ブラウザから「http://192.168.0.111/」にアクセスして、↓のような画面が表示されれば成功

Arduino PROGMEM