Merge pull request #5074 from mempool/mononaut/meta-slurper
Preserve site-specific meta title/descriptions/canonical urls
This commit is contained in:
commit
97817e770f
@ -5,6 +5,7 @@ import { StateService } from '../../services/state.service';
|
|||||||
import { OpenGraphService } from '../../services/opengraph.service';
|
import { OpenGraphService } from '../../services/opengraph.service';
|
||||||
import { NgbTooltipConfig } from '@ng-bootstrap/ng-bootstrap';
|
import { NgbTooltipConfig } from '@ng-bootstrap/ng-bootstrap';
|
||||||
import { ThemeService } from '../../services/theme.service';
|
import { ThemeService } from '../../services/theme.service';
|
||||||
|
import { SeoService } from '../../services/seo.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-root',
|
selector: 'app-root',
|
||||||
@ -13,12 +14,11 @@ import { ThemeService } from '../../services/theme.service';
|
|||||||
providers: [NgbTooltipConfig]
|
providers: [NgbTooltipConfig]
|
||||||
})
|
})
|
||||||
export class AppComponent implements OnInit {
|
export class AppComponent implements OnInit {
|
||||||
link: HTMLElement = document.getElementById('canonical');
|
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
public router: Router,
|
public router: Router,
|
||||||
private stateService: StateService,
|
private stateService: StateService,
|
||||||
private openGraphService: OpenGraphService,
|
private openGraphService: OpenGraphService,
|
||||||
|
private seoService: SeoService,
|
||||||
private themeService: ThemeService,
|
private themeService: ThemeService,
|
||||||
private location: Location,
|
private location: Location,
|
||||||
tooltipConfig: NgbTooltipConfig,
|
tooltipConfig: NgbTooltipConfig,
|
||||||
@ -54,11 +54,7 @@ export class AppComponent implements OnInit {
|
|||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.router.events.subscribe((val) => {
|
this.router.events.subscribe((val) => {
|
||||||
if (val instanceof NavigationEnd) {
|
if (val instanceof NavigationEnd) {
|
||||||
let domain = 'mempool.space';
|
this.seoService.updateCanonical(this.location.path());
|
||||||
if (this.stateService.env.BASE_MODULE === 'liquid') {
|
|
||||||
domain = 'liquid.network';
|
|
||||||
}
|
|
||||||
this.link.setAttribute('href', 'https://' + domain + this.location.path());
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -11,8 +11,9 @@ export class SeoService {
|
|||||||
network = '';
|
network = '';
|
||||||
baseTitle = 'mempool';
|
baseTitle = 'mempool';
|
||||||
baseDescription = 'Explore the full Bitcoin ecosystem® with The Mempool Open Source Project®.';
|
baseDescription = 'Explore the full Bitcoin ecosystem® with The Mempool Open Source Project®.';
|
||||||
|
baseDomain = 'mempool.space';
|
||||||
|
|
||||||
canonicalLink: HTMLElement = document.getElementById('canonical');
|
canonicalLink: HTMLLinkElement = document.getElementById('canonical') as HTMLLinkElement;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private titleService: Title,
|
private titleService: Title,
|
||||||
@ -21,6 +22,16 @@ export class SeoService {
|
|||||||
private router: Router,
|
private router: Router,
|
||||||
private activatedRoute: ActivatedRoute,
|
private activatedRoute: ActivatedRoute,
|
||||||
) {
|
) {
|
||||||
|
// save original meta tags
|
||||||
|
this.baseDescription = metaService.getTag('name=\'description\'')?.content || this.baseDescription;
|
||||||
|
this.baseTitle = titleService.getTitle()?.split(' - ')?.[0] || this.baseTitle;
|
||||||
|
try {
|
||||||
|
const canonicalUrl = new URL(this.canonicalLink?.href || '');
|
||||||
|
this.baseDomain = canonicalUrl?.host;
|
||||||
|
} catch (e) {
|
||||||
|
// leave as default
|
||||||
|
}
|
||||||
|
|
||||||
this.stateService.networkChanged$.subscribe((network) => this.network = network);
|
this.stateService.networkChanged$.subscribe((network) => this.network = network);
|
||||||
this.router.events.pipe(
|
this.router.events.pipe(
|
||||||
filter(event => event instanceof NavigationEnd),
|
filter(event => event instanceof NavigationEnd),
|
||||||
@ -72,11 +83,7 @@ export class SeoService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
updateCanonical(path) {
|
updateCanonical(path) {
|
||||||
let domain = 'mempool.space';
|
this.canonicalLink.setAttribute('href', 'https://' + this.baseDomain + path);
|
||||||
if (this.stateService.env.BASE_MODULE === 'liquid') {
|
|
||||||
domain = 'liquid.network';
|
|
||||||
}
|
|
||||||
this.canonicalLink.setAttribute('href', 'https://' + domain + path);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
getTitle(): string {
|
getTitle(): string {
|
||||||
@ -94,10 +101,7 @@ export class SeoService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getDescription(): string {
|
getDescription(): string {
|
||||||
if ( (this.network === 'testnet') || (this.network === 'testnet4') || (this.network === 'signet') || (this.network === '') || (this.network == 'mainnet') )
|
return this.baseDescription;
|
||||||
return this.baseDescription + ' See the real-time status of your transactions, browse network stats, and more.';
|
|
||||||
if ( (this.network === 'liquid') || (this.network === 'liquidtestnet') )
|
|
||||||
return this.baseDescription + ' See Liquid transactions & assets, get network info, and more.';
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ucfirst(str: string) {
|
ucfirst(str: string) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user