使用 Orchard CMS 进行单页设计

Question

我有一个客户想要为他的网站设计一个单页设计，其中每个“页面”的内容在用户浏览网站时使用 javascript 显示/隐藏。

我不确定使用 Orchard 解决此问题的最佳方法。一种选择是将内容全部放在单个页面内容项上，但随后您将失去使用 Orchard 导航功能的能力，并且无法让客户从页面的角度考虑管理。

是否有人对如何在 Orchard CMS 中进行最佳设置有想法或经验？

---

这是我根据 Bertrand 的建议使用的解决方案：

public ActionResult Display(int id)
{
     var contentItem = _contentManager.Get(id, VersionOptions.Published);
     dynamic model = _contentManager.BuildDisplay(contentItem);
     var ctx = _workContextAccessor.GetContext();
     ctx.Layout.Metadata.Alternates.Add("Layout_Null");
     return new ShapeResult(this, model);
}

我创建了一个新模块，其中包含一个包含上述操作方法的控制器。 action 方法采用内容部分 id 的参数。 _contentManager 和 _workContextAccessor 对象被注入到控制器中。 Layout.Null.cshtml 视图的创建与 Bertrand 建议的完全一样。

Answer 1

在不牺牲 SEO、客户端性能和可维护性的情况下，我将采取以下措施来实现那种非常完美的体验：仍然将网站“经典地”创建为一组页面、博客文章等，并使用它们自己的 URL。主页布局应该是不同的，并使用 Ajax 调用带来其他页面的内容。 我一直在使用一种方法来显示与常规内容项相同的内容，但来自 Ajax 调用（因此没有围绕内容的 chrome，没有引入样式表，因为它已经存在等）是拥有一个单独的控制器操作，以“空布局”返回内容：

var ctx = _workContextAccessor.GetContext();
ctx.Layout.Metadata.Alternates.Add("Layout_Null");
return new ShapeResult(this, shape);

然后，我的视图中有一个 Layout.Null.cshtml 文件，如下所示：

@{
    Model.Metadata.Wrappers.Clear();
}
@Display(Model.Content)

清除包装器会从 document.cshtml 中移除呈现，并且模板本身只呈现一个区域，即内容。所以渲染的只是内容，没有别的。非常适合从 ajax 调用注入。

这有帮助吗？

Answer 2

按照 Bertrand 的解决方案，将其实现为 FilterProvider/IResultFilter 是否更有意义？这样我们就不必处​​理内容检索逻辑。 Bertrand 提供的示例似乎不适用于 List 内容项。

我的模块中有类似的东西似乎可以工作：

public class LayoutFilter : FilterProvider, IResultFilter {
    private readonly IWorkContextAccessor _wca;

    public LayoutFilter(IWorkContextAccessor wca) {
        _wca = wca;
    }

    public void OnResultExecuting(ResultExecutingContext filterContext) {
        var workContext = _wca.GetContext();
        var routeValues = filterContext.RouteData.Values;

        if (filterContext.RequestContext.HttpContext.Request.IsAjaxRequest()) {
            workContext.Layout.Metadata.Alternates.Add("Layout_Null");

        }           
    }

    public void OnResultExecuted(ResultExecutedContext filterContext) {
    }        
}

Answer 3

通过添加代码重复使用 Rahul 的答案来回答 @tuanvt 的问题。老实说，我不确定您的问题是什么，但如果您似乎想要访问通过 ajax 请求发送的数据。如果是 JSON，您将在请求中发送 set contentType: "application/json" JSON.stringify() it ，然后通过从请求流中提取它在 Rahul 建议的 ActionFilter 中访问它。希望对您有所帮助。

public class LayoutFilter : FilterProvider, IResultFilter {
  private readonly IWorkContextAccessor _wca;

  public LayoutFilter(IWorkContextAccessor wca) {
        _wca = wca;
  }

  public void OnResultExecuting(ResultExecutingContext filterContext) {
      var workContext = _wca.GetContext();
      var routeValues = filterContext.RouteData.Values;

      if (filterContext.RequestContext.HttpContext.Request.IsAjaxRequest()) {
           workContext.Layout.Metadata.Alternates.Add("Layout_Null");

           if (filterContext.HttpContext.Request.ContentType.ToLower().Contains("application/json"))
           {
                var bytes = new byte[filterContext.HttpContext.Request.InputStream.Length];
               filterContext.HttpContext.Request.InputStream.Read(bytes, 0, bytes.Length);
               filterContext.HttpContext.Request.InputStream.Position = 0;
               var json = Encoding.UTF8.GetString(bytes);
               var jsonObject = JObject.Parse(json);
               // access jsonObject data from ajax request
           }
      }           
  }

  public void OnResultExecuted(ResultExecutedContext filterContext) {
  }        
}