SSRS 2008 R2 - SSRS 2012 - ReportViewer: Reporta en Safari / Chrome pero funciona bien en Firefox / Internet Explorer 8… ¿por qué?

83

Tengo algunos informes sencillos SSRS 2008 R2, pero no se muestran en Safari ni en Chrome. Según los Libros en línea de Microsoft, estos navegadores son compatibles de forma limitada. Sin embargo, no puedo ver nada después de que se completa el reloj de "Cargando" de datos. La barra de parámetros y la sección de navegación de pan rallado en la parte superior de la página están todas allí. Además, puedo guardar / exportar a cualquier formato en Safari y Chrome. Simplemente no mostrará la sección del informe en sí, que está en blanco.

¿Se supone que debo usar certificados y conexiones seguras (actualmente no está configurado con HTTPS, solo HTTP)? ¿Hay alguna configuración del lado del servidor que deba modificarse? ¿Alguien ha tenido éxito al mostrar CUALQUIER informe en Safari / Chrome usando versiones anteriores de SSRS (2005)?

Estoy usando Safari 5.0.4y Chrome 10.0.648.151. Sé que la similitud de estos dos navegadores es que ambos se basan en WebKit .

El informe se muestra correctamente en Internet Explorer 8 (por supuesto) y Firefox 4.0.

Realmente agradecería que alguien pudiera arrojar algo de luz sobre esto.

Greg H
fuente
duplicado: stackoverflow.com/questions/5968082/…
Tim Partridge
2
Greg H mira mi solución y avísame si resuelve el problema
Emanuele Greco

Respuestas:

94

Solución definitiva (¡también funciona en SSRS 2012!)

Agregue el siguiente script a " C: \ Archivos de programa \ Microsoft SQL Server \ MSRS10_50.MSSQLSERVER \ Reporting Services \ ReportManager \ js \ ReportingServices.js " (en el servidor SSRS):

function pageLoad() {
    var element = document.getElementById("ctl31_ctl10");
    if (element)
    {
        element.style.overflow = "visible";
    }
}

En realidad, no sé si el nombre del div es siempre ctl31_ctl10: en mi caso lo es (en lugar de SQL Server 2012 se encontró azzlak ctl32_ctl09).

Si esta solución no funciona, mire el HTML de su navegador para ver si el script ha funcionado correctamente cambiando la propiedad overflow: auto a overflow: visible .


Solución para el control ReportViewer

Inserte esta línea de estilo en la .aspxpágina (o en un .cssarchivo vinculado , si está disponible):

#reportViewer_ctl09 {
  overflow:visible !important;
}

Razón

Desbordamiento de renderizado de Chrome y Safari : automático de forma diferente con respecto a Internet Explorer.

SSRS HTML es QuirksMode HTML y depende de los errores de IE 5.5. Los navegadores que no son de IE no tienen el modo peculiar de IE y, por lo tanto, procesan el HTML correctamente

La página HTML producida por los informes de SSRS 2008 R2 contiene un div que tiene overflow: auto style, y convierte el informe en un informe invisible.

<div id="ctl31_ctl10" style="height:100%;width:100%;overflow:auto;position:relative;">
...</div>

Cambio manual (usando la ventana de depuración de Chrome) desbordamiento de HTML final : automático en desbordamiento: visible puedo ver informes en Chrome

Amo la solución de Tim ; es fácil y funcional.

Pero todavía hay un problema: cada vez que el usuario cambia los parámetros (¡mis informes usan parámetros!) AJAX actualiza el div, la etiqueta overflow: auto se reescribe y ningún script lo cambia. Este detalle de nota técnica explica cuál es el problema.

Esto sucede porque en una página construida con paneles AJAX, solo los paneles AJAX cambian su estado, sin actualizar toda la página. En consecuencia, los eventos OnLoad que aplicó en la etiqueta solo se activan una vez: la primera vez que se carga su página. Después de eso, cambiar cualquiera de los paneles AJAX ya no activará estos eventos.

