EXTJS 4.2 资料 跨域的问题

关于跨域,在项目开发中难免会遇到;之前笔者是用EXTJS3.0开发项目的,在开发过程中遇到了关于跨域的问题,但是在网上找到资料大部分都是ExtJs4.0以上版本的

在ExtJs中 例如:Ext.Ajax.request,这是我们常用的数据请求的方式,如下代码:

               Ext.Ajax.request({
                        url: ‘ServiceAPIORM.ashx?API=Save‘,
                        params: { name: ‘张三‘ },
                        method: ‘POST‘,
                            success: function (req) {
                                alert("成功");
                                alert(req.responseText);
                            },
                            failure: function (req) {
                                alert(req.responseText);
                            },
                    });

但是改写成跨域:

               Ext.Ajax.request({
                        url: ‘http://localhost:3722/ServiceAPIORM.ashx?API=Save‘,//跨域链接
                        params: { name: ‘张三‘ },
                        method: ‘POST‘,
                            success: function (req) {
                                alert("成功");
                                alert(req.responseText);
                            },
                            failure: function (req) {
                                alert(req.responseText);
                            },
                    });

这样请求一定不会成功的。

解决跨域:

1.在ExtJs4.2,有JsonP可进行解决,但是只能用Get的请求方式提交,所以还是有一定缺陷与不足的,这个逻辑是在 Ext.data.JsonP.reques({})的属性,callbackKey:"jsonPCallback", 作为参数传送后台,如图:

然后在后台接受在传送到前台,格式:Response : Ext.data.JsonP.callback1({success:true,data:‘ssss‘})

前端代码:

            Ext.data.JsonP.request({
                        url: ‘http://localhost:3722/ServiceAPIORM.ashx?API=Save‘,
                        timeout: 300000,
                        params: { name: ‘123456‘ },
                        callbackKey: "jsonPCallback",
                        success: function (req) {
                            alert("成功");
                            alert(req.responseText);
                        },
                        failure: function (result) {
                            alert(req.responseText);
                        }
                    });

后端代码:

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

            string method = context.Request.QueryString["API"];
            switch (method)
            {
                case "Save":
                    Save(context);
                    break;
            }
        }
        /// <summary>
        ///save
        /// </summary>
        /// <param name="context"></param>
        private void Save(HttpContext context)
        {
            string jsonPCallback = "";
            jsonPCallback = context.Request["jsonPCallback"];
            context.Response.ContentType = "text/javascript";
            context.Response.Write(jsonPCallback + "({success:true,data:‘ssss‘})");
        }

Js 跨域,下面是关于Js跨域的链接

http://blog.csdn.net/iispring/article/details/7428069

ASP.NET交流群(1群): EXTJS交流群(3群):

时间: 2024-10-09 02:32:38

EXTJS 4.2 资料 跨域的问题的相关文章

cors跨域的前端实现---根据资料整合的

1.服务端 搁response中增加Access-Control-Allow-Origin:'*' eg:  context.Response.AddHeader("Access-Control-Allow-Origin", "*"); 2.前端 同样发送ajax请求 $.ajax({ type:'method'   //GET POST HEAD都行 url:'croll-domain-url', xhrFields:{ withCredentials:true

Extjs的form跨域提交文件时,无法获取返回结果

form文件表单跨域提交时,无法获取远程服务器的返回结果,form提交代码如下: form.submit({ url:'http://{remoteUrl}/hgisserver/wrds/file', waitMsg: 'Reading your file...', method : 'POST', success: function(fp, o) { console.log(o); }, failure: function(form, action) { console.log(action

准备写api试试,但是ajax一直遇到跨域问题,postman都能正确获取,所以查资料

function goupdathyzt(sqid, zt) { $.ajax({ async: false, url: "http://localhost:17298/api/aaa/sss", type: "get", //必填 contentType: "application/json; charset=utf-8", data: { "huo_id": 13, "huozhu_id": 7 },/

chrome浏览器下用jQuery的load函数来跨域加载页面,响应状态status为(canceled)是什么情况? JSON和JSONP,也许你会豁然开朗,含jQuery用例

http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 问题来源:http://q.cnblogs.com/q/63123/ 问题出现的环境: 1:两个domain相同端口号不同的域名. 2:MVC4.0框架 3:从一个域名下用  jQuery.load("另一个域名下的页面"): 4:响应失败 : 响应状态status为(canceled) 请问这是什么情况呢 ?  我在IE下就没问题,可以

js跨域请求方式 ---- JSONP原理解析

这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下 跨域请求数据解决方案主要有如下解决方法: 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 Html5的XDomainRequest Flash request 分开说明: 一.JSONP: 直观的理解: 就是在客户端动态注册一个函数 function a(data),然后将函数名传到服务器,服务器返回一个a({/*json*/})到客户端运行,这样就调用客户端的 function a(data),从而

JS-JQuery(JSONP)调用WebService跨域若干技术点

1.JSONP:JSON With Padding,让网页从别的网域获取信息,也就是跨域获取信息,可以当做是一种"工具",大多数架构Jquery.EXTjs等都支持. 由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的<script> 元素是一个例外.利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的 JSON 资料,而这种使用模式就

说说JSON和JSONP,浅析JSONP解决AJAX跨域问题

说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可以通过服务器端代理来解决. 但到目前为止最被推崇或者说首选的方案还是用JSON来传数据,靠JSONP来跨域.而这就是本文将要讲述的内容. JSON和JSONP虽然只有一个字母的差别,但其实他们根本不是一回事儿:JSON是一种数据交换格式,而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互

JSON跨域读取那点事(JSONP跨域访问)

最近在码一个小项目,需要远程读取json.因为需求很少,如果引用jquery使用其getjson方法就显得很浪费嘛= = 这篇文章很详细的解释了JSON跨域读取的前世今生,把原理讲得很透彻.特此分享. 原文链接:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 前言: 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强

JSON和JSONP,原来ajax引用这个来实现跨域访问的

由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socket通讯和本地数据库功能,又或者通过HTML5的WebSocket也可以实现与服务器的通讯和服务端推功能,但这两种方式都有其局限性,前者需要PhoneGap支持,后者要求用户设备必须支持WebSocket,因此都不能算是ST2的原生解决方案,原生的只有AJAX. 说到AJAX就会不可避免的面临两个问题,第一