1. #1
    Sencha User
    Join Date
    Nov 2011
    Location
    Bengaluru
    Posts
    12
    Vote Rating
    0
    soubhagya ranjan is on a distinguished road

      0  

    Default cross domain problem

    cross domain problem


    I m new to the sencha touch. I am trying to parse the xml file from from a cross domain server, i. e. my application is running on my localhost with this url(http://172.19.72.11:8050/SenchaTouchTest/MyGraph.html)
    i am trying to parse a xml file from the server of different ip(http://172.19.72.30:8080/cip-cits/se...tOutageMetrics) but i m getting the following error in the chrome console.

    XMLHttpRequest cannot load http://172.19.72.30:8080/cip-cits/se...61361&limit=25. Origin http://172.19.72.11:8050 is not allowed by Access-Control-Allow-Origin.
    • [COLOR=red !important]sencha-touch.js:6Uncaught TypeError: Cannot read property 'length' of undefined[/COLOR]
    [COLOR=red !important]


    Code:
    Ext.setup({
        onReady: function() {
        
        var drawComponent = new Ext.draw.Component();
        var store = new Ext.data.JsonStore({
              fields: ['label','value1','value1name','value2','value2name' ],
              method:'get',
              proxy: {
                    type: 'ajax',
                         url:'http://172.19.72.30:8080/cipcits/services/CitsService/getOutageMetrics',
    
    
                    reader: {
                        type: 'xml', 
                        root  : 'barChartPlotsList',
                        record: 'barChartPlots'
                    }
                    }
                  });
        
        store.load();
        var colors = ['url(#v-1)', 'url(#v-2)'];
         
         new Ext.chart.Panel({
             renderTo: Ext.getBody(),
             items: drawComponent,
             width: 400,
                height: 300,
                
             title: 'Root Cause Analysis',
             items: {
                
                 animate: {
                     easing: 'bounceOut',
                     duration: 250
                     
                 },
                 store: store,
                 shadow: false,
                 gradients: [{
                     'id': 'v-1',
                     'angle': 165,
                     stops: {
                         80: {
                             
                                 color:  '#488AC7'
                         },
                        100: {
                            
                                color: '#2B3856'
                         }
                     }
                 },
                 {
                     'id': 'v-2',
                     'angle': 30,
                     stops: {
                         0: {
                               color:  '#C11B17'
                         },
                         100: {
                             color: '#595454'
                         }
                     }
                 } ],
                 axes: [{
                     type: 'Numeric',
                     position: 'left',
                     fields: ['value1', 'value2'],
                     minimum: 0,
                     maximum: 10,
                     decimal:2,
                     label: {
                         renderer: function(v) {
                             return v.toFixed(0);
                         }
                     }
                     
                 },
                 {
                     type: 'Category',
                     position: 'bottom',  
                     fields: ['label'],
                     label: {
                         rotate: {
                             degrees: 340
                         }
                     }
                    
                     
                 }],
                 series: [{
                     type: 'column',
                     axis: 'left',
                     highlight: true,
                     renderer: function(sprite, storeItem, barAttr, i, store) {
                         barAttr.fill = colors[i % colors.length];
                         return barAttr;
                     },
                     
                     label: {
                                  display: 'outside',
                                 'text-anchor': 'middle',
                                  field: ['value1', 'value2'],
                                  orientation: 'horizontal',
                                  font:'20px Helvetica, sans-serif'
                                  
                                   },
                       
                     xField: 'label',
                     yField:['value1', 'value2']
                    
                 }]
               
             }
     });
            
    }});


    the xml file is follows



    <barChartPlotsList>
    <barChartPlots>
    <label>FY11Q2</label>
    <value1>1</value1>
    <value1name>KNOWN</value1name>
    <value2>5.4</value2>
    <value2name>UNKNOWN</value2name>

    </barChartPlots>


    <barChartPlots>
    <label>FY11Q2</label>
    <value1>2</value1>
    <value1name>KNOWN</value1name>
    <value2>5.8</value2>
    <value2name>UNKNOWN</value2name>

    </barChartPlots>


    <barChartPlots>
    <label>FY11Q2</label>
    <value1>3</value1>
    <value1name>KNOWN</value1name>
    <value2>5.1</value2>
    <value2name>UNKNOWN</value2name>

    </barChartPlots>


    <barChartPlots>
    <label>FY11Q2</label>
    <value1>1</value1>
    <value1name>KNOWN</value1name>
    <value2>5.7</value2>
    <value2name>UNKNOWN</value2name>

    </barChartPlots>



    </barChartPlotsList>


    can anyone please help me thanks in advance

















  2. #2
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,394
    Vote Rating
    22
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi,
    if you have to load data from a different domain other than the one where the application is loaded, you should use "jsonp" proxy instead of ajax.

    Please read more on HTTP access control at the following article.
    https://developer.mozilla.org/En/HTTP_access_control

    Hope this helps.
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    CEO at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    http://www.tux-components.com/


  3. #3
    Sencha User
    Join Date
    Nov 2011
    Location
    Bengaluru
    Posts
    12
    Vote Rating
    0
    soubhagya ranjan is on a distinguished road

      0  

    Default


    hi andreacammarata,

    thanks for consider my problem.
    i have tried with proxy "jsonp" but i m getting the following error

    Uncaught Error: The 'jsonp' type has not been registered with this manager

    can u please elaborate ?

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Vote Rating
    836
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    http://docs.sencha.com/touch/1-1/#!/...ScriptTagProxy

    is the proxy you need. I haven't tried using this proxy with anything but the JsonReader so I'm not sure how it will act using XmlReader.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.