Server-side Metadata for SEO #554

Activity

1. MarkPieszak commented on Jan 3, 2017

   

   MarkPieszak

   on Jan 3, 2017

   Last edited by MarkPieszak

   Contributor

   More actions

   Unfortunately, at the moment you'll need to just create your own interface to handle this like you can see below (angular/universal#309 (comment))

   Eventually I believe the regular Title service will work for both once universal is moved into ng Core itself.

   This method below currently isn't working, we're looking into adding some Lifecycle hooks to potential add in the upcoming 2.4 release of Universal (a bug fix release before the eventual move to Angular Core)

   import { Injectable, Inject, ElementRef, Renderer } from '@angular/core'
   import { DOCUMENT } from '@angular/platform-browser'

   For now you can something like this:

   @Injectable()
   ~~export class TitleService { ~~
   constructor (@Inject(DOCUMENT) private document) {}

   setTitle (title: string) {
   this.document.title = title
   }

   getTitle () {
   return this.document.title;
   }
   }
2. SteveSandersonMS commented on Jan 3, 2017

   

   SteveSandersonMS

   on Jan 3, 2017

   Member

   More actions

   Thanks @MarkPieszak!

   👍React with 👍1Reacted by Mark Pieszak
3. SteveSandersonMS

   closed this as completedon Jan 3, 2017
4. levarcooper commented on Jan 3, 2017

   

   levarcooper

   on Jan 3, 2017

   Author

   More actions

   Thanks for the reply, Mark. This seems to be similar to the Title service in angular 2 (client-side). Perhaps there's a problem with my implementation? Here's an example of what I'm doing app.component.ts after importing the service to app.module.ts and adding it to the providers array:
   `export class AppComponent implements OnInit {
   meta;
   constructor(private _router: Router, private _activatedRoute: ActivatedRoute, private _metaService: MetaService) { }

   ngOnInit() {
       //this._metaService.setTitle('Title Test');  /* doesn't work */
       if (isBrowser) {
           this._metaService.setTitle('Title Test');  /* works */
       }
   }
   

   }`
   The code above gets the job done... sort of. It works, but non-javascript browsers and more importantly, search crawlers don't see the change to the title page.
5. MarkPieszak commented on Jan 4, 2017

   

   MarkPieszak

   on Jan 4, 2017

   Contributor

   More actions

   Hmm this might be an issue with the .NET integration (since we're not getting the whole document, but rather just <app></app>, let me take a look tomorrow and see if I can get back to you with more info! @levarcooper
6. levarcooper commented on Jan 4, 2017

   

   levarcooper

   on Jan 4, 2017

   Author

   More actions

   Thanks @MarkPieszak
7. MarkPieszak commented on Jan 5, 2017

   

   MarkPieszak

   on Jan 5, 2017

   Last edited by MarkPieszak

   Contributor

   More actions

   @levarcooper So this is currently broken, and I'm hoping we can get in a Universal 2.4 version in sometime before the attempted merge into Angular Core. Maybe we'll be able to get a lifecycle hook or something in there temporarily in that release.
   I'll keep you posted!
8. MarkPieszak commented on Jan 6, 2017

   

   MarkPieszak

   on Jan 6, 2017

   Last edited by MarkPieszak

   Contributor

   More actions

   @SteveSandersonMS Should we keep this one open for now?
   (The way above won't work anymore)
   It's not possible to be achieved at the moment without some workarounds most devs wouldn't be aware of.

   We're looking into adding some Lifecycle hooks to be potentially added in the upcoming 2.4 release of Universal (a bug fix release before the eventual move to Angular Core)
9. levarcooper commented on Jan 12, 2017

   

   levarcooper

   on Jan 12, 2017

   Author

   More actions

   @MarkPieszak, do you have more info about the workarounds you eluded to above. I was considering trying to pass javascript variables into the viewdata. Are there any known approaches that allow angular to communicate with dotnet at runtime?
10. MarkPieszak commented on Jan 12, 2017

    

    MarkPieszak

    on Jan 12, 2017

    Contributor

    More actions

    Are you talking about passing it from .NET over to the front-end? @levarcooper

    https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#3-supplying-javascript-code-to-perform-prerendering