获取url参数是经常需要用的一个方法,url上的参数可以让我们的程序执行更灵活。

图片转本地也是很实用的,因为海报合成通常只支持本地。

下面我们来看看这些功能的实现:

获取所有参数,采用split拆分法:

var strs;
function GetRequest () {
var url = location.search;//获取url中“?”符后的字符串
var theRequest = new Object();
if (url.indexOf('?') != -1) {
var str = url.substr(1);
strs = str.split('&');
for (var i = 0;i < strs.length; i++) {
theRequest[strs[i].split('=')[0]] = decodeURI(str[i].split(('=')[1]);
}
}
return theRequest;
}

获取指定参数名的值:

//获取url参数
function getQueryString(name){
let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
let r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
};
return null;
} var id = getQueryString("id") * 1;

图片转本地64:还是跨域的话,可能有些浏览器同一个图片地址只加载一次,你可以尝试转之前在图片链接后面加?v=1这种方式,跟服务器更新代码文件清缓存一个原理

var getBase64ByUrl = function(src, callback, outputFormat) {
var xhr = new XMLHttpRequest();
xhr.open('GET', src, true); xhr.responseType = 'arraybuffer'; xhr.onload = function(e) {
if (xhr.status == 200) {
var uInt8Array = new Uint8Array(xhr.response);
var i = uInt8Array.length;
var binaryString = new Array(i);
while (i--) {
binaryString[i] = String.fromCharCode(uInt8Array[i]);
}
var data = binaryString.join('');
var base64 = window.btoa(data);
var dataUrl = "data:" + (outputFormat || "image/png") + ";base64," + base64;
callback.call(this, dataUrl);
}
}; xhr.send();
} getBase64ByUrl("外链图片地址", function(url) {
$('.img').attr('src', url);
});

js获取url参数、图片转本地base64跨域问题的更多相关文章

  1. js获取url参数的方法

    js获取url参数的方法有很多. 1.正则分析 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...

  2. get方法与post方法的区别与js获取url参数的方式

    1.get方法与post方法的区别: 区别一:get重点在从服务器上获取资源,post重点在向服务器发送数据:区别二:get传输数据是通过URL请求,以field(字段)= value的形式,置于UR ...

  3. 为什么返回的数据前面有callback? ashx/json.ashx?的后面加 callback=? 起什么作用 js url?callback=xxx xxx的介绍 ajax 跨域请求时url参数添加callback=?会实现跨域问题

    为什么返回的数据前面有callback?   这是一个同学出现的问题,问到了我. 应该是这样的: 但问题是这样的: 我看了所请求的格式和后台要求的也是相同的.而且我也是这种做法,为什么他的就不行呢? ...

  4. .NET手记-JS获取Url参数

    最近为App做活动专区,其中很多活动都是采用html 5页面来制作的.一方面体量较小,制作快速,更新维护容易:另一方面,嵌入App后适配效果也不会很差. 这里我们采用混编形式来从native app传 ...

  5. js 获取url参数的值

    //获取url参数函数function GetQueryString(name){    var reg = new RegExp("(^|&)"+ name +" ...

  6. js获取url参数,操作url参数

    function getParam(key) { var tmp = location.search; tmp = decodeURIComponent(tmp); var index = tmp.i ...

  7. jquery或js 获取url参数

    <script type="text/javascript"> function getUrlParam(name) { var reg = new RegExp(&q ...

  8. js获取url参数的两种方法

    js获取参数,在以前我都是用正在去拆分,然后获取,这种方式感觉是最简单的 方式1: function QueryString(item) { var sValue=location.search.ma ...

  9. JS获取url参数及url编码、解码

    完整的URL由这几个部分构成:scheme://host:port/path?query#fragment ,各部分的取法如下: window.location.href:获取完整url的方法:,即s ...

随机推荐

  1. springboot实战开发全套教程,让开发像搭积木一样简单!Github星标已上10W+!

    前言 先说一下,这份教程在github上面星标已上10W,下面我会一一给大家举例出来全部内容,原链接后面我会发出来!首先我讲一下接下来我们会讲到的知识和技术,对比讲解了多种同类技术的使用手日区别,大家 ...

  2. 网络系列之 cookie增删改查(封装)

    什么是cookie 呢?简单来说,这个小东西,会记录你的 浏览器 浏览习惯,或 账号密码等, 以便于提高用户的体验感. 举个例子: 你们有没有发现,去淘宝一些购物网站, 你搜索了 椅子, 挑选了一会椅 ...

  3. 【电子取证:FTK Imager篇】DD、E01系统镜像仿真

    星河滚烫,人生有理想! ​ ---[suy999] DD.E01系统镜像动态仿真 (一)使用到的软件 1.FTK Imager (v4.5.0.3) 2.VMware Workstation 15 P ...

  4. [BUGCASE]CI框架的post方法对url做了防xss攻击的处理引发的文件编码错误

    一.问题描述 出现问题的链接: http://adm.apply.wechat.com/admin/index.php/order/detail?country=others&st=1& ...

  5. 【Go语言绘图】gg 库的基本使用

    最近接了个比较大的需求,需要做很多图片处理的事情,比如图片的旋转裁截拼接,各种渐变处理,文字排列,一开始光是想想就头疼.但没有办法,既然已经需求已经到手上了,那就得把它做好才行,于是便开始被迫营业,无 ...

  6. 如何使用Python 进行数据可视化

    微信公众号:码农充电站pro 个人主页:https://codeshellme.github.io 在进行数据分析的时候,经常需要将数据进行可视化,以方便我们对数据的认识和理解. 0,Matplotl ...

  7. 【Linux】Linux 资料大全(100% 纯干货)

    作者:李春港 出处:https://www.cnblogs.com/lcgbk/p/14071875.html 本文章给大家分享一些 Linux 学习资料,包含:社区网站.在线教程.命令大全.在线模拟 ...

  8. 基于FPGA的VGA显示实验设计

    基于FPGA的VGA显示实验设计 成果展示(优酷视频): 视频: 基于FPGA的VGA显示技术(手机控制) http://v.youku.com/v_show/id_XNjk4ODE3ODUy.htm ...

  9. [整理]qbxt集训10场考试 大 杂 烩 (后篇)

    前篇 Contest 6 A 两个数,第 \(i\) 轮从较大数(如果相等就是第一个)里减去 \(i\) ,问操作不能进行时两数分别为多少. 首先把大数减到和小数差不多,然后我们会发现接下来两数会轮流 ...

  10. Kafka速度为什么那么快

    记录一下 Kafka速度为什么那么快 Kafka的消息是保存或缓存在磁盘上的,一般认为在磁盘上读写数据是会降低性能的,因为寻址会比较消耗时间,但是实际上,Kafka的特性之一就是高吞吐率. 即使是普通 ...