El señor einarq me sugirió la solución aquí .

Otra opción es cambiar el nombre de su función a pageLoad.

ASP.NET Ajax llamará automáticamente a cualquier función con este nombre si existe en la página, también después de cada actualización parcial. Si hace esto, también puede eliminar el atributo onload de la etiqueta del cuerpo

Así que escribí el script mejorado que se muestra en la solución.

Emanuele Greco
fuente
Bueno, maldita sea, puedo confirmar que esto también funciona para mí (SQL 2008 R2).
Vincent Vancalbergh
3
También funciona en SSRS 2012. En mi caso, el div tiene id "ctl31_ctl09". ¡Gracias!
Chris
La solución proporcionada por Emanuele funcionó para mí, pero estaba teniendo problemas para ver el informe usando el control ReportViewer en mi página aspx. Así que agregué un código en la página aspx. Lo he mencionado aquí
Samir K
No puedo hacer que se active el evento "pageLoad", aunque lo corté y pegué en la parte inferior del archivo JS indicado en mi servidor de informes SSRS. ¿Alguna sugerencia sobre por qué eso podría no estar funcionando?
Ben Finkel
@BenFinkel "pageLoad () es llamado después de cada actualización de UpdatePanel" ( encosia.com/document-ready-and-pageload-are-not-the-same ) así que tal vez el problema sea diferente .. intente depurar la ventana del navegador para ver si el texto modificado por usted está vinculado y si hay errores de Javascript.
Emanuele Greco
43

Solución basada en CSS

Pude agregar lo siguiente a la hoja de estilo para Reporting Services y lo solucionó en Chrome.

Descargo de responsabilidad: esto no se ha probado a fondo para la compatibilidad entre navegadores.

/ ************** CROMO CORRECCIÓN DE ERRORES ***************** /
div # ctl31_ctl09,
div # ctl31_ctl10
{
    desbordamiento: visible! importante;
}
/ ******************************************* /

Agregue eso al principio del ReportingServices.cssarchivo.

Para mí, ese archivo se encuentra en:

C:\Program Files\Microsoft SQL Server\MSRS10_50.MSSQLSERVER\Reporting Services\ReportManager\Styles\ReportingServices.css

Ryan
fuente
3
+1 funciona a la perfección en todos los navegadores (Chrome, Safari, IE9, IE10) probados. En MAC OS X Chrome lo mismo ...
YvesR
Si no tiene acceso al servidor para modificar el CSS para todos los usuarios, puede usar el CSS en esta respuesta con una extensión de navegador como Stylebot .
Mike Bockus
+1 ¡Buena solución! Esto es más barato (en cuanto al rendimiento) que arreglarlo con Javascript y no necesita actualizarse cada vez que se actualiza el panel AJAX.
KyleMit
1
¡Guauu! este era mi problema, recién comencé a estudiar la implementación del informe SSRS R2 y se muestra en IE pero no en Chrome. ¿Hay alguna explicación por qué es eso? de todos modos, gracias Ryan!
Francis Saul
1
Los míos fueron etiquetados como ctl32_ctl109 en SSRS 2012. Después de buscar eso y usar su CSS con mi valor, funcionó perfectamente.
Matt H
18

Este es un problema conocido . El problema es que una etiqueta div tiene el estilo "overflow: auto" que aparentemente no está bien implementado con WebKit que es utilizado por Safari y Chrome (ver la respuesta de Emanuele Greco ). No supe cómo aprovechar la sugerencia de Emanuele de usar el elemento RS: ReportViewerHost, pero lo resolví usando JavaScript.

Problema

ingrese la descripción de la imagen aquí

Solución

Dado que "overflow: auto" se especifica en el atributo de estilo del elemento div con id "ctl31_ctl10", no podemos anularlo en un archivo de hoja de estilo, así que recurrí a JavaScript. Agregué el siguiente código a "C: \ Archivos de programa \ Microsoft SQL Server \ MSRS10_50.MSSQLSERVER \ Reporting Services \ ReportManager \ js \ ReportingServices.js"

