Question

我一直在寻找如何获取HTML网页的基本网址，以便来自浏览器的相对网址请求使用该网址。

这是答案 Defining root of HTML in a folder within the site root folder

从服务器呈现HTML时 - 是否有可靠的方法将<base>元素添加到HTML中？

HTML文件是自动生成的，我不想手动将<base>标记添加到文件中，如果我可以避免的话。当页面被渲染时，以某种方式动态添加它会很不错。

所以这是现有的HTML：

<head>
    <title>Code coverage report for All files</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="prettify.css" />
    <link rel="stylesheet" href="base.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style type='text/css'>
        .coverage-summary .sorter {
            background-image: url(sort-arrow-sprite.png);
        }
    </style>
</head>

我想在使用服务器进行渲染时添加基本标记，因此它看起来像：

<head>
    <title>Code coverage report for All files</title>
    <meta charset="utf-8" />
    <base href="http://localhost:3050/coverage/lcov-report/cdt-now/index.html">  // <<<<
    <link rel="stylesheet" href="prettify.css" />
    <link rel="stylesheet" href="base.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style type='text/css'>
        .coverage-summary .sorter {
            background-image: url(sort-arrow-sprite.png);
        }
    </style>
</head>

我认为问题是index.html文件不在我的项目的根目录：

但是index.html文件会根据上面<link>中的<head>标记看到相对路径请求。

我目前正在渲染这样的页面：

router.get('/', ac.allow('Admin'), function (req, res, next) {

  let html = path.resolve(__dirname + '/../coverage/lcov-report/cdt-now/index.html');

  res.setHeader('content-type', 'text/html');
  fs.createReadStream(html).pipe(res);

});

Answer 1

所以这样做的方法是使用我当前的代码将响应流式传输到浏览器：

    const replacestream = require('replacestream');

    router.get('/', ac.allow('Admin'), function (req, res, next) {

      let html, val = 'coverage/lcov-report/cdt-now/index.html';

      try {
        html = path.resolve(__dirname + `/../${val}`);
        fs.existsSync(html)
      }
      catch (err) {
        return next(err);
      }

      res.setHeader('content-type', 'text/html');
      let replacement = `</title><base href="http://localhost:3050/${val}">`;

      fs.createReadStream(html).pipe(replacestream('</title>', replacement)).pipe(res);

    });

这是基本的想法。

在服务器端渲染

1 个答案: