在使用 ajax 的时候,往往需要通过 ajax 跨域请求一些?

但是 XMLHTTPRequest 是不支持跨域的,所以产生了 JSONP 这个东西来解决跨域,当然解决跨域的方式有很多种....

第一种解决跨域

<script type='text/javascript' >
(function(window){
//AJAX获取界面信息
$(function(){
$.ajax({
// 豆瓣API接口
url:'http://api.douban.com/v2/movie/in_theaters?count=2',
dataType:"jsonp",
jsonp:"callback",
success:function(data){
console.log(data);
}
});
});
})(window);
</script>

这种解决跨域的方式,能够解决一些常规的业务逻辑,但是如果请求:天气的API接口就会有问题

url:'http://www.weather.com.cn/data/sk/101010100.html'

第二种解决跨域

可以再本地的服务器上获取其他服务器的信息,在通过ajax请求本地服务来实现:

<?php
header("content-type:text/html;charset=utf-8");
//php代理获取天气信息
//跨域请求
//天气预报接口
$url = "http://www.weather.com.cn/data/sk/101010100.html";
$cont = file_get_contents($url);
echo $cont;
?>

接下来使用 ajax 去请求本地的这个PHP文件即可:

<script type='text/javascript'>
$('input.submit').click(function(){
$.ajax({
url:"weather.php",
async:true,
success:function(result){
eval("var info="+result);
console.log(info['weatherinfo']['city']);
}
});
});
</script>

还有其他的方式来解决跨域,同样是通过JSONP的方式,我们可以自己编写JSONP文件,来解决跨域问题:

ajax跨域终极解决办法!的更多相关文章

  1. AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法?

      AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法? 分类: web前端面试题2013-07-20 22:40 630人阅读 评论(0) 收藏 举报 目录(? ...

  2. Ajax跨域访问解决办法

    方法1. jsonp实现ajax跨域访问示例 jsp代码: <body> <input type="button" onclick="testJsonp ...

  3. 基于.Net Framework 4.0 Web API开发(5):ASP.NET Web APIs AJAX 跨域请求解决办法(CORS实现)

    概述:  ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题,特 ...

  4. ajax跨域的解决办法

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content ...

  5. vue-cli开发时,ajax跨域详细解决办法

    在config/index.js中进行如下配置 [即在进行ajax请求时,地址中任何以/api开头的请求地址都被解析为目标地址,target就是你想要的后台接口地址] proxyTable: { '/ ...

  6. 第114天:Ajax跨域请求解决方法(二)

    一.什么是跨域 我们先回顾一下域名地址的组成: http:// www . google : 8080 / script/jquery.js   http:// (协议号)       www  (子 ...

  7. 第113天:Ajax跨域请求解决方法

    一.原生JS实现ajax 第一步获得XMLHttpRequest对象 第二步:设置状态监听函数 第三步:open一个连接,true是异步请求 第四部:send一个请求,可以发送一个对象和字符串,不需要 ...

  8. 前端面试题常考&必考之--跨域的解决办法

    1.为啥出现跨域??? 在制定Html规则时,为了安全的考虑,一个源的脚本(网页,网站)不能与另一个源的资源进行交互, 所以就引发一个词叫做“同源策略”. 同源策略:同源策略是一种约定,它是浏览器最核 ...

  9. (转)jquery ajax使用及跨域访问解决办法

    原文地址:***/UIweb/jquery_ajax_kuayujiejue.html 最近开发中,设计到智能手机项目,给领导做几个demo.主要是用jquery和jqeury mobile. 越来越 ...

随机推荐

  1. php 删除指定文件 glob,unlink

    我用最简单的语句写了一个php删除指定文件 因为一直越级挑战thinkphp,所以突然面对php有点无所适从了... 首先,php的运行机制,是一个语法就搞定了,还是非要用数据库,还是post什么的. ...

  2. IntelliJ IDEA 14 利用JRebel实现热部署

    特别鸣谢:http://wlb.wlb.blog.163.com/blog/static/467413201522095132658/ ©IntelliJ IDEA开源社①群 185441009 鸣谢 ...

  3. Spring in Action 4th 学习笔记 之 AOP

    前提:本文中的AOP仅限于Spring AOP. 先说说为什么需要AOP 最简单的一个例子就是日志记录,如果想记录一些方法的执行情况,最笨的办法就是修改每一个需要记录的方法.但这,真的很笨... 好的 ...

  4. par函数fg参数-控制前景色

    fg参数用来控制前景色,其实指的就是x轴和y轴的轴线和刻度线的颜色 在R语言中,会根据fg, col 任何一个参数的值,自动的将两个参数的值设置为相同的值,举个例子: par(fg = "r ...

  5. Case用法

    SELECT <myColumnSpec> = CASE WHEN <A> THEN <somethingA> WHEN <B> THEN <so ...

  6. Linux下安装subversion1.6.5和apache2

    以下安装是在RHEL5.5默认安装的情况下,以root身份进行安装!这个实验我安装了n次,最后总是不成功,因为涉及到略多的软件和配置.下面是安装步骤和配置,自己记下来.希望给下次配置的时候不要像以前那 ...

  7. 在工程名.h头文件中写public:

    class CaccessimageApp : public CWinApp { public: _ConnectionPtr m_pConnection; CaccessimageApp(); // ...

  8. VC++ :传统剪贴板的延迟提交技术

    传统剪贴板存在的局限 传统剪贴板有一个局限性:剪贴板上的所有数据都要保存在内存上. 对于文本字符串和其它简单数据类型,可以快速有效地传递.但是,对于比较大的数据,清空剪贴板之前,数据都要占用较大的内存 ...

  9. mysqldump备份时,--master-data选项的作用是什么?

    需求描述: 今天在研究mysql的备份和恢复,使用mysqldump备份数据库时,用到--master-data选项, 在此,测试并记录选项的作用 测试过程: 1.不使用--master-data进行 ...

  10. zookeeper命令行

    ZooKeeper -server host:port cmd args stat path [watch] set path data [version] ls path [watch] delqu ...