在服務器上使用servicestack angular 2模板呈現seo元標記

Servicestack angular 2模板只有一個入口點 - inxed.html。比方說，我們希望在服務器上呈現seo元標記，以便像/ product/id之類的路線進行SEO優化。任何想法如何使它？在服務器上使用servicestack angular 2模板呈現seo元標記

來源

2017-07-02 Roman

爲優化搜索引擎優化，使用角萬能 –

角普遍有一大堆問題，現在和頁面響應時間較慢。 – Roman

ServiceStack的Single Page App templates顧名思義只能從單個服務器運行index.html頁面。這意味着所有的路由都是在Angular JS的客戶端（即瀏覽器）上執行的。

這意味着當客戶導航到網站上的不同頁面時，例如，到/products/1該請求由Angular客戶端路由處理以加載配置的組件，即請求永遠不會到達服務器。

但是，當初始請求發送到/products/1時，該請求被髮送到服務器，但爲了使Angular能夠處理客戶端上的路由，ServiceStack返回主頁，它爲任何使用在模板的MyServices class配置FallbackRoute，不匹配的請求如

[Exclude(Feature.Metadata)] 
[FallbackRoute("/{PathInfo*}")] 
public class FallbackForClientRoutes 
{ 
    public string PathInfo { get; set; } 
} 

public class MyServices : Service 
{ 
    //Return index.html for unmatched requests so routing is handled on client 
    public object Any(FallbackForClientRoutes request) => 
     new HttpResult(VirtualFileSources.GetFile("index.html")); 
}

爲了能夠返回修改index.html頁面，您可以只創建一個要處理的請求匹配的路由，例如：

[Exclude(Feature.Metadata)] //Hide Route from metadata pages 
[Route("/product/{Id}")] 
public class ViewProduct 
{ 
    public int Id { get; set; } 
}

，並在頁面中返回一個修改後index.html頁面替換佔位你想要的元數據，例如：

[AddHeader(ContentType = MimeTypes.Html)] 
public object Any(ViewProduct request) 
{ 
    var indexFile = VirtualFileSources.GetFile("index.html"); 
    var html = indexFile.ReadAllText(); 
    return html.Replace("meta name=\"description\"", 
     $"meta name=\"description\" content=\"Product #{request.Id}\""); 
}

告訴的WebPack包括您的自定義佔位符時，它產生的index.html需要修改在index.template.ejs模板，如：

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="UTF-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="description"> 
...

來源

2017-07-02 15:13:02 mythz

在服務器上使用servicestack angular 2模板呈現seo元標記

回答

相關問題