titi
/
ESP32_OSC_IMU


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392
							
<!doctype html>
<html lang="en" class="no-js">
  <head>
    
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width,initial-scale=1">
      
        <meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
      
      
        <link rel="canonical" href="https://Hieromon.github.io/AutoConnect/adothers.html">
      
      
        <meta name="author" content="Hieromon Ikasamo">
      
      <link rel="shortcut icon" href="assets/images/favicon.png">
      <meta name="generator" content="mkdocs-1.1.2, mkdocs-material-6.1.6">
    
    
        <title>Other operation settings and controls - AutoConnect for ESP8266/ESP32</title>
      
    
      <link rel="stylesheet" href="assets/stylesheets/main.6910b76c.min.css">
      
        
        <link rel="stylesheet" href="assets/stylesheets/palette.196e0c26.min.css">
        
          
          <meta name="theme-color" content="#4051b5">
        
      
        <link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700%7CRoboto+Mono&display=fallback">
        <style>body,input{font-family:"Roboto",-apple-system,BlinkMacSystemFont,Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono",SFMono-Regular,Consolas,Menlo,monospace}</style>
      
    
      <link rel="stylesheet" href="css/paragraph.css">
    
      <link rel="stylesheet" href="css/extra.css">
    
      <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css">
    
    
<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview"),document.addEventListener("DOMContentLoaded",function(){document.forms.search&&document.forms.search.query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}),document.addEventListener("DOMContentSwitch",function(){ga("send","pageview",document.location.pathname)})</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
      
    
  </head>
  
  
    <body dir="ltr" data-md-color-scheme="" data-md-color-primary="indigo" data-md-color-accent="indigo">
      
  
    <input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
    <input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
    <label class="md-overlay" for="__drawer"></label>
    <div data-md-component="skip">
      
        
        <a href="#built-in-ota-update-feature" class="md-skip">
          Skip to content
        </a>
      
    </div>
    <div data-md-component="announce">
      
    </div>
    
      
<header class="md-header" data-md-component="header">
  <nav class="md-header-nav md-grid" aria-label="Header">
    <a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo" aria-label="AutoConnect for ESP8266/ESP32">
      
  <img src="images/arduino-logo.svg" alt="logo">

    </a>
    <label class="md-header-nav__button md-icon" for="__drawer">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2z"/></svg>
    </label>
    <div class="md-header-nav__title" data-md-component="header-title">
      
        <div class="md-header-nav__ellipsis">
          <span class="md-header-nav__topic md-ellipsis">
            AutoConnect for ESP8266/ESP32
          </span>
          <span class="md-header-nav__topic md-ellipsis">
            
              Other operation settings and controls
            
          </span>
        </div>
      
    </div>
    
      <label class="md-header-nav__button md-icon" for="__search">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0116 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 019.5 16 6.5 6.5 0 013 9.5 6.5 6.5 0 019.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
      </label>
      
<div class="md-search" data-md-component="search" role="dialog">
  <label class="md-search__overlay" for="__search"></label>
  <div class="md-search__inner" role="search">
    <form class="md-search__form" name="search">
      <input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" data-md-state="active" required>
      <label class="md-search__icon md-icon" for="__search">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0116 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 019.5 16 6.5 6.5 0 013 9.5 6.5 6.5 0 019.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
      </label>
      <button type="reset" class="md-search__icon md-icon" aria-label="Clear" data-md-component="search-reset" tabindex="-1">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"/></svg>
      </button>
    </form>
    <div class="md-search__output">
      <div class="md-search__scrollwrap" data-md-scrollfix>
        <div class="md-search-result" data-md-component="search-result">
          <div class="md-search-result__meta">
            Initializing search
          </div>
          <ol class="md-search-result__list"></ol>
        </div>
      </div>
    </div>
  </div>
</div>
    
    
      <div class="md-header-nav__source">
        
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source">
  <div class="md-source__icon md-icon">
    
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05L244 40.45a28.87 28.87 0 00-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 01-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 000 40.81l195.61 195.6a28.86 28.86 0 0040.8 0l194.69-194.69a28.86 28.86 0 000-40.81z"/></svg>
  </div>
  <div class="md-source__repository">
    Hieromon/AutoConnect
  </div>
</a>
      </div>
    
  </nav>
</header>
    
    <div class="md-container" data-md-component="container">
      
      
      <main class="md-main" data-md-component="main">
        <div class="md-main__inner md-grid">
          
            
              <div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
                <div class="md-sidebar__scrollwrap">
                  <div class="md-sidebar__inner">
                    

<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
  <label class="md-nav__title" for="__drawer">
    <a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo" aria-label="AutoConnect for ESP8266/ESP32">
      
  <img src="images/arduino-logo.svg" alt="logo">

    </a>
    AutoConnect for ESP8266/ESP32
  </label>
  
    <div class="md-nav__source">
      
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source">
  <div class="md-source__icon md-icon">
    
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05L244 40.45a28.87 28.87 0 00-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 01-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 000 40.81l195.61 195.6a28.86 28.86 0 0040.8 0l194.69-194.69a28.86 28.86 0 000-40.81z"/></svg>
  </div>
  <div class="md-source__repository">
    Hieromon/AutoConnect
  </div>
</a>
    </div>
  
  <ul class="md-nav__list" data-md-scrollfix>
    
      
  <li class="md-nav__item">
    <a href="index.html" class="md-nav__link">
      Overview
    </a>
  </li>

    
  <li class="md-nav__item">
    <a href="gettingstarted.html" class="md-nav__link">
      Getting started
    </a>
  </li>

    
  <li class="md-nav__item">
    <a href="menu.html" class="md-nav__link">
      AutoConnect menu
    </a>
  </li>

    
  <li class="md-nav__item">
    <a href="basicusage.html" class="md-nav__link">
      Basic usage
    </a>
  </li>

    
  <li class="md-nav__item md-nav__item--active md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-5" type="checkbox" id="nav-5" checked>
    <label class="md-nav__link" for="nav-5">
      Advanced usage
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="Advanced usage" data-md-level="1">
      <label class="md-nav__title" for="nav-5">
        <span class="md-nav__icon md-icon"></span>
        Advanced usage
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="advancedusage.html" class="md-nav__link">
      Advanced usage
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adconnection.html" class="md-nav__link">
      AutoConnect WiFi connection control
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adcpcontrol.html" class="md-nav__link">
      Captive portal control
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adnetwork.html" class="md-nav__link">
      Settings and controls for network and WiFi
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adauthentication.html" class="md-nav__link">
      Authentication settings
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adcredential.html" class="md-nav__link">
      Credential accesses
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="adexterior.html" class="md-nav__link">
      Customizing page appearance
    </a>
  </li>

        
  <li class="md-nav__item md-nav__item--active">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="toc" type="checkbox" id="__toc">
    
    
      <label class="md-nav__link md-nav__link--active" for="__toc">
        Other operation settings and controls
        <span class="md-nav__icon md-icon"></span>
      </label>
    
    <a href="adothers.html" class="md-nav__link md-nav__link--active">
      Other operation settings and controls
    </a>
    
      
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
  
  
    <label class="md-nav__title" for="__toc">
      <span class="md-nav__icon md-icon"></span>
      Table of contents
    </label>
    <ul class="md-nav__list" data-md-scrollfix>
      
        <li class="md-nav__item">
  <a href="#built-in-ota-update-feature" class="md-nav__link">
    Built-in OTA update feature
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#choice-of-the-filesystem-for-esp8266" class="md-nav__link">
    Choice of the filesystem for ESP8266
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#debug-print" class="md-nav__link">
    Debug Print
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#file-uploading-via-built-in-ota-feature" class="md-nav__link">
    File uploading via built-in OTA feature
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#refers-the-hosted-esp8266webserverwebserver" class="md-nav__link">
    Refers the hosted ESP8266WebServer/WebServer
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#reset-the-esp-module-after-disconnecting-from-wlan" class="md-nav__link">
    Reset the ESP module after disconnecting from WLAN
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#ticker-for-wifi-status" class="md-nav__link">
    Ticker for WiFi status
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#usage-for-automatically-instantiated-esp8266webserverwebserver" class="md-nav__link">
    Usage for automatically instantiated ESP8266WebServer/WebServer
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#use-with-the-pagebuilder-library" class="md-nav__link">
    Use with the PageBuilder library
  </a>
  
</li>
      
    </ul>
  
</nav>
    
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6" >
    <label class="md-nav__link" for="nav-6">
      Custom Web pages
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="Custom Web pages" data-md-level="1">
      <label class="md-nav__title" for="nav-6">
        <span class="md-nav__icon md-icon"></span>
        Custom Web pages
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="acintro.html" class="md-nav__link">
      Custom Web pages with AutoConnect
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="acelements.html" class="md-nav__link">
      AutoConnectElements
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="acjson.html" class="md-nav__link">
      Custom Web pages with JSON
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="achandling.html" class="md-nav__link">
      Handling the custom Web pages
    </a>
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7" >
    <label class="md-nav__link" for="nav-7">
      OTA Updates
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="OTA Updates" data-md-level="1">
      <label class="md-nav__title" for="nav-7">
        <span class="md-nav__icon md-icon"></span>
        OTA Updates
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="otaupdate.html" class="md-nav__link">
      OTA Updates
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="otabrowser.html" class="md-nav__link">
      Using Web Browser
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="otaserver.html" class="md-nav__link">
      Using Update Server
    </a>
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8" >
    <label class="md-nav__link" for="nav-8">
      Library APIs
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="Library APIs" data-md-level="1">
      <label class="md-nav__title" for="nav-8">
        <span class="md-nav__icon md-icon"></span>
        Library APIs
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="api.html" class="md-nav__link">
      AutoConnect API
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="apiaux.html" class="md-nav__link">
      AutoConnectAux API
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="apiconfig.html" class="md-nav__link">
      AutoConnectConfig API
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="apielements.html" class="md-nav__link">
      AutoConnectElements API
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="apiupdate.html" class="md-nav__link">
      AutoConnectUpdate API
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="apiextra.html" class="md-nav__link">
      Something extra
    </a>
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-9" type="checkbox" id="nav-9" >
    <label class="md-nav__link" for="nav-9">
      Examples
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="Examples" data-md-level="1">
      <label class="md-nav__title" for="nav-9">
        <span class="md-nav__icon md-icon"></span>
        Examples
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="howtoembed.html" class="md-nav__link">
      How to embed
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="datatips.html" class="md-nav__link">
      Tips for data conversion
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="menuize.html" class="md-nav__link">
      Attach the menus
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="wojson.html" class="md-nav__link">
      Custom Web pages w/o JSON
    </a>
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item md-nav__item--nested">
    
    <input class="md-nav__toggle md-toggle" data-md-toggle="nav-10" type="checkbox" id="nav-10" >
    <label class="md-nav__link" for="nav-10">
      Appendix
      <span class="md-nav__icon md-icon"></span>
    </label>
    <nav class="md-nav" aria-label="Appendix" data-md-level="1">
      <label class="md-nav__title" for="nav-10">
        <span class="md-nav__icon md-icon"></span>
        Appendix
      </label>
      <ul class="md-nav__list" data-md-scrollfix>
        
        
  <li class="md-nav__item">
    <a href="lsbegin.html" class="md-nav__link">
      Inside AutoConnect::begin
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="credit.html" class="md-nav__link">
      Saved credentials access
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="acupload.html" class="md-nav__link">
      File upload handler
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="colorized.html" class="md-nav__link">
      Custom colorized
    </a>
  </li>

        
  <li class="md-nav__item">
    <a href="changelabel.html" class="md-nav__link">
      Change label text
    </a>
  </li>

        
      </ul>
    </nav>
  </li>

    
  <li class="md-nav__item">
    <a href="faq.html" class="md-nav__link">
      FAQ
    </a>
  </li>

    
  <li class="md-nav__item">
    <a href="changelog.html" class="md-nav__link">
      Change log
    </a>
  </li>

    
  <li class="md-nav__item">
    <a href="license.html" class="md-nav__link">
      License
    </a>
  </li>

    
  </ul>
</nav>
                  </div>
                </div>
              </div>
            
            
              <div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
                <div class="md-sidebar__scrollwrap">
                  <div class="md-sidebar__inner">
                    
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
  
  
    <label class="md-nav__title" for="__toc">
      <span class="md-nav__icon md-icon"></span>
      Table of contents
    </label>
    <ul class="md-nav__list" data-md-scrollfix>
      
        <li class="md-nav__item">
  <a href="#built-in-ota-update-feature" class="md-nav__link">
    Built-in OTA update feature
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#choice-of-the-filesystem-for-esp8266" class="md-nav__link">
    Choice of the filesystem for ESP8266
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#debug-print" class="md-nav__link">
    Debug Print
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#file-uploading-via-built-in-ota-feature" class="md-nav__link">
    File uploading via built-in OTA feature
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#refers-the-hosted-esp8266webserverwebserver" class="md-nav__link">
    Refers the hosted ESP8266WebServer/WebServer
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#reset-the-esp-module-after-disconnecting-from-wlan" class="md-nav__link">
    Reset the ESP module after disconnecting from WLAN
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#ticker-for-wifi-status" class="md-nav__link">
    Ticker for WiFi status
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#usage-for-automatically-instantiated-esp8266webserverwebserver" class="md-nav__link">
    Usage for automatically instantiated ESP8266WebServer/WebServer
  </a>
  
</li>
      
        <li class="md-nav__item">
  <a href="#use-with-the-pagebuilder-library" class="md-nav__link">
    Use with the PageBuilder library
  </a>
  
</li>
      
    </ul>
  
</nav>
                  </div>
                </div>
              </div>
            
          
          <div class="md-content">
            <article class="md-content__inner md-typeset">
              
                
                  <h1>Other operation settings and controls</h1>
                
                <p>AutoConnect also has features that are not directly related to WiFi connection abilities. They're mostly like a little accessory but can reduce the amount of sketch code. </p>
<ul>
<li><a href="#built-in-ota-update-feature">Built-in OTA update</a></li>
<li><a href="#choice-of-the-filesystem-for-esp8266">Choice of the filesystem for ESP8266</a></li>
<li><a href="#debug-print">Debug Print</a></li>
<li><a href="#file-uploading-via-built-in-ota-feature">File uploading via built-in OTA feature</a></li>
<li><a href="#refers-the-hosted-esp8266webserverwebserver">Refers the hosted ESP8266WebServer/WebServer</a></li>
<li><a href="#reset-the-esp-module-after-disconnecting-from-wlan">Reset the ESP module after disconnecting from WLAN</a></li>
<li><a href="#ticker-for-wifi-status">Ticker for WiFi status</a></li>
<li><a href="#usage-for-automatically-instantiated-esp8266webserverwebserver">Usage for automatically instantiated ESP8266WebServer/WebServer</a></li>
<li><a href="#use-with-the-pagebuilder-library">Use with the PageBuilder library</a></li>
</ul>
<h2 id="built-in-ota-update-feature">Built-in OTA update feature<a class="headerlink" href="#built-in-ota-update-feature" title="Permanent link">&para;</a></h2>
<p>AutoConnect features a built-in OTA function to update ESP module firmware. You can easily make the Sketch that equips OTA and able to operate with the AutoConnect menu.</p>
<p><span style="display:block;margin-left:auto;margin-right:auto;width:284px;height:462px;border:1px solid lightgrey;"><img data-gifffer="images/webupdate.gif" data-gifffer-height="460" data-gifffer-width="282" /></span></p>
<p><a href="apiconfig.html#ota"><em>AutoConnectConfig::ota</em></a> specifies to import the <a href="otabrowser.html">built-in OTA update class</a> into the Sketch.<br />
See the <a href="otabrowser.html">Updates with the Web Browser</a> chapter for details.</p>
<h2 id="choice-of-the-filesystem-for-esp8266">Choice of the filesystem for ESP8266<a class="headerlink" href="#choice-of-the-filesystem-for-esp8266" title="Permanent link">&para;</a></h2>
<p>For ESP8266, since the Arduino core v2.7.0, SPIFFS has deprecated and the migration to <a href="https://arduino-esp8266.readthedocs.io/en/latest/filesystem.html?highlight=littleFS#spiffs-deprecation-warning"><strong>LittleFS</strong></a> is being promoted currently. AutoConnect has adopted LittleFS as the default filesystem to follow the core standard.</p>
<p>However, SPIFFS is still valid. AutoConnect can correctly compile and execute sketches made with SPIFFS assumed. When you make an AutoConnect sketch with SPIFFS enabled, you need to change the macro definition that <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h#L39"><code>AutoConnectDefs.h</code></a> has.<br />
<strong>AC_USE_SPIFFS</strong> definition will enable SPIFFS as the filesystem.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #75715e">#define AC_USE_SPIFFS</span>
</code></pre></div>
<p>See also the <a href="faq.html#unable-to-change-any-macro-definitions-by-the-sketch">FAQ</a> to help you enable AC_USE_SPIFFS correctly.</p>
<h2 id="debug-print">Debug Print<a class="headerlink" href="#debug-print" title="Permanent link">&para;</a></h2>
<p>You can output AutoConnect monitor messages to the <strong>Serial</strong>. A monitor message activation switch is in an include header file <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h"><code>AutoConnectDefs.h</code></a> of library source. Define <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h#L14"><strong>AC_DEBUG</strong></a> macro to output the monitor messages.<sup id="fnref:1"><a class="footnote-ref" href="#fn:1">1</a></sup></p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #75715e">#define AC_DEBUG</span>
</code></pre></div>
<p>AutoConnect does not automatically start the Serial even if AC_DEBUG is activated. The Sketch should start the Serial during its setup phase using <strong><code>Serial.begin(BAUDRATE)</code></strong>.</p>
<div class="admonition note">
<p class="admonition-title">How to enable AC_DEBUG</p>
<p>The <strong>#define</strong> is a C++ preprocessor directive. The build process of the Sketch by the Arduino IDE is processed independently of the subsequent C++ compilation unit. Writing the #define directive for AC_DEBUG in the Sketch has no effect on the AutoConnect library.<br />
To compile the AutoConnect library with the AC_DEBUG directive, you can either edit the library source code directly (usually it is located in ~/Arduino/libraries/AutoConnect/src) or use a build system which can configure the preprocessor directives externally such as <a href="https://platformio.org/"><strong>PlatformIO</strong></a>.</p>
</div>
<h2 id="file-uploading-via-built-in-ota-feature">File uploading via built-in OTA feature<a class="headerlink" href="#file-uploading-via-built-in-ota-feature" title="Permanent link">&para;</a></h2>
<p>The <a href="otabrowser.html">built-in OTA update feature</a> can update the firmware as well as upload regular files placed in the file system on the ESP module. It allows a regular file is uploaded via OTA using the <a href="menu.html#update"><strong>Update</strong></a> of AutoConnect menu without adding a particular custom Web page that contains AutoConnectFile. This ability is useful for transferring the JSON document of the custom web page definition, the external parameter file of your sketch, and so on into the target ESP module via OTA.</p>
<p>The built-in OTA update feature determines where to save the uploaded file according to the filename pattern. By default, a filename with ends a <strong><code>.bin</code></strong> extension is subject to firmware updates. A file that has the other extension will be saved as a regular to the filesystem in the flash. The file extension that should be treated as the firmware is defined as the <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h#L280"><code>AUTOCONNECT_UPLOAD_ASFIRMWARE</code></a> macro in <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h">AutoConnectDefs.h</a> header file of the library source code. When dealing with another extension for the updating file as firmware change this macro definition.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #75715e">#define AUTOCONNECT_UPLOAD_ASFIRMWARE &quot;.bin&quot;</span>
</code></pre></div>
<div class="admonition note">
<p class="admonition-title">Specify with the PlatformIO</p>
<p><code>AUTOCONNECT_UPLOAD_ASFIRMWARE</code> pattern will be embedded into the binary sketch is determined at compile time. The <a href="https://platformio.org/platformio-ide"><strong>PlatformIO</strong></a> build system allows you to change the pattern expression for each project without modifying the library source code.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #a6e22e">build_flags</span><span style="color: #f92672">=</span><span style="color: #e6db74">-DAUTOCONNECT_UPLOAD_ASFIRMWARE=&#39;&quot;.bin&quot;&#39;</span>
</code></pre></div>
</div>
<h2 id="refers-the-hosted-esp8266webserverwebserver">Refers the hosted ESP8266WebServer/WebServer<a class="headerlink" href="#refers-the-hosted-esp8266webserverwebserver" title="Permanent link">&para;</a></h2>
<p>Constructing an AutoConnect object variable without parameters then creates and starts an ESP8266WebServer/WebServer inside the AutoConnect. This object variable could be referred by <a href="api.html#host">AutoConnect::host</a> function to access ESP8266WebServer/WebServer instance as like below.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #f8f8f2">AutoConnect</span> <span style="color: #f8f8f2">Portal;</span>

<span style="color: #f8f8f2">Portal.begin();</span>
<span style="background-color: #49483e"><span style="color: #f8f8f2">ESP8266WebServer</span><span style="color: #f92672">&amp;</span> <span style="color: #f8f8f2">server</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">Portal.host();</span>
</span><span style="color: #f8f8f2">server.send(</span><span style="color: #ae81ff">200</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;text/plain&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;Hello, world&quot;</span><span style="color: #f8f8f2">);</span>
</code></pre></div>
<div class="admonition info">
<p class="admonition-title">When host() is valid</p>
<p>The host() can be referred at after <a href="api.html#begin">AutoConnect::begin</a>.</p>
</div>
<h2 id="reset-the-esp-module-after-disconnecting-from-wlan">Reset the ESP module after disconnecting from WLAN<a class="headerlink" href="#reset-the-esp-module-after-disconnecting-from-wlan" title="Permanent link">&para;</a></h2>
<p><a href="menu.html#disconnect">Disconnect</a> by menu operation allows the ESP8266/ESP32 module to reset automatically after disconnecting from WLAN. This behavior is enabled by default and can be disabled by <a href="apiconfig.html#autoreset"><em>AutoConnectConfig::autoReset</em></a> settings.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #f8f8f2">AutoConnect</span>       <span style="color: #f8f8f2">Portal;</span>
<span style="color: #f8f8f2">AutoConnectConfig</span> <span style="color: #f8f8f2">Config;</span>
<span style="background-color: #49483e"><span style="color: #f8f8f2">Config.autoReset</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">false;</span> <span style="color: #75715e">// Continue sketch processing even after disconnecting from by AutoConnect menu.</span>
</span><span style="color: #f8f8f2">Portal.config(Config);</span>
<span style="color: #f8f8f2">Portal.begin();</span>
</code></pre></div>
<p>The <a href="apiconfig.html#autoreset"><strong>autoReset</strong></a> setting will automatically reset the ESP module when disconnecting WiFi only if you intentionally navigate the <a href="menu.html#disconnect">menu</a>. And it does not participate in passive disconnection conditions such as disconnection due to sketch processing or loss of WiFi signal. </p>
<p>You can combine <a href="apiconfig.html#autoreset"><strong>autoReset</strong></a> with <a href="apiconfig.html#autoreconnect"><strong>autoReconnect</strong></a> to disconnect from WiFi and automatically reconnect to another AP while continuing the Sketch operation.</p>
<p>The Sketch below shows an example of a  meaningful combination of <a href="apiconfig.html#autoreset"><strong>autoReset</strong></a> and <a href="apiconfig.html#autoreconnect"><strong>autoReconnect</strong></a>. It can connect to the access point once with the captive portal but assumes that it can be disconnected from the WLAN by intentional menu navigation. In that case, the Sketch will continue processing without resetting the module. Then an external switch allows to start automatic reconnecting. In this situation, if known access points appear nearby, the ESP module will automatically reconnect to them in the handleClient loop. In this state transition, the module continues the Sketch process without resetting.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #f8f8f2">AutoConnect</span>       <span style="color: #f8f8f2">Portal;</span>
<span style="color: #f8f8f2">AutoConnectConfig</span> <span style="color: #f8f8f2">Config;</span>

<span style="color: #66d9ef">const</span> <span style="color: #66d9ef">int</span> <span style="color: #f8f8f2">reconnectSwitch</span> <span style="color: #f92672">=</span> <span style="color: #ae81ff">14</span><span style="color: #f8f8f2">;</span> <span style="color: #75715e">// Assign the reconnect switch to GPIO14</span>

<span style="color: #f8f8f2">ICACHE_RAM_ATTR</span> <span style="color: #66d9ef">void</span> <span style="color: #f8f8f2">detectsReconnect()</span> <span style="color: #f8f8f2">{</span>
  <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(</span><span style="color: #f92672">!</span><span style="color: #f8f8f2">Config.autoReconnect)</span> <span style="color: #f8f8f2">{</span>  <span style="color: #75715e">// Chattering elimination</span>
    <span style="color: #75715e">// autoReconnect is enabled by interrupt of the GPIO trigger,</span>
    <span style="color: #f8f8f2">Config.autoReconnect</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">true;</span>  <span style="color: #75715e">// Activate reconnection</span>
    <span style="color: #f8f8f2">Config.reconnectInterval</span> <span style="color: #f92672">=</span> <span style="color: #ae81ff">2</span><span style="color: #f8f8f2">;</span> <span style="color: #75715e">// Attempt to reconnect at 60 seconds intervals.</span>
    <span style="color: #f8f8f2">Portal.config(Config);</span>
    <span style="color: #f8f8f2">Serial.printf(</span><span style="color: #e6db74">&quot;Turn on autoReconnect, interval %d[s]</span><span style="color: #ae81ff">\n</span><span style="color: #e6db74">&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #f8f8f2">Config.reconnectInterval</span> <span style="color: #f92672">*</span> <span style="color: #f8f8f2">AUTOCONNECT_UNITTIME);</span>
  <span style="color: #f8f8f2">}</span>
<span style="color: #f8f8f2">}</span>

<span style="color: #66d9ef">void</span> <span style="color: #f8f8f2">setup()</span> <span style="color: #f8f8f2">{</span>
  <span style="color: #f8f8f2">delay(</span><span style="color: #ae81ff">1000</span><span style="color: #f8f8f2">);</span>
  <span style="color: #f8f8f2">Serial.begin(</span><span style="color: #ae81ff">115200</span><span style="color: #f8f8f2">);</span>
  <span style="color: #f8f8f2">Serial.println();</span>

  <span style="color: #f8f8f2">Config.ticker</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">true;</span>   <span style="color: #75715e">// Setting up WiFi connection indicator</span>
  <span style="color: #f8f8f2">Portal.config(Config);</span>  

  <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(Portal.begin())</span> <span style="color: #f8f8f2">{</span>
    <span style="color: #f8f8f2">Config.autoReset</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">false;</span>
    <span style="color: #f8f8f2">Portal.config(Config);</span>

    <span style="color: #75715e">// Set external switch pin to reconnect as interrupt, assign interrupt function and set RISING mode</span>
    <span style="color: #f8f8f2">pinMode(reconnectSwitch,</span> <span style="color: #f8f8f2">INPUT_PULLUP);</span>
    <span style="color: #f8f8f2">attachInterrupt(digitalPinToInterrupt(reconnectSwitch),</span> <span style="color: #f8f8f2">detectsReconnect,</span> <span style="color: #f8f8f2">RISING);</span>
  <span style="color: #f8f8f2">}</span>
<span style="color: #f8f8f2">}</span>

<span style="color: #66d9ef">void</span> <span style="color: #f8f8f2">loop()</span> <span style="color: #f8f8f2">{</span>
  <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(WiFi.status()</span> <span style="color: #f92672">==</span> <span style="color: #f8f8f2">WL_CONNECTED)</span> <span style="color: #f8f8f2">{</span>
    <span style="color: #75715e">/*</span>
<span style="color: #75715e">    Here, your sketch process with WiFi connection</span>
<span style="color: #75715e">    */</span>
  <span style="color: #f8f8f2">}</span>
  <span style="color: #66d9ef">else</span> <span style="color: #f8f8f2">{</span>
    <span style="color: #75715e">/*</span>
<span style="color: #75715e">    Here, your sketch process without WiFi connection</span>
<span style="color: #75715e">    */</span>
  <span style="color: #f8f8f2">}</span>

  <span style="color: #75715e">// Post process, turn to initial state of autoReconnect.</span>
  <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(Config.autoReconnect)</span> <span style="color: #f8f8f2">{</span>
    <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(WiFi.status()</span> <span style="color: #f92672">==</span> <span style="color: #f8f8f2">WL_CONNECTED)</span> <span style="color: #f8f8f2">{</span>
      <span style="color: #f8f8f2">Config.autoReconnect</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">false;</span>
      <span style="color: #f8f8f2">Portal.config(Config);</span>
    <span style="color: #f8f8f2">}</span>
  <span style="color: #f8f8f2">}</span>

  <span style="color: #75715e">// The actual reconnection takes place within handleClient.</span>
  <span style="color: #f8f8f2">Portal.handleClient();</span>
<span style="color: #f8f8f2">}</span>
</code></pre></div>
<div class="admonition info">
<p class="admonition-title">An external switch wiring to GPIO</p>
<p>The wiring for the above Sketch assumes a momentary effects switch that connects the GPIO pin 14 to GND. You can experience it with easily wire on a breadboard using a NodeMCU as like:</p>
<p><img src="images/extswitch.png" style="width:320px;"/></p>
</div>
<h2 id="ticker-for-wifi-status">Ticker for WiFi status<a class="headerlink" href="#ticker-for-wifi-status" title="Permanent link">&para;</a></h2>
<p>Flicker signal can be output from the ESP8266/ESP32 module according to WiFi connection status. By wiring the LED to the signal output pin with the appropriate limiting resistor, you can know the WiFi connection status through the LED blink during the inside behavior of AutoConnect::begin and loop of AutoConnect::handleClient.</p>
<p><a href="apiconfig.html#ticker"><em>AutoConnectConfig::ticker</em></a> option specifies flicker signal output. The following sketch is an example of blinking the active-low LED connected to <code>GPIO16</code> depending on the WiFi connection status.<sup id="fnref:2"><a class="footnote-ref" href="#fn:2">2</a></sup></p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #f8f8f2">AutoConnect</span>        <span style="color: #f8f8f2">portal;</span>
<span style="color: #f8f8f2">AutoConnectConfig</span>  <span style="color: #f8f8f2">Config;</span>
<span style="color: #f8f8f2">Config.ticker</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">true;</span>
<span style="color: #f8f8f2">config.tickerPort</span> <span style="color: #f92672">=</span> <span style="color: #ae81ff">16</span><span style="color: #f8f8f2">;</span>
<span style="color: #f8f8f2">Config.tickerOn</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">LOW;</span>
<span style="color: #f8f8f2">portal.config(Config);</span>
<span style="color: #f8f8f2">portal.begin();</span>
</code></pre></div>
<p>The AutoConnect ticker indicates the WiFi connection status in the following three flicker patterns:</p>
<ul>
<li>Short blink: The ESP module stays in AP_STA mode.</li>
<li>Short-on and long-off: No STA connection state. (i.e. WiFi.status != WL_CONNECTED)</li>
<li>No blink: WiFi connection with access point established and data link enabled. (i.e. WiFi.status = WL_CONNECTED)</li>
</ul>
<p>The flicker cycle length is defined by some macros in <a href="https://github.com/Hieromon/AutoConnect/blob/master/src/AutoConnectDefs.h#L180"><code>AutoConnectDefs.h</code></a> header file.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #75715e">#define AUTOCONNECT_FLICKER_PERIODAP  1000 // [ms]</span>
<span style="color: #75715e">#define AUTOCONNECT_FLICKER_PERIODDC  (AUTOCONNECT_FLICKER_PERIODAP &lt;&lt; 1) // [ms]</span>
<span style="color: #75715e">#define AUTOCONNECT_FLICKER_WIDTHAP   96  // (8 bit resolution)</span>
<span style="color: #75715e">#define AUTOCONNECT_FLICKER_WIDTHDC   16  // (8 bit resolution)</span>
</code></pre></div>
<ul>
<li><strong>AUTOCONNECT_FLICKER_PERIODAP</strong>:<br />
  Assigns a flicker period when the ESP module stays in AP_STA mode.</li>
<li><strong>AUTOCONNECT_FLICKER_PERIODDC</strong>:<br />
  Assigns a flicker period when WiFi is disconnected.</li>
<li><strong>AUTOCONNECT_FLICKER_WIDTHAP</strong> and <strong>AUTOCONNECT_FLICKER_WIDTHDC</strong>:<br />
  Specify the duty rate for each period [ms] in 8-bit resolution.</li>
</ul>
<div class="admonition note">
<p class="admonition-title">Ticker during OTA</p>
<p>The LED blinking will always be a short blinking during the update via OTA, regardless of the definition of the flicker cycle.</p>
</div>
<p><a href="apiconfig.html#tickerport"><em>AutoConnectConfig::tickerPort</em></a> specifies a port that outputs the flicker signal. If you are using an LED-equipped ESP module board, you can assign a LED pin to the tick-port for the WiFi connection monitoring without the external LED. The default pin is arduino valiant's <strong>LED_BUILTIN</strong>. You can refer to the Arduino IDE's variant information to find out which pin actually on the module assign to <strong>LED_BUILTIN</strong>.<sup id="fnref:3"><a class="footnote-ref" href="#fn:3">3</a></sup></p>
<p><a href="apiconfig.html#tickeron"><em>AutoConnectConfig::tickerOn</em></a> specifies the active logic level of the flicker signal. This value indicates the active signal level when driving the ticker. For example, if the LED connected to tickPort lights by LOW, the tickerOn is <strong>LOW</strong>. The logic level of LED_BUILTIN for popular modules are as follows:</p>
<table>
<thead>
<tr>
<th>module</th>
<th>Logic level</th>
<th align="center">LED_BUILTIN Pin</th>
<th>Arduino alias</th>
</tr>
</thead>
<tbody>
<tr>
<td>NodeMCU V1.0</td>
<td>Active-low</td>
<td align="center">16</td>
<td>D0</td>
</tr>
<tr>
<td>WEMOS D1 mini</td>
<td>Active-low</td>
<td align="center">2</td>
<td>D4</td>
</tr>
<tr>
<td>SparkFun ESP8266 Thing</td>
<td>Active-high</td>
<td align="center">5</td>
<td></td>
</tr>
<tr>
<td>Adafruit Feather HUZZAH ESP8266</td>
<td>Active-low</td>
<td align="center">0</td>
<td></td>
</tr>
<tr>
<td>NodeMCU 32s</td>
<td>Active-high</td>
<td align="center">2</td>
<td>T2</td>
</tr>
<tr>
<td>LOLIN32 Pro</td>
<td>Active-low</td>
<td align="center">5</td>
<td>SS</td>
</tr>
<tr>
<td>SparkFun ESP32 Thing</td>
<td>Active-high</td>
<td align="center">5</td>
<td></td>
</tr>
<tr>
<td>Adafruit Feather HUZZAH32</td>
<td>Active-high</td>
<td align="center">13</td>
<td>A12</td>
</tr>
</tbody>
</table>
<h2 id="usage-for-automatically-instantiated-esp8266webserverwebserver">Usage for automatically instantiated ESP8266WebServer/WebServer<a class="headerlink" href="#usage-for-automatically-instantiated-esp8266webserverwebserver" title="Permanent link">&para;</a></h2>
<p>The Sketch can handle URL requests using ESP8266WebServer or WebServer that AutoConnect started internally. ESP8266WebServer/WebServer instantiated dynamically by AutoConnect can be referred to by <a href="api.html#host">AutoConnect::host</a> function. The Sketch can use the '<strong>on</strong>' function, '<strong>send</strong>' function, '<strong>client</strong>' function and others by ESP8266WebServer/WebServer reference of its return value.</p>
<div class="highlight" style="background: #272822"><pre style="line-height: 125%; margin: 0;"><span></span><code><span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;ESP8266WiFi.h&gt;</span>
<span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;ESP8266WebServer.h&gt;</span>
<span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;AutoConnect.h&gt;</span>

<span style="color: #f8f8f2">AutoConnect</span>       <span style="color: #f8f8f2">Portal;</span>

<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">handleRoot</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="background-color: #49483e">  <span style="color: #f8f8f2">ESP8266WebServer</span><span style="color: #f92672">&amp;</span> <span style="color: #f8f8f2">IntServer</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">Portal.host();</span>
</span><span style="background-color: #49483e">  <span style="color: #f8f8f2">IntServer.send(</span><span style="color: #ae81ff">200</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;text/html&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;Hello, world&quot;</span><span style="color: #f8f8f2">);</span>
</span><span style="color: #f8f8f2">}</span>

<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">handleNotFound</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="background-color: #49483e">  <span style="color: #f8f8f2">ESP8266WebServer</span><span style="color: #f92672">&amp;</span> <span style="color: #f8f8f2">IntServer</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">Portal.host();</span>
</span><span style="background-color: #49483e">  <span style="color: #f8f8f2">IntServer.send(</span><span style="color: #ae81ff">404</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;text/html&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;Unknown.&quot;</span><span style="color: #f8f8f2">);</span>
</span><span style="color: #f8f8f2">}</span>

