CefSharp不接受包含很多空格的html

时间:2019-12-20 04:50:39

标签: c# cefsharp chromium-embedded

当我通过脚本标记中带有很多空格的HTML传递Html时,CefSharp会破坏嵌入式chrome的实例(请参阅 var __series_data __ ),但是如果我将其压缩,则所有功能都可以使用。 顺便说一句,如果我用空格传递较小的数据,它仍然可以工作。

断例(示意图):

<!doctype html>

<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!--<link rel="stylesheet" type="text/css" href="/css/result-light.css">-->

    <style type="text/css">
        html,
            body {
                height: 100%;
                margin: 0;
                padding: 0;
            }
    </style>
    <title>Stocks</title>
    <script>
        var __series_data__ = [
          {
            "name": "AA",
            "data": [
              [
                86400000,
                7.140915
              ],
              [
                345600000,
                7.05681
              ],
            ]
          },
          {
            "name": "AAPL",
            "data": [
              [
                345427200000,
                0.513393
              ],
              [
                345686400000,
                0.486607
              ],
            ]
          }
       ];
       </script>
              
        </head>
        
        <body>
        <noscript>JavaScript is disabled. Please, enable JavaScript to see charts.</noscript>
                
                <div id="container" style="height: 100%;"></div>
                
                <div class="error-block"></div>
                
                <script type='text/javascript'>//<![CDATA[
                    
                    var seriesOptions = __series_data__;
                    
                    /**
                     * Create the chart when all data is loaded
                     * @returns {undefined}
                     */
                    function createChart() {
                    
                        Highcharts.stockChart('container', {
                                
                                          rangeSelector: {
                                              selected: 1       // 3 months
                                          },
                                              
                                          navigator: {
                                              enabled: false
                                          },
                                              
                                          scrollbar: {
                                              enabled: false
                                          },
                                          
                                          credits: {
                                              enabled: false
                                          },
        
                                          yAxis: {
                                              labels: {
                                                formatter: function() {
                                                    return (this.value > 0 ? ' + ' : '') + this.value + '%';
                                                }
                                              },
                                              plotLines: [{
                                                          value: 0,
                                                          width: 2,
                                                          color: 'silver'
                                                          }]
                                          },
                                          
                                          plotOptions: {
                                              series: {
                                                compare: 'percent',
                                              }
                                          },
                                          
                                          tooltip: {
                                              pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
                                              valueDecimals: 2,
                                              split: true
                                          },
                                          
                                          series: seriesOptions
                                    });
        
                        Highcharts.setOptions({
                            global: {
                                useUTC: true
                            }
                        });
        
                    }
        
                    createChart();
    </script>

    <script>
        // tell the embed parent frame the height of the content
            if (window.parent && window.parent.parent) {
                window.parent.parent.postMessage(["resultsFrame", {
                    height: document.body.getBoundingClientRect().height,
                    slug: "None"
                }], "*");
            }
    </script>

    </body>

    <script>
        Other scripts.....
    </script>

</html>

工作示例(示意图):

<!doctype html>

    <html>

    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <!--<link rel="stylesheet" type="text/css" href="/css/result-light.css">-->

        <style type="text/css">
            html,
                body {
                    height: 100%;
                    margin: 0;
                    padding: 0;
                }
        </style>
        <title>Stocks</title>
        <script>
            var__series_data__=[{"name":"AA","data":[[86400000,7.140915],[345600000,7.05681],]},{"name":"AAPL","data":[[345427200000,0.513393],[345686400000,0.486607],]}];
           </script>
                  
            </head>
            
            <body>
            <noscript>JavaScript is disabled. Please, enable JavaScript to see charts.</noscript>
                    
                    <div id="container" style="height: 100%;"></div>
                    
                    <div class="error-block"></div>
                    
                    <script type='text/javascript'>//<![CDATA[
                        
                        var seriesOptions = __series_data__;
                        
                        /**
                         * Create the chart when all data is loaded
                         * @returns {undefined}
                         */
                        function createChart() {
                        
                            Highcharts.stockChart('container', {
                                    
                                              rangeSelector: {
                                                  selected: 1       // 3 months
                                              },
                                                  
                                              navigator: {
                                                  enabled: false
                                              },
                                                  
                                              scrollbar: {
                                                  enabled: false
                                              },
                                              
                                              credits: {
                                                  enabled: false
                                              },
            
                                              yAxis: {
                                                  labels: {
                                                    formatter: function() {
                                                        return (this.value > 0 ? ' + ' : '') + this.value + '%';
                                                    }
                                                  },
                                                  plotLines: [{
                                                              value: 0,
                                                              width: 2,
                                                              color: 'silver'
                                                              }]
                                              },
                                              
                                              plotOptions: {
                                                  series: {
                                                    compare: 'percent',
                                                  }
                                              },
                                              
                                              tooltip: {
                                                  pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
                                                  valueDecimals: 2,
                                                  split: true
                                              },
                                              
                                              series: seriesOptions
                                        });
            
                            Highcharts.setOptions({
                                global: {
                                    useUTC: true
                                }
                            });
            
                        }
            
                        createChart();
        </script>

        <script>
            // tell the embed parent frame the height of the content
                if (window.parent && window.parent.parent) {
                    window.parent.parent.postMessage(["resultsFrame", {
                        height: document.body.getBoundingClientRect().height,
                        slug: "None"
                    }], "*");
                }
        </script>

        </body>

        <script>
            Other scripts.....
        </script>

    </html>

0 个答案:

没有答案