当前位置:首页 > 技术文章 > 正文内容

关于跨域GET、POST请求的小结

arlanguage2周前 (04-23)技术文章8

重点:跨域POST大量数据;

JQuery:$.ajax/$.getJSON支持jsonp格式的跨域,但是只支持GET方式,暂不支持POST;

CORS:w3c关于跨域的新方案,res.setHeader('
Access-Control-Allow-Origin','*'),兼容IE9+;

so,跨域POST是个值得研究的问题啊!万能的JQuery无法跨域POST;鉴于基本国情,CORS也只是适合在移动端玩玩;

相信有同学这样做过:

实际上chrome的控制台显示却是这样的:

那么,如图是否可以证明jQuery确实无法跨域POST呢?说好的POST呢,jQuery自动将其转为GET了;这样其实就和$.getJSON差不多了,只是$.ajax的跨域直接能回调返回值,而$.getJSON的返回值需要一个全局的callback(可自定义);

话说我的个人小站在移动端还处于最原始的缩放状态,说好的H5 Response Web呢?原谅我再一次跑偏了:原本计划或者直接在原有样式表里media query;而结果却是我新开了个站点,作为移动端的版本,读取PC端存储的数据;一方面减轻代码量,使移动端更轻量简洁,毕竟只是个博客嘛;另一方面,这样的话,移动端将有更宽广的随意挥洒的空间;再者,基于性能优化,这样也不错;当然,问题也很明显了;两个站点要共享数据,连同一个数据库,要做同步操作,呵呵,我一个小前端,这些貌似目前想太多啊!那么怎么办呢,是的,就是上面说到的问题,前端跨域请求数据;

移动端的库用的是由zepto的一些模块自定义组装的一个版本,bootstrap什么的一边凉快凉快吧,样式手写的,权当练手吧。。。在后端,由Nodejs的http-proxy做代理,判断请求的UA,如果是移动端的访问,则无论host是www.famanoder.com还是m.famanoder.com全都分发到移动端的站点处理,这样在手机上访问www.famanoder.com就不用做跳转了;

OK,那么要开始跨域请求和提交数据了;如果只是请求远程数据,GET方式足矣;可是如果要提交大量数据,比如,某大侠路过小站,一时兴起,引经据典,古今中外,滔滔不绝,长篇大论一通

,这样的话恐怕GET搞不定啊!先看看最简单的GET方式吧:

然后定义好全局的getmore就OK了,后端处理也简单,我这是Nodejs,其他的自行百度吧:

当然像上图里那样也是可以的,后端同样处理;

前面说了,伟大的JQuery暂时不支持POST方式的跨域;那咋办呢?其实没有想象的那么复杂,是时候证明你不能太依赖JQuery了,有时候没有她,你也要好好过;

基本原理大概是这样的:form表单提交,无论你是post,还是get,无论你提交到哪,只要后端有对应程序处理,都妥妥的,不存在跨域一说;以前无刷新上传、提交表单都是将form的target指向一个空iframe,此处同理;类似:a.com提交表单到b.com,表单的target为一个空iframe;b.com处理请求,在response里执行callback,注意,此处callback是属于那个空iframe的;

后端的处理基本一样;如果不出意料,到此,请求会在控制台出现一片红,是的,要你设置domain;除了页面和对应js要设置domain外,一定别忘啦,response里的callback其实是属于当前页面的,所以response里执行的callback也要设置domain;类似这样:

OK,没有了她,你依然要好好过;这样你就可以POST跨域提交大量数据了;同时也弥补了JQuery只能通过jsonp GET跨域了;当然CORS在移动端也是值得推荐的;小伙伴们可以试一下,或者有其他什么好办法,记得和我分享啊!

扫描二维码推送至手机访问。

版权声明:本文由AR编程网发布,如需转载请注明出处。

本文链接:http://www.arlanguage.com/post/4077.html

标签: jquery表单
分享给朋友:

“关于跨域GET、POST请求的小结” 的相关文章

该如何申请泛域名SSL证书

泛域名SSL证书目前在实际应用过程很多,特别是对于一些企业用户和高校用户,子域名多的情况下使用泛域名SSL证书,可用于保护多个域(主机),由域名字段中的通配符 (*) 指示。这种证书主要用于具有许多子域的组织。通配符证书对主域及其所有次级子域有效且无数量限制,方便集成化管理。了解什么是泛域名SSL证...

Nginx常用技巧

Nginx常用技巧:提高性能、安全性与稳定性Nginx作为高性能的Web服务器和反向代理服务器,广泛应用于各类生产环境中。通过一些常用的配置技巧,可以有效提高Nginx服务器的性能、安全性和可靠性。以下将介绍几项关键的配置技巧,帮助您最大化利用Nginx的优势。直达服务器选购网址:www.tsyvp...

NGINX 路由配置与参数详解(https配置、跨域配置、socket配置)

一、概述Nginx 是一个高性能的开源Web服务器,也可以用作反向代理服务器、负载均衡器和HTTP缓存。它的设计目标是提供高并发、低内存消耗和高度可伸缩性,使其成为处理大量并发连接的理想选择。NGINX 基础部分可以参考我这篇文章:NGINX - 高级负载均衡器、Web服务器、反向代理二、https...

PHP nginx配置 配置nginx支持php

在配置 PHP 和 nginx 以运行 PHP 应用程序时,您需要进行以下步骤:安装 nginx 和 PHP:如果您的系统上尚未安装 nginx 和 PHP,请根据您的操作系统的说明来安装它们。配置 nginx:您需要为 PHP 应用程序创建 nginx 服务器配置。您可以使用以下代码作为模板:ph...

了解PHP-FPM

在服务器上,当我们查看php进程时,全都是php-fpm进程,大家都知道这个就是php的运行环境,那么,它到底是个什么东西呢?PHP-FPM简介PHP-FPM,就是PHP的FastCGI管理器,用于替换PHP FastCGI的大部分附加功能,在PHP5.3.3后已经成为了PHP的标配。有小伙伴要问了...

Nginx 最全操作——nginx配置(2)

nginx 配置基本结构main # 全局配置,对全局生效 ├── events # 配置影响 nginx 服务器或与用户的网络连接 ├── http # 配置代理,缓存,日志定义等绝大多数功能和第三方模块的配置 │ ├── upstream # 配置后端服务器具体地址,负...