function FixSafari()
{    
    var element = document.getElementById("ctl31_ctl10");
    if (element) 
    {
        element.style.overflow = "visible";  //default overflow value
    }
}

// Code from /programming/9434/how-do-i-add-an-additional-window-onload-event-in-javascript
if (window.addEventListener) // W3C standard
{
    window.addEventListener('load', FixSafari, false); // NB **not** 'onload'
} 
else if (window.attachEvent) // Microsoft
{
    window.attachEvent('onload', FixSafari);
}

Nota

Parece haber una solución para SSRS 2005 que no he probado, pero no creo que sea aplicable a SSRS 2008 porque no puedo encontrar la clase "DocMapAndReportFrame".

Tim Partridge
fuente
7

Solución para todo el sistema basada en CSS

Esto no requiere ningún marco JavaScript o Ajax ni ningún otro contenedor. Fue probado en Internet Explorer, Firefox, Safari y Chrome.

Esto se puede solucionar en el nivel de la hoja de estilo en el servidor de informes.

Primero, navegue hasta el directorio donde están instalados los servicios de informes, en mi caso ( SQL Server 2012 SP1) es:

C:\Program Files\Microsoft SQL Server\MSRS11.MSSQLSERVER\Reporting Services\ReportServer

En ese directorio, encontrará un archivo llamado reportserver.config.

Consulte Personalizar hojas de estilo para el visor HTML y el Administrador de informes .

En ese archivo, inserte una sola línea XML como (del documento anterior):

<Configuration>
...
          <HTMLViewerStyleSheet>SafariChromeFix</HTMLViewerStyleSheet>
...
</Configuration>

Salva eso.

Lo que ellos no dicen en el enlace anterior es que esta entrada anula completamente la hoja de estilo predeterminada. Mis primeros intentos de hacer que los informes se rendericen funcionaron agregando una hoja de estilo div, todo lo demás estaba roto. Una vez que descubrí que esta edición en el archivo reporserver.config no aumentó, pero en realidad reemplaza la hoja de estilo predeterminada, la copié en la hoja de estilo predeterminada y todo comenzó a funcionar.

A continuación, descienda al directorio de estilos (C:\Program Files\Microsoft SQL Server\MSRS11.MSSQLSERVER\Reporting Services\ReportServer\Styles ).

Haga una copia del archivo llamado SP_Full.css y nombre la copia SafariChromeFix.css. En este punto, SafariChromeFix.css debería ser idéntico a SP_Full.css.

Edite SafariChromeFix.css y agregue las siguientes líneas en la parte superior:

div {
    overflow: visible !important;
}

Guárdalo.

Una vez que se guarda, todos los informes existentes en esta instancia de Reporting Services se mostrarán en todos los navegadores, incluidos Chrome y Safari.

Tenga en cuenta:

No solo es posible, sino muy probable que reportserver.config se sobrescriba con actualizaciones de los servicios de informes, por lo que es posible que tenga que agregar la <HTMLViewerStyleSheet>SafariChrome</HTMLViewerStyleSheet>etiqueta con el tiempo.

Esto también nos da un lugar para entrar en la hoja de estilo predeterminada y realizar muchos otros cambios personalizados a partir de algo que ya está funcionando. Y como no es la hoja de estilo predeterminada, su nuevo archivo CSS personalizado no se sobrescribe durante las actualizaciones y los parches.

Gawain
fuente
"Una vez que se guarda, todos los informes existentes en esta instancia de Reporting Services se mostrarán en todos los navegadores, incluidos Chrome y Safari". - Sí, pero aún se verán horribles.
Stefan Steiger
4

En mi caso, el DIV infractor es "ctl31_ctl09", por lo que si la solución anterior no funciona, intente cambiar var element = document.getElementById("ctl31_ctl10");avar element = document.getElementById("ctl31_ctl09");

Jabran Ali
fuente
4

