解决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>
        $.ajax({
            url:"http://map.yanue.net/gpsApi.php?lat=22.502412986242&lng=113.93832783228",
            type:‘GET‘,
            success: function(data){
                $(‘body‘).append( "Name: " + data );
            }
        });
    </script>
</head>
<body>
    测试Ajax跨域问题
</body>
</html>

没有结果,chrome用F12 下查看错误 得知:XMLHttpRequest cannot load http://map.yanue.net/gpsApi.php?lat=22.502412986242&lng=113.93832783228. Origin http://localhost is not allowed by Access-Control-Allow-Origin. AJAX跨域问题产生。

搜了好久,得知解决方案:

一:使用jsonp格式, 如jquery中ajax请求参数   dataType:‘JSONP‘。(可选)

<html>
<head>
    <title>title</title>
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script>
        $.ajax({
            url:"http://map.yanue.net/gpsApi.php?lat=22.502412986242&lng=113.93832783228",
            type:‘GET‘,
            dataType:‘JSONP‘,
            success: function(data){
                $(‘body‘).append( "Name: " + data );
            }
        });
    </script>
</head>
<body>
测试Ajax跨域问题
</body>
</html>

二,server端加上header设为 Access-Control-Allow-Origin:*

getHttpServletResponse().setHeader("Access-Control-Allow-Origin", "*"); // 跨域处理

问题就解决了。

感谢:   http://yanue.net/post-130.html

时间: 2024-10-27 05:52:40

解决Ajax跨域问题:Origin xx is not allowed by Access-Control-Allow-Origin.的相关文章

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

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

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

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

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

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

如何解决ajax跨域问题

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

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

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

解决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.

cors解决ajax跨域

此方法只支持spring4.2及以上版本 一.问题描述 A系统和B系统,A系统想通过ajax调用B系统中的后台方法(B系统SpringMVC) 二.问题解决 1.A系统中ajax: var str = "{'id':'89','fundCode':'000311'}"; jQuery.ajax({ url:'http://172.88.88.888:8180/test/app/product/public/getManaAndComp', type:"post",

解决ajax跨域问题【5种解决方案】

什么是跨域问题?跨域问题来源于JavaScript的"同源策略",即只有 协议+主机名+端口号 (如存在)相同,则允许相互访问.也就是说JavaScript只能访问和操作自己域下的资源,不能访问和操作其他域下的资源.跨域问题是针对JS和ajax的,html本身没有跨域问题. 查看浏览器开发者工具Console报错: Failed to load http://a.a.com:8080/A/FromServlet?userName=123: No 'Access-Control-Allo