SSRS 2008 R2-SSRS 2012-ReportViewer:Safari / Chromeでレポートしますが、Firefox / Internet Explorer 8では正常に動作します…なぜですか?


83

にいくつかの簡単なレポートSSRS 2008 R2がありますが、SafariまたはChromeではまったく表示されません。MicrosoftのBooksOnlineによると、これらのブラウザは限られた方法でサポートされています。しかし、データの「読み込み中」のクロックが完了した後、何も表示されません。ページ上部のパラメータバーとパンくずナビゲーションセクションはすべてそこにあります。また、SafariとChromeで任意の形式で保存/エクスポートできます。レポートセクション自体は表示されず、空白になります。

証明書と保護された接続を使用することになっていますか(現在、HTTPSではセットアップされておらず、HTTPのみ)?微調整が必​​要なサーバー側の構成はありますか?誰もが表示され成功を収めているいかなる以前のSSRSのバージョン(2005)を使用して、サファリ/クロームに関するレポートを?

私はとを使用Safari 5.0.4していChrome 10.0.648.151ます。これら2つのブラウザーの類似点は、どちらもWebKitに基づいていることです。

レポートは、Internet Explorer 8(もちろん)およびFirefox4.0で正常にレンダリングされます。

誰かがこれに光を当てることができれば本当にありがたいです。



2
グレッグHは私の解決策を見て、それが問題を解決するかどうか私に知らせてください
エマヌエーレグレコ

回答:


94

究極のソリューション(SSRS 2012でも機能します!)

次のスクリプトを「C:\ ProgramFiles \ Microsoft SQL Server \ MSRS10_50.MSSQLSERVER \ Reporting Services \ ReportManager \ js \ ReportingServices.js」(SSRSサーバー上)に追加します

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

実際、divの名前が常にであるかどうかはわかりませんctl31_ctl10:私の場合はそうです(代わりにSQL Server 2012 azzlakが見つかりましたctl32_ctl09)。

このソリューションが機能しない場合は、ブラウザからHTMLを調べて、スクリプトが正しく機能しているかどうかを確認し、overflow:autoプロパティをoverflow:visibleに変更します


ReportViewerコントロールのソリューション

このスタイルラインを.aspxページ(または.css、可能な場合はリンクされたファイル)に挿入します。

#reportViewer_ctl09 {
  overflow:visible !important;
}

理由

ChromeとSafariは、Internet Explorerとは異なる方法でoverflow:autoをレンダリングします。

SSRSHTMLはQuirksModeHTMLであり、IE5.5のバグに依存しています。非IEブラウザにはIEquirksmodeがないため、HTMLを正しくレンダリングします

SSRS 2008 R2レポートによって生成されたHTMLページには、overflow:autoスタイルのdivが含まれており、レポートが非表示のレポートに変わります。

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

最終的なHTML(Chromeのデバッグウィンドウを使用して)手動で変更オーバーフロー:自動オーバーフロー:目に見えます私はクロームに関するレポートを見ることができます。

ティムのソリューションが大好きですです; それは簡単で機能します。

しかし、まだ問題があります。ユーザーがパラメーターを変更するたびに(私のレポートではパラメーターを使用します!)、AJAXがdivを更新すると、overflow:autoタグが書き換えられ、スクリプトによって変更されることはありません。 この技術ノートの詳細は、何が問題なのかを説明しています。

これは、AJAXパネルで構築されたページでは、ページ全体を更新せずに、AJAXパネルのみが状態を変更するために発生します。したがって、タグに適用したOnLoadイベントは、ページが最初に読み込まれたときに1回だけ発生します。その後、AJAXパネルを変更しても、これらのイベントはトリガーされなくなります。

einarq氏は私にここで解決策を提案しました。

もう1つのオプションは、関数の名前をpageLoadに変更することです。

この名前の関数は、部分的に更新されるたびに、ページに存在する場合はASP.NETAjaxによって自動的に呼び出されます。これを行うと、bodyタグからonload属性を削除することもできます

そこで、ソリューションに示されている改善されたスクリプトを作成しました。


やばい、これが私にも機能していることを確認できます(SQL 2008R2)。
Vincent Vancalbergh 2012

3
SSRS 2012でも動作します。私の場合、divのIDは「ctl31_ctl09」です。ありがとうございました!
クリス

Emanueleによって提供されたソリューションは私の場合は機能しましたが、aspxページのReportViewerコントロールを使用してレポートを表示する際に問題が発生しました。そこで、aspxページにコードを追加しました。私はここで
Samir K

SSRSレポートサーバーに表示されているJSファイルの最後にカットアンドペーストしましたが、「pageLoad」イベントを発生させることができません。なぜそれがうまくいかないのかについての提案はありますか?
ベンフィンケル2012年

