When I Am running The Application It Shows Error - Error loading the report viewer's templates

[Chaitanya]

When I Am trying to load the report viewer then it shows the below error .. i am unable to understand 'api/reports/' and 'telerikReportViewerTemplate-html'  where they are located  in my application.

Error loading the report viewer's templates. (Template = http://localhost/MyApplication/api/reports/resources/templates/telerikReportViewerTemplate-html).

[Stef]

Hello chaitanya,

Please check the details for the error in HTML5 Viewer Troubleshooting.

Regards,
Stef
Telerik by Progress

[ubaid]

Hello Stef

I followed all steps mentioned in HTML5  but still getting the same error

even http://localhost:2923/api/reports/formats is working fine for me.

I have created a new test project and it works there.

I have compared the files and codes. Both are but still getting this error

 

Can you please guide?

 

 

 

 

 

[Silviya]

Hello ubaid,

If the REST Service is working as expected, we assume that the report viewer client cannot access the service due to CORS limitations. When such issue is present you will see a CORS related error message in the browser's developer tools console (F12). When hosting the service in a separate application you will need to enable CORS as explained in this external resource.

In case the issue still persist, open new support ticket and send us the problematic project for local investigation.

Regards,
Silviya
Progress Telerik

[ubaid]

Hi Silviya 

I am getting this following error.

GET http://localhost:2923/api/reports/resources/templates/telerikreportviewertemplate-html 404 (Not Found)

It simply says it is not finding what I am trying to access.

Whereas

http://localhost:2923/api/reports/formats is working fine for me.

 

 

[ubaid]

Hi Silviya,

 

I am able to resolve this. 

I was missing with styles, templates and fonts folder under ReportViewer

I added these files to my project. Customized the paths and everything worked for me.

 

Thanks for the support

 

[ubaid]

Hi Silviya,

I resolved the issues.

Templates, styles and fonts were missing from my project

[Laz]

Hi

I have an angular app which works fine using the telerik internet demo. when I use a rest service of one the samples I get

Error loading the report viewer's templates. (trvTemplateUrl = 'http://localhost:9000/api/reports/resources/templates/telerikReportViewerTemplate-html').

I have enabled cors.

The browser tells me it is a cors issue which is mis-leading as the network tab shows clearly 

"Access-Control-Allow-Origin: *"

Please help and also I need to know which rest services of the samples are appropriate for angular app as it is not included in the samples and left me guessing. Thanks very much

 

 

 

 

[ubaid]

Please make sure you have relevant templates under folder

..\ReportViewer\templates\telerikReportViewerTemplate.html

 

Hope that helps

[Laz]

Hi

Can someone help me  which telerik rest service I need to use with angular report viewer, it has not been included with the samples. thanks in advance

Laz

[Ronald]

I'm posting this so someone searching for a solution can find it.

I had the same issue and adding this

Telerik.Reporting.Services.WebApi.ReportsControllerConfiguration.RegisterRoutes(config);

To the webapiconfig.cs in the app_start folder solved it.

[Silviya]

Hello Ronald,

Thanks for sharing this.

Regards,
Silviya
Progress Telerik

[Erik]

I have the same problem, and have followed all instructions wrt setting up CORS.

Can you pls elaborate on what is needed w.r.t. templates, fonts, etc?

I'm not sure where these files should be located and where to add them from...

Thx

[Mirzodaler]

Hi, How can we register routes configuration if we are using Telerik.Reporting.Services.AspNetCore?

[Karthic]

Please check the below links and it has some information
https://docs.telerik.com/reporting/html5-viewer-troubleshooting

https://github.com/telerik/reporting-docs/blob/master/knowledge-base/angular-error-loading-report-viewers-templates.md

[Godfrey]

How did you customize the path? you also said the font and style, where are these? 

The below is the error i get.

Error loading the report viewer's templates. (trvTemplateUrl = 'http://localhost:portnumber/api/reports/resources/templates/telerikReportViewerTemplate-14.0.20.325.html/').

i can access access http://localhost:portnumber/api/reports/formats.

[Don]

Same issue as everyone else.  I'm using the AspNetCore 2.1 and can access the formats URL fine, but I get a cors error for Error loading the report viewer's templates. (trvTemplateUrl = 'http://localhost:5000/api/reports/resources/templates/telerikReportViewerTemplate-14.1.20.618.html/').

 

If I access the URL manually it brings up a blank page and if I view source it has what I assume is the report viewer source.  However you are managing the templates in the Telerik code it's not appending the cors headers like it should.  Very frustrating.

[Neli]

Hello Don and Godfrey,

You may test the suggestions in the following resources:

- Error loading the report viewer's template forum post;

- Error Loading the Report Viewers Templates KB article.

If the issue is not resolved, consider sending us the SAZ file created by FIddler.

Progress Telerik
Neli
Regards,

[Balaji]

Hi,

The Report displays/works in Chrome & IE 11 if i run the application from VS 2017. The Report DOESNT display/work in Chrome (Version 84.0.4147.135 (Official Build) (64-bit)) when i run the application from VS Code. 

[Balaji]

Hi Neil,

The report works now but only if the url:port is as http://localhost:63456/Html5ReportViewer3.html. 

The report doesnt work if the port is changed to say 8082 (http://localhost:8082/)

Can you please advice on this?

 

[Neli]

Hello Balaji,

I noticed that in support ticket #1482162 you mentioned that the issue was resolved. Please, let us know if we can help you further.

Regards,
Neli
Progress Telerik

[Peter]

Hello Mirzodaler,

ASP.NET Core 2.1 and 2.2 do not needed to register the routes in the Startup, the ReportsController implementation Route attribute is sufficient. For more information see Manual Setup of HTML5 Report Viewer in an ASP.NET Core 2.1+ application: Setting up the REST service

About ASP.NET Core 3.0 the routing should be enabled with the IApplicationBuilder.UseRouting() as shown in the following code snippet:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.HttpsPolicy;
using Microsoft.AspNetCore.Server.Kestrel.Core;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;

namespace CSharp.AspNetCore3Demo
{
    public class Startup
    {
        private IServiceCollection services;

        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.
        public void ConfigureServices(IServiceCollection services)
        {
            this.services = services;

            services.Configure<IISServerOptions>(options =>
            {
                options.AllowSynchronousIO = true;
            });

            services.AddSingleton<ConfigurationService>();

            services.AddRazorPages()
                .AddNewtonsoftJson();
        }

            // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            this.services.AddTransient(ctx => new Controllers.ReportsController(new ConfigurationService(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.UseDefaultFiles();
            app.UseStaticFiles();

            app.UseRouting();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllers();
            });
        }
    }

    public class ConfigurationService
    {
        public IConfiguration Configuration { get; private set; }

        public IWebHostEnvironment Environment { get; private set; }
        public ConfigurationService(IWebHostEnvironment environment)
        {
            this.Environment = environment;

            var config = new ConfigurationBuilder()
                            .SetBasePath(environment.ContentRootPath)
                            .AddJsonFile("appsettings.json", true)
                            .Build();

            this.Configuration = config;
        }
    }
}

Additionally we provide working demos with the Progress Telerik Reporting installation.

Regards,
Peter
Progress Telerik