解决ajax跨域问题的多种方法

//第一种方法使用jsonp的方式

<script type="text/javascript" src="http://www.youxiaju.com/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax(
    {
        type:‘get‘,
        url : ‘http://www.youxiaju.com/validate.php?loginuser=lee&loginpass=123456‘,
        dataType : ‘jsonp‘,
        jsonp:"jsoncallback",
        success  : function(data) {
            alert("用户名:"+ data.user +" 密码:"+ data.pass);
        },
        error : function() {
            alert(‘fail‘);
        }
    }
);
})
</script>

  

<?php
header(‘Content-Type:text/html;Charset=utf-8‘);
$arr = array(
    "user" => $_GET[‘loginuser‘],
    "pass" => $_GET[‘loginpass‘],
    "name" => ‘response‘

);
echo $_GET[‘jsoncallback‘] . "(".json_encode($arr).")";

  第二种方式增加headr头

 假设我们页面或者应用已在 http://www.test1.com 上了,而我们打算从 http://www.test2.com 请求提取数据。一般情况下,如果我们直接使用 AJAX 来请求将会失败,浏览器也会返回“源不匹配”的错误,"跨域"也就以此由来。

  利用 CORS,http://www.test2.com 只需添加一个标头,就可以允许来自 http://www.test1.com 的请求,下图是我在PHP中的 hander() 设置,“*”号表示允许任何域向我们的服务端提交请求

  也可以设置指定的域名,如域名 http://www.test2.com ,那么就允许来自这个域名的请求

  当前我设置的header为“*”,任意一个请求过来之后服务端我们都可以进行处理&响应,那么在调试工具中可以看到其头信息设置,其中见红框中有一项信息是“Access-Control-Allow-Origin:* ”,表示我们已经启用CORS,如下图。

  PS:由于demo都在我厂的两台测试机间完成,外网也不能访问,所以在这就不提供demo了,见谅

  简单的一个header设置,一个支持跨域&POST请求的server就完成了:)

  当然,如果没有开启CORS必定失败的啦,如下图:

  

时间: 2024-10-12 22:18:40

解决ajax跨域问题的多种方法的相关文章

jQuery中利用JSONP解决AJAX跨域问题

写在前面 跨域的解决方案有多种,其中最常见的是使用同一服务器下的代理来获取远端数据,再通过ajax进行读取,而在这期间经过了两次请求过程,使得获取数据的效率大大降低,这篇文章蓝飞就为大家介绍一下解决跨域问题的一种比较通用的方案——JSONP. 什么是跨域? 简单的来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即“同源策略”.而跨域就是通过某些手段来绕过同源策略限制,实现不同服务器之间通信的效果. 具体策略限制情况可看下表: URL 说明 允许通信 http:/

深入浅出JSONP:解决AJAX跨域问题

本文主要讲解了如何去解决AJAX跨域的问题,从跨域的简单原理到JONP实现模式详细的讲解整个解决方案,最后利用jQuery可以很方便的实现JSONP来进行跨域访问. 上周客户新买了服务器,原本在旧的服务器上放着客户的Web主页信息和一个后台程序(asp.net),在客户的主页中有一个动态显示最新消息的处理,这个处理就是通过ajax异步从那个后台程序中取得的.由于又购买了新的服务器,客户想把web主页和那个后台程序分开来,后台程序被部署到了新的服务器上.不过这个项目是我的同事小福同志开发的,也就由

如何解决ajax跨域问题(转)

最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决 ajax的跨域问题.本篇将讲述一个小白从遇到跨域不知道是跨域问题,到知道是跨域问题不知道如何解决,再到解决跨域问题,最后找到两种方法解决ajax 跨域问题的全过程. 不知是跨域问题 起 因是这样的,为了复用,减少重复开发,单独开发了一个用户权限管理系统,共其他系统获取认证与授权信息,暂且称之为A系统:调用A系统以B为例.在B系统 中用ajax调用A系统系统的接口(数据格式为json),当时特别困惑,在

如何解决ajax跨域问题

如何解决ajax跨域问题(转) 由 于此前很少写前端的代码(哈哈,不合格的程序员啊),最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决 ajax的跨域问题.本篇将讲述一个小白从遇到跨域不知道是跨域问题,到知道是跨域问题不知道如何解决,再到解决跨域问题,最后找到两种方法解决ajax 跨域问题的全过程. 不知是跨域问题 起 因是这样的,为了复用,减少重复开发,单独开发了一个用户权限管理系统,共其他系统获取认证与授权信息,暂且称之为A系统:调用A系统以B为

解决Ajax 跨域问题 - JSONP原理解析

解决Ajax 跨域问题 - JSONP原理解析 为什么会有跨域问题? - 因为有同源策略 同源策略是浏览器的一种安全策略,所谓同源指的是 请求URL地址中的 协议, 域名 和 端口 都相同,只要其中之一不相同就是跨域 同源策略主要为了保证浏览器的安全性 在同源策略下,浏览器**不允许**Ajax跨域获取服务器数据 http://www.example.com/detail.html 跨域请求: http://api.example.com/detail.html 域名不同 http://www.

如何解决ajax跨域请求?

1.什么是跨域? a.域名不同 b.域名相同,端口不同 注:只有域名相同,端口相同时,才可以访问数据 可以使用jsonp解决ajax跨域请求的问题. 2.什么是jsonp? Jsonp其实就是一个跨域解决方案.Js跨域请求是不可以的,但是js跨域请求js脚本是可以的.可以把数据封装成一个js语句,做一个方法的调用.跨域请求js脚本可以得到此脚本.得到js脚本之后会立即执行.可以把数据作为参数传递到方法中.就可以获得数据.从而解决跨域请求的问题. 原文地址:https://www.cnblogs.

解决Ajax跨域问题:Origin xx is not allowed by Access-Control-Allow-Origin.

解决Ajax跨域问题:Origin xx is not allowed by Access-Control-Allow-Origin. 今天一个Ajax跨域问题,纠结我半天,记录之. <html> <head> <title>title</title> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script>

用iframe设置代理解决ajax跨域请求问题

面对ajax跨域请求的问题,想用代理的方式来解决这个跨域问题.在服务器端创建一个静态的代理页面,在客户端用iframe调用这个代理 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题.于是想用代理的方式来解决这个跨域问题. 什么是跨域?简单的来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即"同源策略".而跨域就是通过某些手段来绕过同源策略限制,实现不同服务器之间通信的效果. 方案:在服务器端创建一个静态的代理页面,在

本地主机作服务器解决AJAX跨域请求访问数据的方法

近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www.apachefriends.org ,只需要解压傻瓜式地安装就可以. 找到安装软件的目录,点击xampp-control.exe然后启动Apache服务, 打开浏览器,在地址栏输入localhost,出现如下图片,说明安装启动都没问题 现在编写两个简单的文本,一个txt文件,一个html代码: 截图