Как авторизовать пересылку веб-страницы с помощью http-proxy-middleware - PullRequest
Новая
       29

Как авторизовать пересылку веб-страницы с помощью http-proxy-middleware

0 голосов
/ 28 апреля 2019

Я хочу показать пользователям моего веб-приложения их собственную веб-страницу, обслуживаемую локально в сети VPN за сервером NodeJS Express.

Я использую http-proxy-middleware для предоставления доступа, например, к http://192.168.0.17:4000/index.htm веб-странице. На этой странице используются 3 сценария .js, поэтому мне пришлось добавить в прокси-сервер эти три сценария: 

require("rootpath")();
const express = require("express");
const app = express();
const cors = require("cors");
const bodyParser = require("body-parser");
const jwt = require("_helpers/jwt");
const errorHandler = require("_helpers/error-handler");
var proxy = require("http-proxy-middleware");

var apiProxy = proxy({
  target: "http://192.168.14.111",
  changeOrigin: true,
  logLevel: "debug" 
});

app.use(cors());

app.use(
  [
    "/index.htm",
    "/project.js",
    "/webmicfg.js",
    "/webmi.js"
  ],
  apiProxy
);

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.use(jwt());

app.use("/users", require("./users/users.controller"));
app.use("/heatpumps", require("./heatpumps/heatpump.controller"));

app.use(errorHandler);

const port =
  process.env.NODE_ENV === "production" ? process.env.PORT || 80 : 4000;
const server = app.listen(port, function() {
  console.log("Server listening on port " + port);
});

У пользователя есть iframe, объект или тег для встраивания для доступа к своей веб-странице: 

<iframe
  width="600"
  height="400"
  title="sdf"
  src="http://192.168.0.17:4000/index.htm"
/>
<object
  data="http://192.168.0.17:4000/index.htm"
  width="600"
  height="400"
/>
<embed
  src="http://192.168.0.17:4000/index.htm"
  width="600"
  height="400"
/>

Но этот доступ неограничен. Теперь любой может указать на http://192.168.0.17:4000/index.htm и получить доступ к http://192.168.14.111/index.htm

Я думал, что смогу отправить заголовок аутентификации, извлекая запрос, но извлеченный html не загружается должным образом. Я пробовал с: 

<script>
      var headers = new Headers();

      var requestOptions = {
        method: "GET",
        headers: { "Content-Type": "text/html" },
        mode: "cors",
        cache: "default"
      };

      fetch("http://localhost:4000/index.htm", requestOptions)
        .then(function(response) {
          return response.text();
        })
        .then(function(text) {
          console.log(text);
          document.querySelector("#output-frame-id").srcdoc= text;
        });
</script>


<iframe src="" width="600px" height="400px" id="output-frame-id"></iframe>

В консоли я получаю свою html-страницу, но она не загружается в iframe из-за неперехваченной ошибки ссылки из-за отсутствия загрузки этих трех скриптов .js. Я думаю, что это не очень хороший способ сделать это, потому что HTML-страница загружается в другом контексте, чем это предполагалось на удаленном сервере.

Как отправить авторизацию на прокси, если вы хотите получить доступ к перенаправленной веб-странице следующим образом: 

<iframe title="sdf" src="http://192.168.0.17:4000/index.htm"/>
...