利用 img 和 script 发送跨域请求
利用img.src可以发送http请求,但是发送http请求不是img.src的真正用意。
同样,用script.src去请求jsonp格式的接口数据也不是script元素的最初设计用途。
但是这些歪门邪道的技术都是利用了img/script等DOM元素能发跨域请求的特性。
(new Image()).src="包含用户行为数据的url"
另外再写一个img.src和204响应结合的一个应用场景:实现DNS预解析和TCP链接的建立!
Youtobe的前端工程师说他们使用img.src请求来实现preloading video connection。
实现方式是在html的head部分有下面一段script代码:
var img = new Image();
img.src = videoConnectionUrl;
这样做的结果是:
- Resolves DNS while page is rendering, before it is needed
- Maintains an open connection for later use
看,又是一个剑走偏锋的用途!但是它比正规的dns-prefetch更强大,而且不存在低版本浏览器不支持的问题。
内容来源:http://hzxiaosheng.bitbucket.org/work/2014/04/09/img-onerror-event-triggered-by-204-response/
利用 img 和 script 发送跨域请求的更多相关文章
- Vue(八)发送跨域请求
使用vue-resource发送跨域请求 axios不支持跨域 1 安装vue-resource并引入 cnpm install vue-resource -S 2 基本用法 使用this.$http ...
- Vue-cli3.x中使用Axios发送跨域请求的配置方法
Vue-cli3.x中使用Axios发送跨域请求的配置方法 安装axios npm i axios -s main.js中引入 import axios from 'axios' //将axios挂载 ...
- xhr.withCredentials发送跨域请求凭证
一.前言 今天遇到一个坑,浏览器请求数据的时候gg了.浏览器报错如下图: 因为请求头部设置了credentis mode is 'include', 从上面可以看出是Access-Control-Al ...
- 利用jsonp进行Ajax跨域请求
在进行Ajax请求的时候经常会遇到跨域的问题,这个时候一般就会用到jsonp. 关于json和jsonp,网上有很多原理解释,这里就不多赘述,需要的自行搜索. 下面是一个简单的ajax跨域请求示例: ...
- 关于JQuery 中$.ajax函数利用jsonp实现Ajax跨域请求ASP.NET的WebService成功获取数据的案例
部署环境:Window 7 SP1+IIS7 成功方案: 其成功解决问题的几个重要因素如下: 1. 由于WebService默认不支持Get请求,所以要在Web.config配置文件内的& ...
- 利用Jquery处理跨域请求
在项目制作过程中,可能会用到ajax来提高用户体验,这里终于研究出来,利用jquery来进行跨域请求,在用$.getJSON这个方法时,前台页面中需这样写 $.getJSON(“需要提交处理的url? ...
- JSON跨域请求
原理:首先客户机会注册一个callback,在发送跨域请求之前,会在url后附带注册的callback参数(如:callback1982342322),随后服务器拿到了callback参数,获取数据后 ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
- Django跨域请求之JSONP和CORS
现在来新建一个Django项目server01,url配置为 url(r'^getData.html$',views.get_data) 其对应的视图函数为get_data: from django. ...
随机推荐
- 拥抱ARM妹纸第二季 之 第三次 给我变个月亮,让约会更浪漫!
嗯嗯,效果不错.趁着这个热乎劲,接到俺的LED测试板上试试.呃~~~ 竟然和小LED的效果不一样啊,不一样.不但闪烁而且完全没有调光效果.郁闷内,查查原因呗.看看那里出问题.迅速在PT4115手册里翻 ...
- R语言基础(一) 可视化基础
##数据获取 x1=round(runif(100,min=80,max=100)) x2=round(rnorm(100,mean=80, sd=7)) x3=round(rnorm(100,mea ...
- Java从入门到精通——数据库篇之JAVA中的对Oracle数据库操作
在Java中对Oracle数据库的操作分为两种:一.查询.二.非查询. 下面是我对其进行总结: 一.查询数据 /** * 根据用户代码查询 * @param userId * @return 如果存在 ...
- 关于C与C++的struct,union,enum用法差异
对着代码说话: #include <stdio.h> #include <stdlib.h> struct test { int abc; }; enum _enum {A,B ...
- 调皮的转义之addslashes
背景: php自5.3版本开始废除set_magic_quotes_runtime函数,并在5.4及以后版本中移除了该函数 今天程序在向mysql插入一个serialize序列化后的数组时,由于一个数 ...
- UIViewController没有随着设备一起旋转的原因
对于iPhone app,UIViewController类提供了基本的视图管理模式.当设备改变方向的时候view controller的视图会自动随之旋转的.如果视图和子视图的autoresizin ...
- ECSHOP模糊分词搜索和商品列表关键字飘红功能
ECSHOP联想下拉框 1.修改page_header.lbi模版文件,将搜索文本框修改为: <input name="keywords" type="text&q ...
- 深入理解用mysql_fetch_row()以数组的形式返回查询结果
同mysql_result()一样,mysql_fetch_row()也可以用来获取查询结果集,其区别在于函数的返回值不是一个字符串,而是一个数组.函数定义如下. 复制代码 代码如下: array m ...
- 一点关于Ajax和一个等待图标的显示
一点关于Ajax和一个等待图标的显示 1.首先Ajax是asynchronous Java-Script and XML的简写.翻译过来就是异步的JS和XML. 2它的优点就是能不更新页面的情况下,得 ...
- Careercup - Google面试题 - 4557716425015296
2014-05-03 21:57 题目链接 原题: Many sticks with length, every time combine two, the cost is the sum of tw ...