將ESP8266 html頁面代碼集成到.ino文件中

我正在使用ESP8266，這是該程序的HTML部分。我從互聯網的深處複製並粘貼，並希望更改文件的HTML頁面。我能以什麼格式添加html代碼？謝謝！（我試圖把一個文本輸入字段，但我想在後面放很多HTML元素）。將ESP8266 html頁面代碼集成到.ino文件中

const String HtmlHtml = "<html><head>" 
"<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" /></head>";` 
const String HtmlHtmlClose = "</html>"; 
const String HtmlTitle = "<h1>Arduino-er: ESP8266 AP WebServer exercise</h1><br/>\n"; 
const String HtmlLedStateLow = "<big>LED is now <b>ON</b></big><br/>\n"; 
const String HtmlLedStateHigh = "<big>LED is now <b>OFF</b></big><br/>\n"; 
const String HtmlButtons = 
"<a href=\"LEDOn\"><button style=\"display: block; width: 100%;\">ON</button></a><br/>" 
"<a href=\"LEDOff\"><button style=\"display: block; width: 100%;\">OFF</button></a><br/>";

來源

2016-11-21 Peter Lynch

您想要將所有這些字符串寫入目標文件。 ''不是HTML網頁中的有效第一行。 ''塊在網頁的底部結束，而不是在''塊結束後立即'通常'結束。除了發佈內容之外，''塊還需要其他一些內容。發佈的代碼缺少''區塊，這是引用應該位於的區域。建議編寫所需的HTML頁面，然後插入所有需要的語句以將其保存到文件中 - 或者 - 將其顯示在Web瀏覽器中。 – user3629249

我認爲你以後有部分地方你結合你的變量，並使一個大的，你用來解散HTML。你可以做這樣的事情。

- 打開編輯器，並從您的文章複製/粘貼代碼

- 編輯它，只要你想

代碼 - 刪除變量，您張貼，並與更換，例如

const String wholePage = "INSERT YOUR HTML";

- 比在線添加變量之前，只需使用新的地方，整個HTML代碼

希望它有幫助！ :)

來源

2016-11-21 05:41:39 someRandomSerbianGuy

謝謝你，這使得waaaayyy現在更有意義！有沒有一種方法可以將輸入的信息輸入到html中的

喲可以從SPIFFS流式傳輸HTML文件。下面是一個example：

你需要得到streamFile（）函數如下表示：

String contentType = "text/html"; 
    if(SPIFFS.exists(path)){ 
    File file = SPIFFS.open(path, "r"); 
    size_t sent = server.streamFile(file, contentType); 
    file.close(); 
    return true; 
    }

來源

2016-11-21 06:27:15 cagdas

我可以將中輸入的信息保存爲eeprom，並有一些稍後查看的方法 –

本示例演示了文件服務方式，它將幫助您獲得可讀的html文件。如果你想保存通過這個頁面傳入你的web服務器的請求，當然你可以保存它，但是在另一個文件中。要做到這一點，你可以按照[指南]（https://github.com/esp8266/Arduino/blob/master/doc/filesystem.md）。 – cagdas

有沒有一種方法可以在此代碼snippit中使用SPIFFS.open（path，mode）代替responseHTML：dnsServer.start（DNS_PORT，「*」，apIP）; （）， //使用相同的HTML回放所有請求webServer.onNotFound（[]（）{ webServer.send（200，「text/html」，responseHTML）; }）; webServer。開始（）; } –

你可能要考慮清除它使用一個轉義多行語法：

void handleAbout() { 
    const char* message = R"foo(
    <!doctype html> 
    <html> 
    <head> 
     <meta charset="UTF-8"> 
     <title>test</title> 
    <link rel=stylesheet type=text/css href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css' /> 
    </head><body class=container> 
    <h1>testing</h1> 
    <main> 
    <h3>Status</h3> 
     <ul> 
     <li>Mode: <b>[[MODE]]</b> 
     <li><a href=/reset >reboot device</a> 
     </ul> 
    </main> 
    </body> 
    </html> 
    )foo"; 

    String message2= String(message); 
    // templating replaces string-concat functionality: 
    message2.replace("[[MODE]]", String(inputMode)); 
    // prove it's a usable String to the esp: 
    server.send(200, "text/html", message2); 
} // end about section handler

您還可以使用任何在線文本到json編碼器從任意文本中製作C友好的轉義字符串文字。例如：my slim's "JSON.stringify"引擎轉換...

來源

2016-11-24 07:34:28 dandavis

將ESP8266 html頁面代碼集成到.ino文件中

回答

相關問題