如何快速解决JS或Jquery ajax异步跨域的问题
简单的概括下,解决办法有两种。
一种是jsonp方式:即在前端发送异步请求时,添加相关的jsonp设置或配置;后端则返回可供jsonp解析的格式的串。
但是jsonp方式只支持get的请求方式,并且不被新浏览器版本的支持(新浏览器版本多进行OPITION请求--异步安全检查的测试的请求,所以jsonp方式无法通过),
这里就不多了解了。
一种是cros方式,优点就是更安全,能指定连接白名单,能限定请求方法(也就是支持多种请求方法),主流浏览器都支持。主要说一下实现方式,
前端:和普通异步请求一样的格式,如:
$.ajax({ url :'http://localhost:8080/myProject/test' type : "GET",//不局限于get data:{"key1":value1,"key2":value2}, async : true, success : function(data) { var dataObj=eval("("+data+")"); console.log(dataObj); }, error : function(data) { alert( "服务器连接失败 ajaxJsonp" ); } });
后端:主要是设置响应头参数
response.setHeader("Access-Control-Allow-Origin", "*");//设置可跨域资源共享的域名,只能设置一个具体的域名,但*可以代表所有 response.setHeader("Access-Control-Allow-Methods","GET,POST,PUT,OPTIONS");//设置可跨域资源共享的请求方式 response.setHeader("Access-Control-Allow-Credentials","true"); response.setHeader("Access-Control-Allow-Headers" ,"Origin, X-Requested-With, Content-Type, Accept");
相关推荐
-
jquery ajax跨域解决方法(json方式)
最近公司开发的项目中很多地方需要跨域ajax请求,比如几个子域名下 http://a.****.com/index123.aspx, http://b.****.com/index2.aspx 都要请求用户json信息,然后再对数据进行处理,起初我和同事们试了很多种方法,使用$.ajax() 无论是get或post方法都会引起uri deny的错误.一番GG之后发现了解决方法,也了解其中的原因. jquery从1.2开始,.getJSON就支持跨域操作了.使用jquery.getJSON()方法
-
有关Ajax跨域问题的两种解决方法
概述 Ajax跨域是前端开发中常见的问题,本文描述了以Google浏览器Chrome作为客户端和以Tomcat作为Web服务器的情况下的解决办法. 问题现象 当出现跨域访问的时候ajax通常会报类似如下错误: XMLHttpRequest cannot load http://192.168.2.12:8001/oss/api/version/check. No 'Access-Control-Allow-Origin' header is present on the requested re
-
jQuery跨域问题解决方案
通过XMLHTTPRquest请求不同域上的数据,原来js跨域访问是后台有个处理路径"/test"的函数.下面把具体解决方案介绍如下. 后台处理路径"/test"的函数: 复制代码 代码如下: //路径处理 app.get("/test",user.test); //处理函数 exports.test=function(req,res){ res.end("alert('JS跨域访问')"); }; 外部有一个网页需要
-
完美解决AJAX跨域问题
从AJAX诞生那天起,XMLHttprequest对象不能跨域请求的问题就一直存在.这似乎是一个很经典的问题了.是由于javascript的同源策略(这里不作深入探讨)所导致. 解决的办法,大概有如下几种: 1. 使用中间层过渡的方式(可以理解为"代理"): 中间过渡,很明显,就是在AJAX与不同域的服务器进行通讯的中间加一层过渡,这一层过渡可以是PHP.JSP.c++等任何具备网络通讯功能的语言,由中间层向不同域的服务器进行读取数据的操作.拿asp.net做一个例子,如果需要对不同域
-
jquery+ajax实现跨域请求的方法
本文实例讲述了jquery+ajax实现跨域请求的方法.分享给大家供大家参考.具体实现方法如下: 说明:这里的dataType 为 "jsonp" :type 只能为 GET 前台请求代码如下: 复制代码 代码如下: $.ajax({ type: "GET", url: "http://www.xxx.com/Rest/ValidAccountsExists.aspx?accounts=admin", dataType: "j
-
5种处理js跨域问题方法汇总
前两天碰到一个跨域问题的处理,使用jsonp可以解决.(http://www.jb51.net/article/57889.htm) 最近再整理了一下: 1.jsonp. ajax请求,dataType为jsonp.这种形式需要请求在服务端调整为返回callback([json-object])的形式.如果服务端返回的是普通json对象.那么调试的时候,在chrome浏览器的控制台会报"Uncaught SyntaxError: Unexpected token"错误:在firefox
-
如何快速解决JS或Jquery ajax异步跨域的问题
简单的概括下,解决办法有两种. 一种是jsonp方式:即在前端发送异步请求时,添加相关的jsonp设置或配置:后端则返回可供jsonp解析的格式的串. 但是jsonp方式只支持get的请求方式,并且不被新浏览器版本的支持(新浏览器版本多进行OPITION请求--异步安全检查的测试的请求,所以jsonp方式无法通过), 这里就不多了解了. 一种是cros方式,优点就是更安全,能指定连接白名单,能限定请求方法(也就是支持多种请求方法),主流浏览器都支持.主要说一下实现方式, 前端:和普通异步请求一样
-
浅谈JQuery+ajax+jsonp 跨域访问
Jsonp(JSON with Padding)是资料格式 json 的一种"使用模式",可以让网页从别的网域获取资料. 一. 客户端 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv=&q
-
jquery ajax jsonp跨域调用实例代码
客户端代码 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApp.WebForm1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
-
jQuery Ajax实现跨域请求
本文实例为大家分享了jQuery Ajax跨域请求的具体代码,供大家参考,具体内容如下 html 代码清单: <script type="text/javascript" src="http://www.youxiaju.com/js/jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(function(){ $.ajax( { ty
-
JQuery Ajax执行跨域请求数据的解决方案
今天前端因为需要ajax调用两个不同的项目,请求域不一样,所以涉及ajax跨域的问题 ,其实很简单,具体如下 原来的ajax请求如下: $.ajax({ type:"post", url:platformUrl +"/security/modifyPwd.do", data:$('#updatepwdform').serialize(), dataType:"json", success:function(data){ $("#upda
-
MVC+jQuery.Ajax异步实现增删改查和分页
本文实例为大家分享了MVC+jQuery.Ajax异步实现增删改查和分页的具体代码,供大家参考,具体内容如下 1.Model层代码 using System; using System.Data; using System.Configuration; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; usin
-
jQuery Ajax 异步加载显示等待效果代码分享
AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1) 使用CSS和XHTML来表示. 2) 使用DOM模型来交互和动态显示. 3) 使用XMLHttpRequest来和服务器进行异步通信. 4) 使用javascript来绑定和调用. 通过AJAX异步技术,可以在客户端脚本与web服务器交互数据的过程中使用XMLHttpRequest对象来完成HTTP请求(Reques
-
详解使用Vue.Js结合Jquery Ajax加载数据的两种方式
整理文档,搜刮出一个使用Vue.Js结合Jquery Ajax加载数据的两种方式的代码,稍微整理精简一下做下分享. 废话不多说,直接上代码 html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo</title> <script src="js/jquery.js"
-
快速解决js中window.location.href不工作的问题
E6中在html中<a>标识中通过JS添加click事件调用一个JS函数,例如: < script type = "text/javascript" > function jump () { window . location . href = 'http://www.jb51.net' ; } function enjoy () { return false ; } < /script> html代码: <a href= "java
随机推荐
- php增删改查示例自己写的demo
- Bootstrap常用组件学习(整理)
- python网络编程之UDP通信实例(含服务器端、客户端、UDP广播例子)
- 随机生成文件名的函数
- Android使用token维持登陆状态的方法
- Centos6.5 编译安装mysql 5.6.16 详细教程
- MySQL运行状况查询方式介绍
- PHP跨时区(UTC时间)应用解决方案
- Google的跟踪代码 动态加载js代码方法应用
- JS使用eval()动态创建变量的方法
- java 实现文件夹的拷贝实例代码
- PHP简单实现“相关文章推荐”功能的方法
- 跟我学习javascript的闭包
- SQL Server常用管理命令小结
- sqlserver CONVERT()函数用法小结
- MySQL主从复制配置心跳功能介绍
- TextBox获取输入焦点时自动全选的实现方法
- Jquery 动态生成表格示例代码
- 用javascript实现模拟火焰
- C++利用std::forward_list查找插入数据方法示例