Update: 2020-05-24

Esp8266 Bme280 als Arduino Tab.

Bme280.ino

// ****************************************************************
// Sketch Esp8266 Bme280 Modular(Tab)
// created: Jens Fleischer, 2018-06-03
// last mod: Jens Fleischer, 2019-12-30
// For more information visit: https://fipsok.de
// ****************************************************************
// Hardware: Esp8266, Bme280, 2 x 4k7 Ohm Widerstand
// SCL an D1 = GPIO5
// SDA an D2 = GPIO4
// 4k7 Ohm Widerstand von VCC auf D1
// 4k7 Ohm Widerstand von VCC auf D2
// Software: Esp8266 Arduino Core 2.4.2 / 2.5.2 / 2.6.3
// Getestet auf: Nodemcu, Wemos D1 Mini Pro
/******************************************************************
  Copyright (c) 2018 Jens Fleischer. All rights reserved.

  This file is free software; you can redistribute it and/or
  modify it under the terms of the GNU Lesser General Public
  License as published by the Free Software Foundation; either
  version 2.1 of the License, or (at your option) any later version.
  This file is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
  Lesser General Public License for more details.
*******************************************************************/
// Diese Version von Bme280 sollte als Tab eingebunden werden.
// #include <ESP8266WebServer.h> muss im Haupttab aufgerufen werden
// Die Funktionalität des ESP8266 Webservers ist erforderlich.
// Die Funktion "bme280();" muss im Setup aufgerufen werden.
// Gib die Höhe in Meter über Meeresspiegel an deinem Standort an.
/**************************************************************************************/

#include <Wire.h>
#include <BME280I2C.h>        // Version 2.3 https://www.github.com/finitespace/BME280

BME280I2C bme;                // Standard : Zwangsmodus, Standby-Zeit = 1000 ms

void bme280() {               // Funktionsaufruf "bme280();" muss im Setup eingebunden werden
  Wire.begin();
  if (!bme.begin()) {
    Serial.println("Keinen BME280 Sensor gefunden!");
  }
  server.on("/bme280", []() {
    server.send(200, "application/json", handleBme());
  });
}

String handleBme() {
  const auto ALTITUDE = 163;        // virtuelle Höhe in Meter über Meeresspiegel an deinem Standort anpassen
  float temp(NAN), hum(NAN), pres(NAN);
  bme.read(pres, temp, hum, BME280::TempUnit_Celsius, BME280::PresUnit_hPa);
  const uint16_t SEALEVEL = (pres / pow(1 - ((0.0065 * ALTITUDE) / (temp + (0.0065 * ALTITUDE) + 273.15)), 5.257));    // Berechnung relativer Luftdruck
  return (String)"[\"" + temp + "\",\"" + hum + "\",\"" + SEALEVEL + "\"]";
}

Die Webseite zum Esp8266 BME280.

bme280.html

<!DOCTYPE HTML> <!-- For more information visit: https://fipsok.de -->
<html lang='de'>
  <head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <link rel='stylesheet' href='style.css'>
    <title>Klimadaten</title>
    <script>
	  addEventListener('DOMContentLoaded', renew, setInterval(renew, 1000));
      function renew() {
        fetch('/bme280').then( (response) => {
          return response.json();
        }).then( (array) => {
          temp.innerHTML = array[0] != 'nan' ? array[0] + '°C' : '---------';
          hum.innerHTML = array[0] != 'nan' ? array[1] + ' %' : 'Fehler';
          pres.innerHTML = array[0] != 'nan' ? array[2] + ' hPa' : '---------';
        });
      } 
    </script>
    <style>
      main {
		display: flex;
        flex-direction: column;	  
        align-items: center;
        background-color: black;
		font-size: 3em;
		margin-top: .5em;
        width: 6em;
        padding: 0.2em;			
        border: .15em solid #aeaeab;
        box-shadow: 5px 7px 10px;
        border-radius: .2em;
      }
      span {
        color: #02fc07;
        position: relative;
        top: .1em;
        left: .1em;
        font-weight: bold
      }
    </style>
  </head>
  <body>
    <main>
      <span id="temp"></span>
      <span id="hum"></span>
      <span id="pres"></span>
    </main>
  </body>
</html>

Für den zweiten Esp8266 mit Bme280 bitte die Hinweise unten beachten.

Die Webseite für Zwei Esp8266 mit BME280.

bme280InOut.html

<!DOCTYPE HTML> <!-- For more information visit: https://fipsok.de -->
<html lang="de">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="style.css">
    <title>Innen und Aussen Klimadaten</title>
    <script>
      function renew() {
      fetch('/bme280').then(response => {
      	return response.json();
      }).then(array => {
      	var elem = document.querySelector('#tempIn');
      	array[0] != 'nan' ? elem.innerHTML = array[0].replace(".", ",") + '°C' : elem.innerHTML = '---------';
      	elem = document.querySelector('#humIn');
      	array[0] != 'nan' ? elem.innerHTML = array[1].replace(".", ",") + ' %' : elem.innerHTML = 'Fehler';
      	elem = document.querySelector('#presIn');
      	array[0] != 'nan' ? elem.innerHTML = array[2].replace(".", ",") + ' hPa' : elem.innerHTML = '---------';
      });
      fetch('http://192.168.178.33/bme280').then(response => {		<!-- Trage hier die IP deines zweiten Esp8266 BME280 ein -->
      	return response.json();
      }).then(array => {
      	elem = document.querySelector('#tempOut');
      	array[0] != 'nan' ? elem.innerHTML = array[0].replace(".", ",") + '°C' : elem.innerHTML = '---------';
      	elem = document.querySelector('#humOut');
      	array[0] != 'nan' ? elem.innerHTML = array[1].replace(".", ",") + ' %' : elem.innerHTML = 'Fehler';
      	elem = document.querySelector('#presOut');
      	array[0] != 'nan' ? elem.innerHTML = array[2].replace(".", ",") + ' hPa' : elem.innerHTML = '---------';
      });
      }
      document.addEventListener('DOMContentLoaded', renew, setInterval(renew, 1000));   <!-- Interval einstellen  in ms -->
    </script>
    <style>
      body {
      padding: 10px;
      font-size: 3em;
      }
      section {
      align-items: center;
      background-color: black;
      margin-bottom: 0.5em;
      width: 290px;
      height: 180px;
      border: .15em solid #aeaeab;
      box-shadow: 5px 10px 5px rgba(0, 0, 0, 0.7);
      border-radius: .2em;
      }
      span {
      color: #02fc07;
      position: relative;
      top: 0.2em;
      left: .1em;
      font-weight: bold
      }
    </style>
  </head>
  <body>
    Innenklima
    <section>
      <span id="tempIn"></span>
      <span id="humIn"></span>
      <span id="presIn"></span> 	 
    </section>
    Aussenklima
    <section>
      <span id="tempOut"></span>
      <span id="humOut"></span>
      <span id="presOut"></span>
    </section>
  </body>
</html>
Achtung!
Ab Arduino Core Version 2.4.0 oder höher, wird der HTTP-Header für Cors nicht mehr in der ESP8266WebServer Library gesetzt,
deshalb ist es notwendig beim Zweiten Esp8266, vor "server.send(200, "application/json", handleBme());" den HTTP-Header zu senden.

Füge folgende Zeile vor "server.send();" ein.

" server.sendHeader("Access-Control-Allow-Origin", "*"); "