<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">setup</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
  <span style="color: #66d9ef">bool</span> <span style="color: #f8f8f2">r</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">Portal.begin();</span>
  <span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(r)</span> <span style="color: #f8f8f2">{</span>
<span style="background-color: #49483e">    <span style="color: #f8f8f2">ESP8266WebServer</span><span style="color: #f92672">&amp;</span> <span style="color: #f8f8f2">IntServer</span> <span style="color: #f92672">=</span> <span style="color: #f8f8f2">Portal.host();</span>
</span><span style="background-color: #49483e">    <span style="color: #f8f8f2">IntServer.on(</span><span style="color: #e6db74">&quot;/&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #f8f8f2">handleRoot);</span>
</span>    <span style="color: #f8f8f2">Portal.onNotFound(handleNotFound);</span>    <span style="color: #75715e">// For only onNotFound.</span>
  <span style="color: #f8f8f2">}</span>
<span style="color: #f8f8f2">}</span>

<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">loop</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="background-color: #49483e">  <span style="color: #f8f8f2">Portal.host().handleClient();</span>
</span>  <span style="color: #f8f8f2">Portal.handleRequest();</span>
  <span style="color: #75715e">/* or following one line code is equ.</span>
<span style="color: #75715e">  Portal.handleClient();</span>
<span style="color: #75715e">  */</span>
<span style="color: #f8f8f2">}</span>
</code></pre></div>
<div class="admonition note">
<p class="admonition-title">ESP8266WebServer/WebServer function should be called after AutoConnect::begin</p>
<p>The Sketch cannot refer to an instance of ESP8266WebServer/WebServer until AutoConnect::begin completes successfully.</p>
</div>
<div class="admonition warning">
<p class="admonition-title">Do not use with ESP8266WebServer::begin or WebServer::begin</p>
<p>ESP8266WebServer/WebServer is already running inside the AutoConnect.</p>
</div>
<h2 id="use-with-the-pagebuilder-library">Use with the <a href="https://github.com/Hieromon/PageBuilder">PageBuilder</a> library<a class="headerlink" href="#use-with-the-pagebuilder-library" title="Permanent link">&para;</a></h2>
<p>In ordinary, the URL handler will respond to the request from the client by sending some HTML. It will dynamically generate the HTML to respond to based on the sensing data etc. for the changing scene, but it contains elements of variable values in the middle of the HTML fixed string. Therefore, sketches tend to be in a tangled that repeats the logic for data handling and string splicing in turn, which tends to be less readable and maintainable.</p>
<p><a href="https://github.com/Hieromon/PageBuilder">PageBuilder</a> library is an HTML assembly aid. it can handle predefined HTML like the template and simplify an HTML string assemble logic, and also the generated HTML send automatically.</p>
<p>An example sketch used with the PageBuilder as follows and it explains how it aids for the HTML generating. Details for <a href="https://github.com/Hieromon/PageBuilder">Github repository</a>.</p>
<p><img src="images/PageBuilder.png" style="width:640px;"/></p>
<script>
  window.onload = function() {
    Gifffer();
  };