Mi solución fue agregar lo siguiente <script>a:

Reporting Services \ ReportManager \ Pages \ Report.aspx

La secuencia de comandos se dirige al principal 1 del contenido del informe visible y establece cada vez que se carga el informe 2, incluida la paginación a través de un informe de varias páginas.style.overflow:visible

if (window.addEventListener && document.querySelector) window.addEventListener("load", function () {

    // drop out if Sys.Application.add_load is undefined
    if (!window.Sys || !Sys.Application || !Sys.Application.add_load) return;

    // register a function for when report data is loaded
    Sys.Application.add_load(function () {

        // get the report content control
        var n = document.querySelector("[id^=VisibleReportContent]");

        if (n) {

            // get the report content control's parent
            n = n.parentNode;

            if (n) {

                // revert overflow:hidden to "visible"
                n.style.overflow = "visible";

            }
        }

    });
});

1 Esto significa que no tenemos que apuntar ids generados que tienen una tendencia a cambiar, es decir: ctl31_ctl09, ctl31_ctl10, ctl32_ctl09, etc.
2 VerSys.Application.add_load()

canon
fuente
1
Esto funcionó perfectamente para mí en SSRS 2008 R2. Fue un salvavidas para uno de nuestros usuarios de Mac (que no tiene una manera fácil de usar IE)
Lawson
2

La versión de SQL Server 2014 de Reporting Services agrega compatibilidad con el navegador Google Chrome, pero todavía no hay compatibilidad con iOS. Vea los detalles aquí .

Frank Goortani
fuente
2

Para mí, el nombre era " ctl32_ctl09 " (SSRS de SQL Server 2012 SP1, MSRS11).

Alexus1024
fuente
Puede confirmar eso también para SQL Server 2012 SP1
azzlack
2

Tuve que ingresar a Chrome F12y noté que tenía ctl32 _ctl09, no ctl31_ctl09 en mi div.

Esto es para Windows Server 2008 R2 64Bit con SQL Server 2012 . Agregue el script y luego reinicie SSRS y borre la caché del navegador.

// Corrección para permitir que Chrome muestre informes SSRS

    function pageLoad() {
    var element = document.getElementById("**ctl32**_ctl09");
    if (element)
    {
        element.style.overflow = "visible";
    }
}
usuario2585349
fuente
2

Desafortunadamente, la respuesta principal rompe las columnas flotantes (posición absoluta) en los informes de Internet Explorer. Por lo tanto, lo modifiqué ligeramente, lo que no me encanta ya que está buscando específicamente WebKit, pero está funcionando:

//SSRS 2012 Chrome fix
function pageLoad() {
    var element = document.getElementById("ctl32_ctl09");
    var isWebKit = !!window.webkitURL;    // Chrome or safari really (WebKit browsers).
    // We don't want to do this fix in Internet Explorer, because it breaks floating columns
    if (element && isWebKit)
    {
        element.style.overflow = "visible";
    }
}

arcángel76
fuente
1

Para evitar tener que codificar el ID del elemento, edité el archivo ReportingServices.js en el servidor RS @ [Drive]: \ Program Files \ Microsoft SQL Server \ [Reporting Services Instance] \ Reporting Services \ ReportManager \ js \ ReportingServices.js para incluir algún código para obtener jQuery, cargarlo en la página y luego encontrar todos los elementos donde el desbordamiento está configurado en automático.

Inserte el siguiente código en la parte superior del archivo ReportingServices.js

var loadjQuery = function (cb) {
    if (typeof (jQuery) == 'undefined') {
        var scr = document.createElement('script');
        scr.setAttribute('type', 'text/javascript');
        scr.setAttribute('src', 'http://code.jquery.com/jquery-latest.js');

        if (scr.readyState) {
            scr.onreadystatechange = function () {
                if (scr.readyState === 'complete' || scr.readyState === 'loaded') {
                    scr.onreadystatechange = null;
                    if (typeof (cb) === 'function') {
                        args = [].slice.call(arguments, 1);
                        cb.apply(this, args);
                    }
                }
            };
        }
        else {
            scr.onload = function () {
                if (typeof (cb) === 'function') {
                    args = [].slice.call(arguments, 1);
                    cb.apply(this, args);
                }
            };
        }

        var head = document.getElementsByTagName('head')[0];
        head.insertBefore(scr, head.firstChild);
    }
}