@BenFinkel「pageLoad()はUpdatePanelを更新するたびに呼び出されます」(encosia.com/document-ready-and-pageload-are-not-the-same)ので、問題が異なる可能性があります。ブラウザのデバッグウィンドウを試して、あなたが変更したテキストはリンクされており、Javascriptエラーがある場合。
エマヌエーレグレコ

43

CSSベースのソリューション

Reporting Servicesのスタイルシートに以下を追加することができ、Chromeで修正されました。

免責事項:これは、ブラウザ間の互換性について徹底的にテストされていません。

/ ************** CHROME BUG FIX ***************** /
div#ctl31_ctl09、
div#ctl31_ctl10
{{
    オーバーフロー:目に見える!重要;
}
/ ********************************************* /

それをReportingServices.cssファイルの先頭に追加します。

私の場合、そのファイルは次の場所にあります。

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


3
+1は、テストされたすべてのブラウザー(Chrome、Safari、IE9、IE10)でチャームのように機能します。MAC OS Xクローム同じ...オン
YvesR

すべてのユーザーのcssを変更するためのサーバーへのアクセス権がない場合は、Stylebotなどのブラウザー拡張機能を使用してこの回答のCSSを使用できます。
Mike Bockus 2014

+1素敵なソリューション!これは、Javascriptで修正するよりも安価で(パフォーマンス面で)、AJAXパネルが更新されるたびに更新する必要はありません。
KyleMit 2014年

1
うわー!これが私の問題でした。SSRSR2レポートの展開を調査し始めたところですが、IEで表示されますが、Chromeでは表示されません。なぜそれなのか説明はありますか?とにかく、ライアンに感謝します!
フランシスソール

1
私のSSRS2012ではctl32_ctl109というラベルが付けられていました。それを調べて、私の値でCSSを使用した後、完全に機能しました。
マットH

18

これは 既知の問題です。問題は、divタグのスタイルが「overflow:auto」であるということです。これは、SafariとChromeで使用されるWebKitではうまく実装されていないようです(Emanuele Grecoの回答を参照)。RS:ReportViewerHost要素を使用するというEmanueleの提案を利用する方法がわかりませんでしたが、JavaScriptを使用して解決しました。

問題

ここに画像の説明を入力してください

解決

「overflow:auto」はid「ctl31_ctl10」のdiv要素のstyle属性で指定されているため、スタイルシートファイルでオーバーライドできないため、JavaScriptを使用しました。「C:\ ProgramFiles \ 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);
}

注意

あるように見えるSSRS 2005のためのソリューション、私は試していないが、私は、私は「DocMapAndReportFrame」クラスを見つけることができないので、それはSSRS 2008には適用されないと思うこと。


7

CSSベースのシステム全体のソリューション

これには、JavaScriptやAjaxフレーム、その他のラッパーは必要ありません。Internet Explorer、Firefox、Safari、Chromeでテストされました。

これは、レポートサーバーのスタイルシートレベルで修正できます。

まず、レポートサービスがインストールされているディレクトリに移動します。私の場合(SQL Server 2012 SP1)は次のとおりです。

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

そのディレクトリには、reportserver.configという名前のファイルがあります。

HTMLビューアおよびレポートマネージャのスタイルシートのカスタマイズを参照してください。

そのファイルに、(上記のドキュメントから)次のような単一のXML行を挿入します。

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

それを保存します。

上記のリンクで彼らあなたに教えていないのは、このエントリがデフォルトのスタイルシートを完全に上書きするということです。divスタイルシートを追加してレポートをレンダリングしようとした最初の試みは、他のすべてが壊れていました。reporserver.configファイルへのこの編集は拡張されないが、実際にはデフォルトのスタイルシートを置き換えることがわかったら、デフォルトのスタイルシートにコピーすると、すべてが機能し始めました。

次に、Stylesディレクトリ(C:\Program Files\Microsoft SQL Server\MSRS11.MSSQLSERVER\Reporting Services\ReportServer\Styles)に移動します。

SP_Full.cssという名前のファイルのコピーを作成し、そのコピーにSafariChromeFix.cssという名前を付けます。この時点で、SafariChromeFix.cssはSP_Full.cssと同じである必要があります。

SafariChromeFix.cssを編集し、次の行を上部に追加します。

div {
    overflow: visible !important;
}

それを保存。

これが保存されると、Reporting Servicesのこのインスタンスに関する既存のすべてのレポートが、ChromeやSafariを含むすべてのブラウザーで表示されます。

ご注意ください:

可能であるだけでなく、reportserver.configがレポートサービスの更新で上書きされる可能性が非常に高いため<HTMLViewerStyleSheet>SafariChrome</HTMLViewerStyleSheet>、時間の経過とともにタグを追加する必要がある場合があります。

これはまた、デフォルトのスタイルシートに侵入し、すでに機能しているものから始めて他の多くのカスタム変更を行う場所を提供します。また、これはデフォルトのスタイルシートではないため、アップグレードやパッチの実行中に新しいカスタムCSSファイルが上書きされることはありません。


「これが保存されると、Reporting Servicesのこのインスタンスに関する既存のすべてのレポートが、ChromeやSafariを含むすべてのブラウザで表示されます。」-はい、しかし彼らはまだ恐ろしいように見えます。
Stefan Steiger 2015

4

私の場合、問題のDIVは「ctl31_ctl09」なので、上記の解決策が機能しない場合は、次のように変更var element = document.getElementById("ctl31_ctl10");してみてください。var element = document.getElementById("ctl31_ctl09");


4

私の解決策は、以下<script>を追加することでした。

Reporting Services \ ReportManager \ Pages \ Report.aspx

スクリプトは、表示されているレポートコンテンツの1を対象とし、レポートが読み込まれるたびに2を設定します。これには、複数ページのレポートのページングも含まれます。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:この手段は、私たちはすなわち、変化に傾向が生成されたIDをターゲットにする必要はありませんctl31_ctl09ctl31_ctl10ctl32_ctl09、など
2を参照してくださいSys.Application.add_load()


1
これは、SSRS 2008R2で完全に機能しました。それは私たちのMacユーザーのために命の恩人だった(IEを使用する簡単な方法はありません。)
ローソン



2

私はChromeに入るF12必要があり、ctl32があることに気づきました _ctl09、ない私のdivでctl31_ctl09を。

これは、SQL Server2012を搭載したWindowsServer 2008 R264ビット用です。スクリプトを追加してからSSRSを再起動し、ブラウザのキャッシュをクリアします。

// ChromeがSSRSレポートを表示できるように修正

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

2

残念ながら、主な答えはInternet Explorerレポートのフローティング(絶対位置)列を壊します。したがって、私はそれを少し変更しました。これは特にWebKitを探しているので好きではありませんが、機能しています。

//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";
    }
}


1

要素IDをハードコーディングする必要がないように、RSサーバー@ [Drive]:\ Program Files \ Microsoft SQL Server \ [Reporting Services Instance] \ Reporting Services \ ReportManager \ js \ ReportingServices.jsでReportingServices.jsファイルを編集しました。jQueryをフェッチするコードを含め、それをページにロードしてから、オーバーフローが自動に設定されているすべての要素を検索します。

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);
    }
}

その後の次の行は、元々JSファイルにあったものです。

その後、次のコードを追加します

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');
        });
    }
}

RM2012インスタンスでChrome27とIE10を使用してこれをテストし終えたところですが、うまく機能しました。


1

問題はChrome22.0.1229.79にまだ存在します。

YMMVですが、ReportViewerタグから高さを削除するとこの問題が修正されることがわかりました。

SSASレポートでこの問題が発生していましたが、SSRSレポートでは発生していませんでした。ページの違いを確認するまで、その理由を理解できませんでした(コンサルタントがSSASレポートを作成しました)。彼はReportViewerの高さ= 60%を設定しており、SSRSレポートは高さを指定していませんでした。

Heightを削除すると、レポートが表示されます。


1

上のSSRS 2012 、Windows Server 2008のR2 x64の、作業スクリプトは次のとおりです。

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
    }
}

上記の提案されたバージョンはすべてまったく機能していませんでした。


1

このoverflow:visible修正の問題の1つは、フローティングヘッダーがすべてのブラウザーで壊れていることです。次のスクリプトは、Internet Explorerをそのままにして、InternetExplorer以外のブラウザーにのみ修正を適用します。これにより、Internet Explorerユーザーのすべての機能が保持され、他のブラウザーは引き続きレポートを表示できます。

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;
}

1

私はアプローチを試しましたが、うまくいきましたが、システム管理者はこれらの変更に懐疑的でした。

で高さを100%に設定する代わりにReportViewer、固定の高さを使用しました。これは、InternetExplorerとChromeのアプリケーションで機能しました。


1

Chromeでレポートを表示することに運がなかったことがあります。Microsoftのドキュメントのほとんどはそれをリストしていないので、ChromeはASPで何かを解釈するのに問題があるに違いないと思います。

ReportingServicesおよびPowerViewのブラウザサポートを参照してください。

Chrome 11を実行していますが、同じ動作が発生します。


弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.