</script>

<div class="footnote">
<hr />
<ol>
<li id="fn:1">
<p>The source code placement of common macros for AutoConnect since v0.9.7 has changed.&#160;<a class="footnote-backref" href="#fnref:1" title="Jump back to footnote 1 in the text">&#8617;</a></p>
</li>
<li id="fn:2">
<p>The ESP module pin mapping is different for each breakout. Definitions for assigning pin numbers to pin names usually exist in the variant definition program of Arduino core packages. (e.g. <a href="https://github.com/esp8266/Arduino/tree/master/variants">esp8266/arduino core</a>, <a href="https://github.com/espressif/arduino-esp32/tree/master/variants">arduino-esp32 core</a>)<br />
You may find the definition as <code>pins_arduino.h</code>.&#160;<a class="footnote-backref" href="#fnref:2" title="Jump back to footnote 2 in the text">&#8617;</a></p>
</li>
<li id="fn:3">
<p>It's defined in the <code>pins_arduino.h</code> file, located in the sub-folder named <strong>variants</strong> wherein Arduino IDE installed folder.&#160;<a class="footnote-backref" href="#fnref:3" title="Jump back to footnote 3 in the text">&#8617;</a></p>
</li>
</ol>
</div>
                
              
            </article>
          </div>
        </div>
      </main>
      
        