Luego, la siguiente línea después de eso es lo que estaba originalmente en el archivo JS.

Después de eso, agregue el siguiente código

var _rmFixReady = false;
function pageLoad() {
    loadjQuery(function () {
        _rmFixReady = true;
    });
    if (_rmFixReady) {
        var overflowElements = $('div').filter(function () { return $(this).css('overflow') == 'auto'; });
        overflowElements.each(function () {
            $(this).css('overflow', 'visible');
        });
    }
}

Acabo de terminar de probar esto con Chrome 27 e IE 10 en una instancia RM2012 y funcionó muy bien.

Mike Pugh
fuente
1

El problema aún existe en Chrome 22.0.1229.79.

YMMV , pero he descubierto que eliminar la altura de la etiqueta ReportViewer soluciona este problema.

Tenía este problema con los informes SSAS, pero no con los SSRS. No pude entender por qué hasta que verifiqué las diferencias en las páginas (un consultor había hecho los informes SSAS). Estaba estableciendo ReportViewer Height = 60% y los informes SSRS no especificaban la altura.

Una vez que eliminé la Altura, se mostraron mis informes.

fujiiface
fuente
1

Para SSRS 2012 en Windows Server 2008 R2 x64, un script de trabajo es:

function pageLoad()
{
    var element = document.getElementById("ctl31_ctl09");
    if (element)
    {
        element.style.overflow = "visible";
    }

    if (window.addEventListener) // W3C standard
    {
         window.addEventListener('load', FixSafari, false); // NB **not** 'onload'
    }
    else
        if (window.attachEvent) // Microsoft
        {
            window.attachEvent('onload', FixSafari);
        }
}

function FixSafari()
{
    var element = document.getElementById("ctl31_ctl09");
    if (element)
    {
        element.style.overflow = "visible";  // Default overflow value
    }
}

Todas las versiones sugeridas anteriormente no funcionaban en absoluto.

usuario2160060
fuente
1

Un problema con la overflow:visiblesolución es que los encabezados flotantes se rompen en todos los navegadores. La siguiente secuencia de comandos dejará a Internet Explorer solo y aplicará la corrección solo a los navegadores que no sean Internet Explorer. Con esto, toda la funcionalidad se conserva para los usuarios de Internet Explorer y otros navegadores aún pueden ver los informes.

function pageLoad() {
    var eval = getInternetExplorerVersion();
    if (eval == -1)
    {
        var element = document.getElementById("ctl31_ctl09");
        if (element)
        {
            element.style.overflow = "visible";
        }
    }
}

function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
    var rv = -1; // Return value assumes failure.
    if (navigator.appName == 'Microsoft Internet Explorer')
    {
        var ua = navigator.userAgent;
        var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
        if (re.exec(ua) != null)
            rv = parseFloat( RegExp.$1 );
    }
    return rv;
}
ant_iw3r
fuente
1

Probé los enfoques y funcionó para mí, pero nuestros administradores de sistemas se mostraron escépticos acerca de estos cambios.

En lugar de establecer la altura al 100% en el ReportViewer, utilicé una altura fija y logró funcionar en mi aplicación para Internet Explorer y Chrome.

AsitK
fuente
1

Nunca he tenido suerte con la visualización de informes en Chrome. La mayor parte de la documentación de Microsoft ni siquiera la incluye, así que supongo que Chrome debe tener problemas para interpretar algo en la ASP.

Consulte Compatibilidad con navegadores para Reporting Services y Power View .

Estoy ejecutando Chrome 11 y experimento el mismo comportamiento que tú.

Ryan
fuente