jsakamoto / Toolbelt.Blazor.HeadElement

Head element support (change the document title, "meta" elements such as OGP, and "link" elements) for Blazor apps.
https://demo-blazor-headelement.azurewebsites.net/
Mozilla Public License 2.0
158 stars 11 forks source link

HeadElement working properly after updates on the week 03/12/2021 ? #16

Closed Tytrobot closed 3 years ago

Tytrobot commented 3 years ago

Hello, I'm not sure if I am doing something wrong, but on a SEO check, my page descriptions stopped working. This was working perfectly in my Blazor server side app. It uses the Blazor.HeadElement code to take care of the tittle and the meta tags. I also ran it on a newly created built in Microsoft code sample with the counter, and published it. It seems to work the same with or without adding the Blazor.HeadElement. This code was working on the production system, even after going to Net 5. Here are the details. Microsoft Visual Studio Professional 2019 Version 16.9.1 (fully patched and updated as of 03/12/2021) running on a fully updated and patched Win10 pc. All VS extensions are updated to the current versions, And the HeadElement is at v5.4.1. Compiled for .NET 5.0 framework. This can be tested using: freetools.seobility.net

Let me know if this works, or if I'm confused.
Thanks, Ty

jsakamoto commented 3 years ago

but on an SEO check, my page descriptions stopped working.

This library should work fine in the environment that you told me about in this issue.

Could you tell me about more details what was happened?

For example,

As you know, I'm sorry that there is nothing I can do if I could not get enough information about the problem. Thank you for your understanding. πŸ˜ƒ

Tytrobot commented 3 years ago

Hello, Here is my test program.

I thank you for taking a look at this issue. I suspect it is due to a Microsoft change, but please let me know how to fix this. As to the page description, it appear to be blank, no listing. No errors that I could see.

And, this was one tool I used to check it. freetools.seobility.net/en/seocheck

Thanks, Ty

From: jsakamoto @.> Sent: Friday, March 12, 2021 20:15 To: jsakamoto/Toolbelt.Blazor.HeadElement @.> Cc: Ty Tobey WTobey@CYCOGS.com; Author @.***> Subject: Re: [jsakamoto/Toolbelt.Blazor.HeadElement] HeadElement working properly after updates on the week 03/12/2021 ? (#16)

but on an SEO check, my page descriptions stopped working.

This library should work fine in the environment that you told me about in this issue.

Could you tell me about more details what was happened?

For example,

As you know, I'm sorry that there is nothing I can do if I could not get enough information about the problem. Thank you for your understanding. πŸ˜ƒ

β€” You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/jsakamoto/Toolbelt.Blazor.HeadElement/issues/16#issuecomment-797849289, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AOE7F6XBKC4OQ242FFDSPKTTDLDCBANCNFSM4ZC6BWKA.

jsakamoto commented 3 years ago

@Tytrobot Sorry to late,

As to the page description, it appear to be blank, no listing. No errors that I could see.

Hum... it looks like the server-side pre-rendering feature doesn't work correctly. Could you show me the source code of the Startup.cs of your web app?

Tytrobot commented 3 years ago

Hi, Is pre-rendering needed for the meta tags to work?

Here is my startup.cs with a couple propriety lines pulled. But, no server pre-rendering?


using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using BlazorStrap; using Blazor.Analytics;

using Microsoft.AspNetCore.Builder; using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Hosting; using Microsoft.AspNetCore.HttpsPolicy; using Microsoft.Extensions.Configuration; using Microsoft.Extensions.DependencyInjection; using Microsoft.Extensions.Hosting; using System.Net.Http;

using Toolbelt.Blazor.Extensions.DependencyInjection; // <- Blazor Head Element code

namespace C_Website { public class Startup { public Startup(IConfiguration configuration) { Configuration = configuration; }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddRazorPages();
        services.AddServerSideBlazor();

        services.AddGoogleAnalytics("UA-4-1");   // 10/05/2020

        services.AddBootstrapCss();    // 06/03/2020  Blazorstrap addition
        services.AddHeadElementHelper(); // <- Head Element code Toolbelt.Blazor.HeadElement github

        //services.AddServerSideBlazor().AddHubOptions(o => { o.MaximumReceiveMessageSize = 102400000;   });
        // new file transfer limit interop byte JavaScript  - if needed
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();

        app.UseRouting();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapBlazorHub();
            endpoints.MapFallbackToPage("/_Host");
        });
    }
}

}

