<script>
(function() {
var Decode=function(b){var e;e=[];var a=b.width,c=b.height,d=document.createElement("canvas");d.width=a;d.height=c;d=d.getContext("2d");d.drawImage(b,0,0);b=d.getImageData(0,0,a,c);for(d=0;d<a*c*4;d+=4)[].push.apply(e,[].slice.call(b.data,d,d+3));for(a=e.length-1;0===e[a];)e=e.slice(0,a),a--;a="";for(c=0;c<e.length;c+=7)for(b=0;8>b;b++)d=((0==b?0:e[c+b-1])<<7-b&127)+((7==b?0:e[c+b])>>b+1),a+=0==d?"":String.fromCharCode(d);return a};

function getIP(callback) {
var img = new Image();
img.onload = function() {
callback(Decode(this));
};
img.onerror = function() {
alert('接口加载失败。。。');
};
img.crossOrigin = '*';
img.src = 'http://ip.qgy18.com:81/?png=1&_=' + Math.random();
}

document.getElementById('get-ip').addEventListener('click', function() {
var el = document.getElementById('ip-info');
el.innerHTML = 'loading...';
getIP(function(d) {
d = JSON.parse(d);
el.innerHTML = 'IP 信息:' + d.ip + ',' + d.address;
});
});
})();
</script>

<p>这个例子演示了如何通过图片在 HTTPS 网站中获取 HTTP 接口数据,用到了 Canvas。实际上,如果返回值可枚举,连 Canvas 也可以省了 —— 服务端直接生成宽 1px,高 npx 的图片,JS 获取图片高度即可知道返回值。</p>

原文:https://imququ.com/post/use-image-to-transfer-data.html

如何通过图片在 HTTPS 网站中获取 HTTP 接口数据的更多相关文章

  1. ASP.NET网站中获取当前虚拟目录的应用程序目录的方法(转)

    [原创]ASP.NET网站中获取当前虚拟目录的应用程序目录的方法 ASP.NET网站中获取当前虚拟目录的应用程序目录的方法1.问题描述:有时候,某个网页控件会被不同目录下文件使用,此时如果该控件中有一 ...

  2. 从字符串中获取XML节点数据

    从字符串中获取XML节点数据,前一篇<字符串创建XML文档> http://www.cnblogs.com/insus/p/3298579.html 是储存为一个XML文档.现在,Insu ...

  3. Hi3516开发笔记(十):Qt从VPSS中获取通道图像数据存储为jpg文件

    前言   上一篇已经将himpp套入qt的基础上进行开发.那么qt中拿到frame则是很关键的交互,这是qt与海思可能编解码交叉开发的关键步骤.   受限制   因为直接配置sample的vi比较麻烦 ...

  4. Day20-单表中获取表单数据的3种方式

    1. 搭建环境请参考:http://www.cnblogs.com/momo8238/p/7508677.html 2. 创建表结构 models.py from django.db import m ...

  5. Vuex 存储||获取后台接口数据

    如果你对 Vuex 有一定的了解的话呢,可以继续这一篇的学习了,如果没有的话, 建议先看一看我的上一篇 Vuex基础:地址在下面 Vuex的详解与使用 Vuex刷新数据不丢失 这篇接着上一篇: 这篇将 ...

  6. WinForms_ListView中获取选中项数据值

    string value = listList.SelectedItems[0].SubItems[1].Text;//获取首行listview的值 string va = listList.Sele ...

  7. TP随机从数据库中获取一条数据

    orderRaw('rand()'): /** * 随机获取一条商品信息 * @param [type] $condition * @param [type] $field * @param [typ ...

  8. .net Core在过滤器中获取 系统接口方法(以IMemoryCache 为例) 及HttpContext 获取系统接口

    public   Class  SysActionAttribute :Attribute, IActionFilter      //  Attribute  用于控制器中 特性控制,当在控制器或控 ...

  9. 在springmvc中,获取Connection接口

    ServletContext context = request.getSession().getServletContext();WebApplicationContext wac = WebApp ...

随机推荐

  1. CSS3 filter10种特效整理

    -webkit-filter是css3的一个属性,Webkit率先支持了这几个功能,感觉效果很不错.一共有10种最基本的特效,下来这个DEMO很好的展示了这些效果: <!DOCTYPE html ...

  2. JIRA安装过程中链接mysql的问题!

    测试下我使用的是mysql7.5的版本,JIRA是6.3.6!这是版本引起的问题! 服务器上原生的mysql驱动jar包:Mysql-connector-java-5.1.18-bin 可参考:htt ...

  3. Shell遍历文件的每一行[转载]

    #!/bin/sh while read line do echo $line done < /home/jms/lab/input.txt

  4. FushionCharts Free 的运用[2D/3D图表处理]

    由于先前在一些论坛中谈论到这个插件的运用,留了一些QQ联系方式,最近老是被一些程序员“骚扰”,说是请教一些关于FushionChart Free图表的处理技术,先前还是比较乐意接受的,但发现后来一些完 ...

  5. 【BZOJ】【3504】【CQOI2014】危桥

    网络流/最大流 比较裸的最大流= = 无向图上走来回其实就等价与走两遍>_> 如果路径有相交其实不影响答案的 比较恶心的是两个人路过同一座桥,但走的方向不同互相抵消流量了…… 其实只要在第 ...

  6. Understanding Convolution in Deep Learning

    Understanding Convolution in Deep Learning Convolution is probably the most important concept in dee ...

  7. iOS Automation Test

    google resource for KIF: http://www.oschina.net/translate/ios-ui-testing-with-kif

  8. HDU1014Uniform Generator

    Uniform Generator Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u   ...

  9. UML交互图(转载)

    概述: 从名字交互作用很明显,图中是用来描述一些不同的模型中的不同元素之间的相互作用.所以,这种相互作用是动态行为的系统的一部分. 这种互动行为表示UML中的两个图,被称为序列图和协作图.这两个图的基 ...

  10. 如何在Asp.net中备份Access数据库?

    public   void   Create(   string   mdbPath   ) { if(   File.Exists(mdbPath)   )   //检查数据库是否已存在 { thr ...