Skip to content

Commit 07494ad

Browse files
FrancescoMolinaroAndrea Barbasso
FrancescoMolinaro
authored and
Andrea Barbasso
committed
Merged in task/dspace-cris-2023_02_x/DSC-1775 (pull request DSpace#2349)
[DSC-1775] port fixes for open graph metadata Approved-by: Andrea Barbasso
2 parents ccbe6ae + 1d17da5 commit 07494ad

2 files changed

Lines changed: 56 additions & 62 deletions

File tree

‎src/app/core/metadata/metadata.service.ts‎

Lines changed: 44 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,8 @@ import {
1111
concat as observableConcat,
1212
EMPTY,
1313
Observable,
14-
of as observableOf
14+
of as observableOf,
15+
of
1516
} from 'rxjs';
1617
import { filter, map, mergeMap, switchMap, take } from 'rxjs/operators';
1718

@@ -42,7 +43,7 @@ import { getDownloadableBitstream } from '../shared/bitstream.operators';
4243
import { APP_CONFIG, AppConfig } from '../../../config/app-config.interface';
4344
import { SchemaJsonLDService } from './schema-json-ld/schema-json-ld.service';
4445
import { ITEM } from '../shared/item.resource-type';
45-
import { DOCUMENT, isPlatformServer } from '@angular/common';
46+
import { DOCUMENT, isPlatformBrowser, isPlatformServer } from '@angular/common';
4647
import { Root } from '../data/root.model';
4748
import { environment } from '../../../environments/environment';
4849

@@ -85,6 +86,7 @@ export class MetadataService {
8586

8687
private fallbackImagePath = environment.metaTags.defaultLogo;
8788
private defaultPageDescription = environment.metaTags.defaultDescription;
89+
private origin: string;
8890

8991
constructor(
9092
private router: Router,
@@ -122,6 +124,12 @@ export class MetadataService {
122124
}
123125

124126
private processRouteChange(routeInfo: any): void {
127+
this.rootService.findRoot().pipe(
128+
getFirstCompletedRemoteData(),
129+
filter(data => !!data),
130+
map((rootRD: RemoteData<Root>) => rootRD?.payload?.dspaceUI)
131+
).subscribe(uiOrigin => this.origin = uiOrigin);
132+
125133
this.clearMetaTags();
126134

127135
if (hasValue(routeInfo.data.value.dso) && hasValue(routeInfo.data.value.dso.payload)) {
@@ -174,20 +182,16 @@ export class MetadataService {
174182
private setDSOMetaTags(): void {
175183
const openGraphType = this.getOpenGraphType();
176184

177-
this.setTitleTag();
178-
this.setDescriptionTag();
185+
this.setTitleTags();
186+
this.setDescriptionTags();
179187

180-
this.setOpenGraphTitleTag();
181-
this.setOpenGraphDescriptionTag();
182188
this.setOpenGraphImageTag();
183189
this.setOpenGraphUrlTag();
184190

185191
if (openGraphType) {
186192
this.setOpenGraphTypeTag(openGraphType);
187193
}
188194

189-
this.setTwitterTitleTag();
190-
this.setTwitterDescriptionTag();
191195
this.setTwitterImageTag();
192196
this.setTwitterSummaryCardTag();
193197

@@ -227,21 +231,31 @@ export class MetadataService {
227231
}
228232

229233
/**
230-
* Add <meta name="title" ... > to the <head>
234+
* Add <meta name="title" ... > and
235+
* <meta name="og:title" ... > and
236+
* <meta name="twitter:title" ... > to the <head>
231237
*/
232-
private setTitleTag(title?: string): void {
238+
private setTitleTags(title?: string): void {
233239
const value = title ?? this.dsoNameService.getName(this.currentObject.getValue());
240+
234241
this.addMetaTag('title', value);
242+
this.addMetaTag('og:title', value, true);
243+
this.addMetaTag('twitter:title', value, true);
244+
235245
this.title.setTitle(value);
236246
}
237247

238248
/**
239-
* Add <meta name="description" ... > to the <head>
249+
* Add <meta name="description" ... > and
250+
* <meta name="og:description" ... > and
251+
* <meta name="twitter:description" ... > to the <head>
240252
*/
241-
private setDescriptionTag(description?: string): void {
253+
private setDescriptionTags(description?: string): void {
242254
// TODO: truncate abstract
243255
const value = description ?? this.getMetaTagValue('dc.description.abstract');
244256
this.addMetaTag('description', value);
257+
this.addMetaTag('og:description', value, true);
258+
this.addMetaTag('twitter:description', value, true);
245259
}
246260

247261
/**
@@ -428,24 +442,7 @@ export class MetadataService {
428442
* Add <meta name="og:type" ... > to the <head>
429443
*/
430444
private setOpenGraphTypeTag(type: string): void {
431-
this.addMetaTag('og:type', type);
432-
}
433-
434-
/**
435-
* Add <meta name="og:title" ... > to the <head>
436-
*/
437-
private setOpenGraphTitleTag(title?: string): void {
438-
const value = title ?? this.getMetaTagValue('dc.title');
439-
this.addMetaTag('og:title', value);
440-
}
441-
442-
/**
443-
* Add <meta name="og:description" ... > to the <head>
444-
*/
445-
private setOpenGraphDescriptionTag(description?: string): void {
446-
// TODO: truncate abstract
447-
const value = description ?? this.getMetaTagValue('dc.description.abstract') ?? this.translate.instant('meta.tag.missing.description');
448-
this.addMetaTag('og:description', value);
445+
this.addMetaTag('og:type', type ?? 'website', true);
449446
}
450447

451448
/**
@@ -464,23 +461,6 @@ export class MetadataService {
464461
}
465462

466463

467-
/**
468-
* Add <meta name="twitter:title" ... > to the <head>
469-
*/
470-
private setTwitterTitleTag(title?: string): void {
471-
const value = title ?? this.getMetaTagValue('dc.title');
472-
this.addMetaTag('twitter:title', value);
473-
}
474-
475-
/**
476-
* Add <meta name="twitter:description" ... > to the <head>
477-
*/
478-
private setTwitterDescriptionTag(description?: string): void {
479-
// TODO: truncate abstract
480-
const value = description ?? this.getMetaTagValue('dc.description.abstract') ?? this.translate.instant('meta.tag.missing.description');
481-
this.addMetaTag('twitter:description', value);
482-
}
483-
484464
/**
485465
* Add <meta name="twitter:image" ... > to the <head>
486466
*/
@@ -502,7 +482,7 @@ export class MetadataService {
502482
* @private
503483
*/
504484
private getBitstreamFromThumbnail(item: Item): Observable<Bitstream> {
505-
return item.thumbnail.pipe(
485+
return hasValue(item.thumbnail) ? item.thumbnail.pipe(
506486
getFirstCompletedRemoteData(),
507487
map((thumbnailRD) => {
508488
if (thumbnailRD.hasSucceeded && isNotEmpty(thumbnailRD.payload)) {
@@ -512,7 +492,7 @@ export class MetadataService {
512492
}
513493
}),
514494
getDownloadableBitstream(this.authorizationService)
515-
);
495+
) : of(null);
516496
}
517497

518498
private setPrimaryBitstreamInBundleTag(tag: string): void {
@@ -532,7 +512,8 @@ export class MetadataService {
532512
// Use the found link to set the <meta> tag
533513
this.addMetaTag(
534514
tag,
535-
new URLCombiner(this.hardRedirectService.getCurrentOrigin(), link).toString()
515+
new URLCombiner(this.getUrlOrigin(), link).toString(),
516+
true
536517
);
537518
} else {
538519
this.addFallbackImageToTag(tag);
@@ -673,10 +654,11 @@ export class MetadataService {
673654
return this.currentObject.value.allMetadataValues(keys);
674655
}
675656

676-
private addMetaTag(name: string, content: string): void {
657+
private addMetaTag(name: string, content: string, isProperty = false): void {
677658
if (content) {
678-
const tag = { name, content } as MetaDefinition;
679-
this.meta.addTag(tag);
659+
const tag = isProperty ? {property: name, content} as MetaDefinition
660+
: { name, content } as MetaDefinition;
661+
this.meta.updateTag(tag);
680662
this.storeTag(name);
681663
}
682664
}
@@ -698,7 +680,7 @@ export class MetadataService {
698680
take(1)
699681
).subscribe((tagsInUse: string[]) => {
700682
for (const name of tagsInUse) {
701-
this.meta.removeTag('name=\'' + name + '\'');
683+
this.meta.updateTag({name, content: ''});
702684
}
703685
this.store.dispatch(new ClearMetaTagAction());
704686
});
@@ -707,7 +689,8 @@ export class MetadataService {
707689
private addFallbackImageToTag(tag: string) {
708690
this.addMetaTag(
709691
tag,
710-
new URLCombiner(this.hardRedirectService.getCurrentOrigin(), this.fallbackImagePath).toString()
692+
new URLCombiner(this.getUrlOrigin(), this.fallbackImagePath).toString(),
693+
true
711694
);
712695
}
713696

@@ -747,19 +730,19 @@ export class MetadataService {
747730
const pageUrl = new URLCombiner(this.hardRedirectService.getCurrentOrigin(), this.router.url).toString();
748731
const genericPageOpenGraphType = 'website';
749732

750-
this.setTitleTag(pageDocumentTitle);
751-
this.setDescriptionTag(this.defaultPageDescription);
733+
this.setTitleTags(pageDocumentTitle);
734+
this.setDescriptionTags(this.defaultPageDescription);
752735

753-
this.setOpenGraphTitleTag(pageDocumentTitle);
754-
this.setOpenGraphDescriptionTag(this.defaultPageDescription);
755736
this.setOpenGraphUrlTag(pageUrl);
756737
this.setOpenGraphImageTag();
757738
this.setOpenGraphTypeTag(genericPageOpenGraphType);
758739

759740

760-
this.setTwitterTitleTag(pageDocumentTitle);
761-
this.setTwitterDescriptionTag(this.defaultPageDescription);
762741
this.setTwitterImageTag();
763742
this.setTwitterSummaryCardTag();
764743
}
744+
745+
private getUrlOrigin(): string {
746+
return isPlatformBrowser(this.platformId) ? this.hardRedirectService.getCurrentOrigin() : this.origin;
747+
}
765748
}

‎src/index.html‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,23 @@
11
<!DOCTYPE html>
2-
<html>
2+
<html prefix="og: https://ogp.me/ns#">
33

44
<head>
55
<meta charset="UTF-8">
66
<base href="/">
77
<title>DSpace-CRIS</title>
88
<meta name="viewport" content="width=device-width,minimum-scale=1">
99
<meta http-equiv="cache-control" content="no-store">
10+
<meta name="title" content="">
11+
<meta name="description" content="">
12+
<meta property="og:title" content="">
13+
<meta property="og:description" content="">
14+
<meta property="og:image" content="">
15+
<meta property="og:url" content="">
16+
<meta property="og:type" content="">
17+
<meta property="twitter:title" content="">
18+
<meta property="twitter:description" content="">
19+
<meta property="twitter:image" content="">
20+
<meta property="twitter:card" content="">
1021
</head>
1122

1223
<body>

0 commit comments

Comments
 (0)