web-dev-qa-db-ja.com

サイトマップジェネレーターで完全にクロールする方法Angular SPAのルーター?

ウェブページのサイトマップを生成しようとしています。

オンラインのサイトマップジェネレーターでは、xmlファイルのホームページのみが表示されます。

<?xml version="1.0" encoding="UTF-8"?>
-<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-<url>
<loc>http://margvel.com</loc>
<priority>0.5</priority>
</url>
</urlset>

一方、私のWebページにはいくつかのルートがあります。

webページを表示するには、margvel.comにアクセスできます

いくつかのサイトマップジェネレーターを使用しました。

xml-sitemap および botmap

SPAをサポートする必要があるため、ボットマップをチェックしました。

サイトマップを作成するリンクは、マテリアルデザインとルーターリンクを使用します。

コードは次のようになります。

          <mat-list-item (click)="snav.close()" routerLink="/Projects"><mat-icon style="margin-left: 7px;">code</mat-icon><a style="margin-left: 25px;" >Projects</a></mat-list-item>
          <mat-list-item (click)="snav.close()" routerLink="/Jobs"><mat-icon style="margin-left: 7px;">work</mat-icon><a style="margin-left: 25px;" ></a>Work Experience</mat-list-item>
          <mat-list-item (click)="snav.close()" routerLink="/Education"><mat-icon style="margin-left: 7px;">school</mat-icon><a style="margin-left: 25px;"></a>Education</mat-list-item>
          <mat-list-item (click)="snav.close()" routerLink="/Resume"><mat-icon style="margin-left: 7px;">description</mat-icon><a style="margin-left: 25px;" ></a>Resume</mat-list-item>
          <mat-list-item (click)="openSnackBar()" routerLink="/Contact"><mat-icon style="margin-left: 7px;">contact_mail</mat-icon><a style="margin-left: 25px;" ></a>Contact</mat-list-item>
8
Vato

Botmap.io開発者のKarlが質問に答えると、クローラーはhrefリンクのみをサポートします。

こんにちは!リンク/アンカータグにはhref属性がありますか?ボットは現在、href属性のみを検出してクロールします。あなたのangularアプリが内部で使用しない場合でも追加できます。それは冗長かもしれませんが、このシナリオを処理するためにボットを更新できるまで一時的なものとして機能するかもしれません。

私はルーターリンクを使用しており、hrefを使用してコードを変更したくないので、手動でサイトマップを作成することにしました。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url><loc>http://margvel.com</loc><priority>0.5</priority></url>
<url><loc>http://margvel.com/projects</loc><priority>0.5</priority></url>
<url><loc>http://margvel.com/jobs</loc><priority>0.5</priority></url>
<url><loc>http://margvel.com/education</loc><priority>0.5</priority></url>
<url><loc>http://margvel.com/resume</loc><priority>0.5</priority></url>
<url><loc>http://margvel.com/contact</loc><priority>0.5</priority></url>
</urlset>

私がしたことはangularのルートを通り、上記のようにxmlファイルに入れただけです。

0〜1.0の間で選択された手動の優先順位なので、すべてのリンクに優先順位0.5を指定しました。ページの設定がありませんでした。

注-このアプローチは、ページ数が少ない小規模なサイトマップ専用です。

2
Vato