Ember渲染404与无效的URL lug。 [英] Ember render 404 with Invalid URL Slugs

问题描述

我在我的应用程序中使用动态网址，方便易读。网址结构是 / [：organization_slug] / [：product_slug] 。换句话说，组织是产品的所有者。出于安全考虑，如果某人在网址中不存在某个组织时，我希望显示404。同样地，当不存在的产品输入到URL时，显示404。

I'm using dynamic URLs in my application for easy readability. The url structure is /[:organization_slug]/[:product_slug]. In other words, an organization is the owner of a product. For security purposes, I want to display a 404 when somebody types an organization in the URL when it doesn't exist. Also similarly, display a 404 when a product that doesn't exist is entered into the URL.

我已按照在这篇文章中。然后，我正在调用 afterModel 来查看查询是否返回一条记录，并尝试转换到 fourOhFour 路由如果不。以下是我现在的相关代码：

I've implemented the Ember 404 as described in this post. Then, I'm hooking into afterModel to see if the query returned a record and trying to transition into the fourOhFour route if not. Here is my relevant code currently:

router.js

Router.map(function() {
  this.route("fourOhFour", {path: "*path"});
  this.resource('organization', {path: ':organization_slug'}, function() {
    this.resource('product', {path: ':product_slug'});
  });
});

routes / organization.js

var OrganizationRoute = Ember.Route.extend({
  model: function(params) {
    return this.store.find('organization', {slug: params.organization_slug});
  },
  afterModel: function(organization, transition) {
    if(organization.get('length') === 0) {
      //If it's not a correct URL render the 404
      this.transitionTo("fourOhFour");
    }
  },

  serialize: function(model) {
    return {organization_slug: model.get('slug')};
  }
});

export default OrganizationRoute;

routes / product.js

var ProductRoute = Ember.Route.extend({
  model: function(params) {
    var self = this;
    // Verify that the product belongs to the organization in the URL
    return this.store.find('organization', {slug: Ember.organizationSlug}).then(function(organization) {
      var organizationID = organization.get('firstObject.id');
      return self.store.find('product', {slug: params.product_slug, organization: organizationID});
    });
  },
  afterModel: function(product) {
    if(product.get('length') === 0) {
      this.transitionTo("fourOhFour");
    }
  },
  serialize: function(model) {
    return {product_slug: model.get('slug')};
  }
});

export default ProductRoute;

问题是转换未触发。该路线未激活，并且模板未被呈现。我认为这与路由存在是由于动态URL的性质有关的。但是，我想维护URL路径，但显示404模板，这不能正常工作。如果我将404路由的路径更改为静态字符串，如 / 404 ，则转换工作。但是，如果可能，我想保留原始请求的URL路径。

The problem is that the transition is not firing. The route is not activating and the template is not being rendered. I think this has something to do with the fact that the route exists due to the nature of the dynamic URL. However, I want to maintain the URL path but display the 404 template, which is not working properly. If I change the path of the 404 route to a static string like /404 the transition works. However, I'd like to keep the URL path of the original request if possible.

这样，如果有人请求实际的路由不存在（即 / foo / bar / baz ），它将看起来与路由有效的页面相同，但记录不存在。任何人都可以指向正确的方向？

That way, if someone requests a route that actually doesn't exist (i.e. /foo/bar/baz), it will look identical to a page where the route is valid but the record does not exist. Can anyone point me in the right direction?

提前感谢

推荐答案

我相信你的问题是，当你试图过渡到一个全部，Ember.js不知道是什么。这很容易解决，因为 transitionTo（）需要一个第二个参数来指定模型，在你的情况下，这将是URL。

I believe your issue is that when you are trying to transition into a "catch all", Ember.js has no idea what that is. This is easy to fix as transitionTo() takes a 2nd parameter for specifying the model, which in your case would be the URL.

因此，对于不存在的产品，您的路由将如下所示：

So, for a non-existent product, your route would look something like this:

App.BadRoute = Ember.Route.extend({
  model: function(){
    return "abcdproduct";
  },
  afterModel: function(badProduct){
    this.transitionTo('notFound', badProduct);
  }
});

查看基本工作示例 here

这篇关于Ember渲染404与无效的URL lug。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！