<footer class="md-footer">
  
    <div class="md-footer-nav">
      <nav class="md-footer-nav__inner md-grid" aria-label="Footer">
        
          <a href="adexterior.html" class="md-footer-nav__link md-footer-nav__link--prev" rel="prev">
            <div class="md-footer-nav__button md-icon">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
            </div>
            <div class="md-footer-nav__title">
              <div class="md-ellipsis">
                <span class="md-footer-nav__direction">
                  Previous
                </span>
                Customizing page appearance
              </div>
            </div>
          </a>
        
        
          <a href="acintro.html" class="md-footer-nav__link md-footer-nav__link--next" rel="next">
            <div class="md-footer-nav__title">
              <div class="md-ellipsis">
                <span class="md-footer-nav__direction">
                  Next
                </span>
                Custom Web pages with AutoConnect
              </div>
            </div>
            <div class="md-footer-nav__button md-icon">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11H4z"/></svg>
            </div>
          </a>
        
      </nav>
    </div>
  
  <div class="md-footer-meta md-typeset">
    <div class="md-footer-meta__inner md-grid">
      <div class="md-footer-copyright">
        
          <div class="md-footer-copyright__highlight">
            Copyright &copy; 2018-2020 Hieromon Ikasamo
          </div>
        
        Made with
        <a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
          Material for MkDocs
        </a>
      </div>
      
  <div class="md-footer-social">
    
      
      <a href="https://github.com/Hieromon" target="_blank" rel="noopener" title="github.com" class="md-footer-social__link">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
      </a>
    
      
      <a href="https://twitter.com/hieromon" target="_blank" rel="noopener" title="twitter.com" class="md-footer-social__link">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg>
      </a>
    
  </div>

    </div>
  </div>
</footer>
      
    </div>
    
      <script src="assets/javascripts/vendor.fd16492e.min.js"></script>
      <script src="assets/javascripts/bundle.7836ba4d.min.js"></script><script id="__lang" type="application/json">{"clipboard.copy": "Copy to clipboard", "clipboard.copied": "Copied to clipboard", "search.config.lang": "en", "search.config.pipeline": "trimmer, stopWordFilter", "search.config.separator": "[\\s\\-]+", "search.placeholder": "Search", "search.result.placeholder": "Type to start searching", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.term.missing": "Missing"}</script>
      
      <script>
        app = initialize({
          base: ".",
          features: [],
          search: Object.assign({
            worker: "assets/javascripts/worker/search.4ac00218.min.js"
          }, typeof search !== "undefined" && search)
        })
      </script>
      
        <script src="js/gifffer.min.js"></script>
      
    
  </body>
</html>