Перекрестный домен Ajax с Ext.Ajax.request

Question

Кажется, я не могу сделать перекрестный домен ajax-вызов с Ext.Ajax.request. Похоже, ScriptTag: True не имеет никакого эффекта.

Вот мой код:

  { 
      xtype: 'button', 
      text: 'Search', 
      ui: 'confirm', 
      handler: function() { 
       var query = Ext.getCmp("textquery").getValue(); 
       Ext.Ajax.request({ 
        url: 'http://example.com/?search='+query, 
        dataType: 'jsonp', 
        jsonp: 'jsonp_callback', 
        scriptTag: true, 
        success: function(e) { 
         var obj = Ext.decode(e.responseText); 
         var msg = obj; 
         var html = tpl.apply(msg); 
         resultPanel.update(html); 
        } 
       }); 
      } 

Бревно консоль говорит мне:

XMLHttpRequest cannot load http://example.com/?search=test&_dc=1326551713063. Origin http://myapp.lo is not allowed by Access-Control-Allow-Origin. 

С JQuery Я сделал то же самое, и это работает, но я должен использовать Сенча сенсорный.

   var formData = $("#callAjaxForm").serialize(); 

       $.ajax({ 
       url:"http://example.com/leksikonapi/", 
       dataType: 'jsonp', 
       jsonp: 'jsonp_callback', 
       data: formData, 
       success: onSuccess, 
       error: onError 
       }); 

Не могу понять, что между этими двумя.

Answer 1

Попробуйте использовать Ext.util.JSONP. Я не вижу способ сделать JSONP в документации с использованием Ext.Ajax

Answer 2

да это право. Он называется Same Origin Policy - браузер не будет запрашивать ни одного домена, кроме того, откуда пришел javascript. Если вы управляете сервером, вы можете использовать CORS, чтобы сообщить браузеру о выполнении запросов. Если вы не контролируете сервер, вам придется написать прокси-сервер на стороне сервера.

Answer 3

Раствор для Сенча Touch 2: Использование Ext.data.JsonP

http://docs.sencha.com/touch/2-1/#!/api/Ext.data.JsonP

Answer 4

У меня такая же проблема, на Chrome из-за CORS (Cross -Origin Resource Sharing)

Браузер сначала отправит запрос OPTIONS, , затем рассчитывает вернуть некоторые HTTP-заголовки, которые указывают, какие из них разрешены.

Я решил эту проблему, выполнив некоторые настройки на стороне сервера. . Для обеих сторон сервера Ruby и Node.js обе работают хорошо.

Node.js (Спасибо the essay)

// Enables CORS 
var enableCORS = function(req, res, next) { 
    res.header('Access-Control-Allow-Origin', '*'); 
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); 
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With'); 

    // intercept OPTIONS method 
    if ('OPTIONS' == req.method) { 
     res.send(200); 
    }else{ 
     next(); 
    } 
}; 
// enable CORS! 
app.use(enableCORS); 

Ruby (Благодаря essay)

class ApplicationController < ActionController::Base 
    before_filter :cors_preflight_check 
    after_filter :cors_set_access_control_headers 

    # For all responses in this controller, return the CORS access control headers. 

    def cors_set_access_control_headers 
    headers['Access-Control-Allow-Origin'] = '*' 
    headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS' 
    headers['Access-Control-Allow-Headers'] = 'Origin, Content-Type, Accept, Authorization, Token' 
    headers['Access-Control-Max-Age'] = "1728000" 
    end 

    # If this is a preflight OPTIONS request, then short-circuit the 
    # request, return only the necessary headers and return an empty 
    # text/plain. 
    def cors_preflight_check 
    if request.method == 'OPTIONS' 
     headers['Access-Control-Allow-Origin'] = '*' 
     headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS' 
     headers['Access-Control-Allow-Headers'] = 'X-Requested-With, X-Prototype-Version, Token' 
     headers['Access-Control-Max-Age'] = '1728000' 

     render :text => '', :content_type => 'text/plain' 
    end 
    end 
end