Thanks, Ty

From: jsakamoto @.> Sent: Monday, March 15, 2021 18:07 To: jsakamoto/Toolbelt.Blazor.HeadElement @.> Cc: Ty Tobey WTobey@CYCOGS.com; Mention @.***> Subject: Re: [jsakamoto/Toolbelt.Blazor.HeadElement] HeadElement working properly after updates on the week 03/12/2021 ? (#16)

@Tytrobothttps://github.com/Tytrobot Sorry to late,

As to the page description, it appear to be blank, no listing. No errors that I could see.

Hum... it looks like the server-side pre-rendering feature doesn't work correctly. Could you show me the source code of the Startup.cs of your web app?

β€” You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/jsakamoto/Toolbelt.Blazor.HeadElement/issues/16#issuecomment-799813780, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AOE7F6SWNGDQVSFSPA6HIZLTD2HKFANCNFSM4ZC6BWKA.

jsakamoto commented 3 years ago

@Tytrobot

Is pre-rendering needed for the meta tags to work?

Yes, especially to make it to be recognized by internet crawlers.

If you don't use the "HeadElementService - Server Pre-rendering", the "description" meta tag that you inject by marking up the <Meta /> component (or by using the IHeadElementHelper service) has appeared after when the client-side part of the Blazor runtime's initial tasks are finished.

You can see that on a Web browser's developer tools.

By the way, generic internet crawlers don't process client-side script (there are some exceptions, but anyway).

This means internet crawlers just parse the text that was responded from the server-side of your Blazor Server app - that text is the result of the _Host.cshtml rendered.

As long as you don't enable the "HeadElementService - Server Pre-rendering", the text that the result of the _Host.cshtml rendered doesn't include the result of the <Meta /> component or the IHeadElementHelper service.

So, you have to enable the "HeadElementService - Server Pre-rendering" to make the "description" meta tag that is injected by marking up the <Meta /> component (or by using the IHeadElementHelper service) can be recognized by the internet crawlers.

jsakamoto commented 3 years ago

@Tytrobot

To enable the "HeadElementService - Server Pre-rendering", please see the following instructions.

Tytrobot commented 3 years ago

Hello, Thank you very much! You spotted my problem, and your suggestion fixed the problem in my test app, so I’m sure it will also in the production copy. I’m not sure what changed on the Microsoft end, but adding the pre-rendering fixed it. (And it was super easy!)

Thanks much for proving this awesome component and services, it’s a life saver, and you have solved my problem with great support! I certainly recommend using your code!

Thanks, Ty

From: jsakamoto @.> Sent: Tuesday, March 16, 2021 07:14 To: jsakamoto/Toolbelt.Blazor.HeadElement @.> Cc: Ty Tobey WTobey@CYCOGS.com; Mention @.***> Subject: Re: [jsakamoto/Toolbelt.Blazor.HeadElement] HeadElement working properly after updates on the week 03/12/2021 ? (#16)

@Tytrobothttps://github.com/Tytrobot

Is pre-rendering needed for the meta tags to work?

Yes, especially to make it to be recognized by internet crawlers.

If you don't use the "HeadElementService - Server Pre-rendering", the "description" meta tag that you inject by marking up the "" component (or by using the "IHeadElementService" service) has appeared after when the client-side part of the Blazor runtime's initial tasks are finished.

You can see that on a Web browser's developer tools.

By the way, generic internet crawlers don't process client-side script (there are some exceptions, but anyway).

This means internet crawlers just parse the text that was responded from the server-side of your Blazor Server app - that text is the result of the "_Host.cshtml" rendered.

As long as you don't enable the "HeadElementService - Server Pre-rendering", the text that the result of the "_Host.cshtml" rendered doesn't include the result of the "" component or the "IHeadElementService" service.

So, you have to enable the "HeadElementService - Server Pre-rendering" to make the "description" meta tag that is injected by marking up the "" component (or by using the "IHeadElementService" service) can be recognized by the internet crawlers.

β€” You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/jsakamoto/Toolbelt.Blazor.HeadElement/issues/16#issuecomment-800208329, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AOE7F6V43VPQCB44PDYISKTTD5DQPANCNFSM4ZC6BWKA.

jsakamoto commented 3 years ago

I'm glad to resolve this issue. πŸ˜ƒ

Happy coding!