角的路由隐藏了不存在的路线404回应 [英] Angular's routing hides 404 responses for nonexistent routes

问题描述

我已经注意到了，GET为不存在的路径请求不返回404响应。相反，客户端得到一个200 OK，角呈现主视图，并重写的路径， / 。一种用于废话URI请求被记录为成功的服务器日志。如果我理解正确，问题是，由于角处理路由，服务器必须接受一个GET请求的URI和始终服务于应用程序的客户端（200 OK或304未修改）响应。

I have noticed that GET requests for nonexistent paths don't return a 404 response. Instead, the client gets a "200 Ok", Angular renders the main view, and rewrites the path to /. A request for a nonsense URI is logged as successful in the server logs. If I understand correctly, the problem is that since Angular handles routing, the server has to accept a GET request for any URI and always respond by serving the client side of the app ("200 Ok" or "304 Not Modified").

例如，利用由角fullstack 的约曼发生器脚手架项目，请求一个不存在的 /麒麟是这样的：

For example, using the project scaffolded by the angular-fullstack Yeoman generator, requesting a nonexistent /unicorn goes like this:

GET /unicorn 200 31ms - 3.29kb
GET /partials/main 304 36ms
GET /api/awesomeThings 304 5ms

这是处理请求的防爆preSS的路线是这样的：

The Express route that handles the request looks like this:

// server, last route:
app.get('*', controllers.index);

// controllers:
exports.index = function(req, res) {
  res.render('index');
};

和 index.jade 是应用程序的整个客户端的根源。

and index.jade is the root of the whole client side of the app.

在快速浏览一下其他角/ EX preSS项目在Github上服务器端code（的 Angualr前preSS种子，的角登陆），我看这是一个常见的​​模式。我想知道如果有一个更好的方式来处理不存在的路径请求，让客户得到真正的HTTP 404响应？

After a quick look at the server side code of other Angular / Express projects on Github (Angualr Express seed, Angular login), I see that this is a common pattern. I am wondering if there is a better way to handle requests for nonexistent paths, so that the client gets a real HTTP 404 response?

推荐答案

角文档有一个关于路由部分。此外，此<一href=\"http://stackoverflow.com/questions/12614072/how-do-i-configure-iis-for-url-rewriting-an-angularjs-application-in-html5-mode\">question这<一个href=\"http://stackoverflow.com/questions/17646843/angularjs-html5-mode-how-do-direct-links-work-without-server-specific-changes\">question有一个属于IIS，但可以很容易地适应前preSS的一些信息。

The angular documentation has a section about the routing. Also, this question and this question have some information that pertains to IIS but could easily be adapted to express.

Html link rewriting
When you use HTML5 history API mode, you will need different links in different browsers, but all you have to do is specify regular URL links, such as: <a href="/some?foo=bar">link</a>

When a user clicks on this link,

In a legacy browser, the URL changes to /index.html#!/some?foo=bar
In a modern browser, the URL changes to /some?foo=bar
In cases like the following, links are not rewritten; instead, the browser will perform a full page reload to the original link.

Links that contain target element
Example: <a href="/ext/link?a=b" target="_self">link</a>
Absolute links that go to a different domain
Example: <a href="http://angularjs.org/">link</a>
Links starting with '/' that lead to a different base path when base is defined
Example: <a href="/not-my-base/link">link</a>
When running Angular in the root of a domain, along side perhaps a normal application in the same directory, the "otherwise" route handler will try to handle all the URLs, including ones that map to static files.

To prevent this, you can set your base href for the app to <base href="."> and then prefix links to URLs that should be handled with .. Now, links to locations, which are not to be routed by Angular, are not prefixed with . and will not be intercepted by the otherwise rule in your $routeProvider.

Server side
Using this mode requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html)

这篇关于角的路由隐藏了不存在的路线404回应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！