Javascript – Probleme in erweiterten js-Programmen

Question

Als ich Seite 492 von Advanced JavaScript Programming (dritte Ausgabe) sah, hatte ich eine Frage

Wenn ich eine „gefälschte“ URL verwende und diese aktualisiere, wird ein 404-Fehler zurückgegeben. Sofern ich keinen echten Link wie diesen auf dem Webserver habe, muss der Benutzer die Seite zwangsläufig aktualisieren echt? Die Datei entspricht dem echten Link. Was nützt pushState() dann nicht?

Answer 1

pushState主要用在SPA应用中, 回答题主的问题:

出现404。这是因为PushState模式下的URL里面没有#，浏览器会真的向服务端发起一个请求，而我们在服务端并没有对应于这个路径的资源。

但是并不需要在服务器上有一个真链接(会把人累死), 只需要更改一下服务器的配置, 让不存在的页面(404)重定向到根路由即可.

以Tomcat为例，配置非常简单，只要在你的项目的web.xml里面加上以下配置就可以了：

    <error-page>
        <error-code>404</error-code>
        <location>/</location>
    </error-page>

这样一来，对于找不到资源的路径，Tomcat会全部重定向到根路径上去，这样你的前端框架不论是angular/vue/react/backbone 就可以在前端自己处理请求的URL了。

对于其它类型的服务端，例如nginx/apache/IIS，请参考这篇文档：https://github.com/angular-ui...

来源: https://my.oschina.net/mumu/b...

Answer 2

按刷新会以当前浏览器的url发请求到服务器。

例如你通过pushState()把当前地址变成 boomshaklaka.com/boom
点刷新后服务器收到这个地址发现不存在会返回404的。

Answer 3

首先你要理解前端路由跟后端路由的区别。

在只有后端路由的情况下，你请求的所有页面都是由后端返回给你的，这时所有路由都是由后端控制。

但有时侯我们不希望刷新页面，但url也想它改变，比如SPA应用。这时候我们就需要一个前端路由，这个pushState在这就起这个作用。

Answer 4

首先我还是习惯后台处理路由, 我就以后台路由举例子:

首先url 可以任意去定义, 至于你想关联项目中的哪个文件, 任意

<action name="index">
    <result>xxx/index.jsp</result>
</action>
<action name="login">
    <result>xxx/index.jsp</result>
</action>

可以由不同的action指向同一个页面, 所以你的网站要至少保证有一个页面吧

其次:

在 HTML 文件中, history.pushState() 方法向浏览器历史添加了一个状态。

更多是用来设置一个锚点:

 window.location = "#foo";

至于文中说的404还是因为路由的指向有问题, 没有找到资源.