logo标签列表

服务器端包含的替代方案

htmliframegithub-pagesserver-side-includes
12

我有一个托管在GitHub Pages上的静态网站，它正在逐渐增长。通常情况下，我会使用服务器端包含（<?php include('path to file'); ?>）来引入头部、尾部和任何导航文件。但是GitHub Pages不支持php。

HTML5嵌入采用了一种类似iFrame的技术，在这种情况下，我的唯一选择是吗？

我看到了相关主题，比如这个，这个，这个，这个，但它们似乎并不适用于GitHub Pages。

这个解决方案不是很理想。

谢谢。

3
PHP的include不是SSI。 - Quentin
7个回答
15
有没有一种方法可以在不使用主题的情况下使用该语法？我正在将一个网站移植到 GitHub 页面上；它已经有了自己的样式。我只需要让包含文件正常工作即可。 - user664303
5
使用模板并在构建时进行预处理（与运行时相反）。您可以将它们设置为在 git 提交钩子中构建。
有许多工具可以做到这一点列在此处，我喜欢ttree。
谢谢Quentin。有些有用的帮助，我会尝试一下。 - user3406225
3

我知道这是一个晚回答，但最近我偶然发现了一些东西。
原来，在http://w3schools.com/的人们创建了一些简单的JavaScript代码作为SSI的替代方案：

<!DOCTYPE html>
<html>
<script>
function w3IncludeHTML() {
  var z, i, a, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    if (z[i].getAttribute("w3-include-html")) {
      a = z[i].cloneNode(false);
      file = z[i].getAttribute("w3-include-html");
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
          a.removeAttribute("w3-include-html");
          a.innerHTML = xhttp.responseText;

          z[i].parentNode.replaceChild(a, z[i]);
          w3IncludeHTML();
        }
      }      
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}
</script>
<body>
<div w3-include-html="content.html"></div>
<script>
w3IncludeHTML();
</script>
</body>
</html>

这是一个例子，

点击这里查看。

1
@PatMyron 很高兴看到有人觉得它有用！ - undo
它不支持CSS样式，因此基本上这不是一个解决方案。 content.html 中的任何内容都不会被样式化。 因此，没有工作的导航等。 - Joshua Robison
0

我写了两个bash脚本，它们可以做你想要的事情（其实你也是出于同样的原因而在询问）。现在这非常基础，但对你有所帮助。文档不存在，但应该很容易弄清楚并使其适用于你的网站。

https://gitlab.com/frc-team-8733/website/-/tree/master/tools

-2

jQuery的load()在这方面效果很好。

-2
-5

应该支持SSI！

<!--#include virtual="layout.html" -->

包含上述行的文件必须以“.shtml”或“.shtm”扩展名结尾！
2
GitHub Pages 不支持 SSI。 - mt_xing
@mt_xing，谁说它被支持了？ - User
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接