我正在尝试使用 AngularJS 作为我网站的主视图来创建 SPA。我在服务器端使用 ServiceStack，因此可以根据访问它的内容干净地提供 HTML 或 JSON 请求。我主要担心的是脚本拦截器的使用，阻止 AngularJS 正确呈现页面。到目前为止，我的主要工作方式是呈现静态页面，并注入(inject)一个小脚本，如果它检测到是否启用了 Javascript，该脚本将重定向到 AngularJS 支持的页面。这很好用，因为当用户从静态页面开始时每个 URL 都工作正常，但我遇到了一些问题。
- 如果 JavaScript 被禁用，浏览到包含“?View=SPA”的链接会破坏页面
- 这会导致加载的第一个页面被加载两次。
我正在寻找替代方案，但到目前为止我还没有找到任何干净的解决方案。我正在考虑将“?View=SPA”作为一个 POST 变量，但我仍然不确定该实现。
有什么想法吗？
最佳答案
我不会重定向到其他页面，而是在同一个 HTML 文件中实现这两种情况，如下所示:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<style>.hideIfNoScript {display: none}</style>
</head>
<body ng-app ng-init="msg = 'hello world'">
<input class="hideIfNoScript" ng-model="msg" />
<p class="hideIfNoScript">{{msg}}</p>
<noscript>
<p>Content without javascript</p>
</noscript>
<script type="text/javascript">
var myEl = angular.element( document.querySelectorAll( '.hideIfNoScript' ) );
myEl.removeClass('hideIfNoScript');
</script>
</body>
</html>
head 部分中的 CSS 类 hideIfNoScript 确保在禁用 javascript 的情况下，所有具有此类的 HTML 标签都不会向用户显示。
noscript 标签显示替代内容。
如果启用了 javascript，正文部分末尾 的小脚本会使这些元素可见。在这种情况下，noscript 标签的内容是隐藏的。
关于带无脚本的 AngularJS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19145041/