Angular 5：无法在“历史”上执行“replaceState”：无法在原始“null”的文档中创建具有 URL 的历史状态对象

Question

在我的应用程序的 build --prod 从根目录加载 index.html 或由服务器托管时出现此错误：

ERROR Error: Uncaught (in promise): SecurityError: Failed to execute 'replaceState' on 'History': A history state object with URL 'file:///G:/#/' cannot be created in a document with origin 'null' and URL 'file:///G:/index.html'.
Error: Failed to execute 'replaceState' on 'History': A history state object with URL 'file:///G:/#/' cannot be created in a document with origin 'null' and URL 'file:///G:/index.html'.
    at e.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at e.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.resetUrlToCurrentUrlTree (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.resetStateAndUrl (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at vendor.7c715405490dfd9b75c0.bundle.js:1
    at t.invoke (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at Object.onInvoke (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.invoke (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at e.run (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at e.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at e.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.replaceState (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.resetUrlToCurrentUrlTree (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.resetStateAndUrl (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at vendor.7c715405490dfd9b75c0.bundle.js:1
    at t.invoke (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at Object.onInvoke (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.invoke (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at e.run (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at P (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
    at t.invokeTask (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at Object.onInvokeTask (vendor.7c715405490dfd9b75c0.bundle.js:1)
    at t.invokeTask (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at e.runTask (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at v (polyfills.ae3fb5d11cc61f1acad9.bundle.js:1)
    at <anonymous>
kt @ vendor.7c715405490dfd9b75c0.bundle.js:1
t.handleError @ vendor.7c715405490dfd9b75c0.bundle.js:1
next @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.object.i @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.__tryOrUnsub @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.next @ vendor.7c715405490dfd9b75c0.bundle.js:1
e._next @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.next @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.next @ vendor.7c715405490dfd9b75c0.bundle.js:1
e.emit @ vendor.7c715405490dfd9b75c0.bundle.js:1
(anonymous) @ vendor.7c715405490dfd9b75c0.bundle.js:1
t.invoke @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
e.run @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
t.runOutsideAngular @ vendor.7c715405490dfd9b75c0.bundle.js:1
onHandleError @ vendor.7c715405490dfd9b75c0.bundle.js:1
t.handleError @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
e.runGuarded @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
t @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
n.microtaskDrainDone @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
v @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
Promise.then (async)
d @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
t.scheduleTask @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
e.scheduleTask @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
e.scheduleMicroTask @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
O @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
t.then @ polyfills.ae3fb5d11cc61f1acad9.bundle.js:1
t.bootstrapModule @ vendor.7c715405490dfd9b75c0.bundle.js:1
x35b @ main.991a69005f6003446625.bundle.js:1
t @ inline.31e1fb380eb7cf3d75b1.bundle.js:1
0 @ main.991a69005f6003446625.bundle.js:1
t @ inline.31e1fb380eb7cf3d75b1.bundle.js:1
window.webpackJsonp @ inline.31e1fb380eb7cf3d75b1.bundle.js:1
(anonymous) @ main.991a69005f6003446625.bundle.js:1

我不明白这一点，因为即使我打开 index.html 并手动编辑它 这里：<script>document.write('<base href="./" />') 和这里 <base href="./"> 错误仍然存​​在。

请给我一个指导以避免这种错误。

Answer 1

Angular 项目不能简单地放在硬盘驱动器或虚拟根驱动器上，然后双击它们的 index.html。这将显示页面，但它会识别出它没有被某种服务器“服务”。

不要这样做。

而是将您的应用与 tomcat 或其他一些负责运行它的服务器软件捆绑在一起。这样就会有一个原点。