window.open() & iframe & tab

window.open() open pages in the same window / tab

https://stackoverflow.com/questions/8454510/open-url-in-same-window-and-in-same-tab

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/open

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/open#Syntax


autoOpenAlink(e) {
e.preventDefault();
let url = this.url;
window.open(url, "iframe 测试页面");
// window.open(url, "_self");
},

https://medium.com/the-metric/links-should-open-in-the-same-window-447da3ae59ba

https://www.runoob.com/jsref/met-win-open.html


bug

vue & qrcode

https://www.cnblogs.com/xgqfrms/p/10715627.html


https://github.com/soldair/node-qrcode#es6es7

https://www.npmjs.com/package/qrcode#es6es7


const QRCode = require("qrcode"); setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
let url = this.url;
QRCode.toCanvas(
canvas,
url,
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);

import QRCode from 'qrcode' // With promises
QRCode.toDataURL('I am a pony!')
.then(url => {
console.log(url)
})
.catch(err => {
console.error(err)
}) // With async/await
const generateQR = async text => {
try {
console.log(await QRCode.toDataURL(text))
} catch (err) {
console.error(err)
}
}

canvas

canvas width height

https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API

    setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
canvas.width = 100;
canvas.height = 100;
let url = this.url;
QRCode.toCanvas(
canvas,
url,
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);

https://stackoverflow.com/questions/4938346/canvas-width-and-height-in-html5

solution

https://github.com/soldair/node-qrcode#width

https://github.com/soldair/node-qrcode#options

    setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
// canvas.width = 100;
// canvas.height = 100;
// canvas.style.width = "100px";
// canvas.style.height = "100px";
let url = this.url;
QRCode.toCanvas(
canvas,
url,
{
width: 120,
},
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);

ok

window.open() & iframe & tab的更多相关文章

  1. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  2. window.open() & iframe

    window.open() & iframe https://www.w3schools.com/jsref/met_win_open.asp window.open(URL, name, s ...

  3. iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  4. window.frames && iframe 跨页面通信

    1.定义 frames[]是窗口中所有命名的框架组成的数组.这个数组的每个元素都是一个Window对象,对应于窗口中的一个框架. 2.用法 假设iframe 是一个以存在的 iframe 的 ID 和 ...

  5. js实现跨域(jsonp, iframe+window.name, iframe+window.domain, iframe+window.postMessage)

    一.浏览器同源策略 首先我们需要了解一下浏览器的同源策略,关于同源策略可以仔细看看知乎上的一个解释.传送门 总之:同协议,domain(或ip),同端口视为同一个域,一个域内的脚本仅仅具有本域内的权限 ...

  6. js 跨域复习 window.name | window.domain | iframe | Jsonp

    引起跨域的原因: 浏览器的同源策略,但是当你要发送请求的时候,出于安全性问题,浏览器有严格的要求,必须协议,域名,端口都相同,这个就是同源策略. 影响:a通过js脚本向b发送ajax请求,不同源就会报 ...

  7. window.frames[iframe].document 在ie可以用,在360、火狐中都不兼容?

    <iframe id="myf" scrolling="auto" frameborder="0" src="" ...

  8. 利用window.name+iframe跨域获取接口数据

    最近做了一个表单广告,需要从接口读取数据,做完发现谷歌火狐下正常,360兼容和IE浏览器无法获取数据,以下是鲜明的对比:      调试发现报错了: 然后开发把接口改成支持windowname,一开始 ...

  9. js控制父子页面传值(iframe和window.open)

    在html中,window对象代表浏览器中一个打开的窗口,就像我们C/S中做窗体一样,在该页的window对象就是new了一个新的窗体对象. 就像做C/S开发一样,浏览器是一个软件,每一个网页都是它n ...

随机推荐

  1. rabbitmq实现延时队列(死信队列)

    基于队列和基于消息的TTL TTL是time to live 的简称,顾名思义指的是消息的存活时间.rabbitMq可以从两种维度设置消息过期时间,分别是队列和消息本身. 队列消息过期时间-Per-Q ...

  2. Springboot 系列(九)使用 Spring JDBC 和 Druid 数据源监控

    前言 作为一名 Java 开发者,相信对 JDBC(Java Data Base Connectivity)是不会陌生的,JDBC作为 Java 基础内容,它提供了一种基准,据此可以构建更高级的工具和 ...

  3. vue实例的生命周期函数

    Vue的生命周期函数通常分为以下三类: ①实例创建时的生命周期函数:②实例执行时的生命周期的函数:③实例销毁时的生命周期的函数. 代码与注释详解: <!DOCTYPE html> < ...

  4. Ambiguous HTTP method Actions require an explicit HttpMethod binding for Swagger 2.0

    异常内容 NotSupportedException: Ambiguous HTTP method for action . Actions require an explicit HttpMetho ...

  5. jQuery(七)、效果和动画

    1 显示和隐藏 1.show([speed,[easing],[fn]]) 显示隐藏的匹配元素. 参数: (1) spend:三种预定速度之一的字符串('show','normal','fast')或 ...

  6. jQuery(三)、属性、CSS

    jQuery设置了很多为标签进行属性的操作,比如添加.删除. 一 .属性 1 attr(name | properties | [key, value | fn]) 设置或返回被选择的属性值. 参数: ...

  7. Java笔记(day7-day8)

    this关键字: (1)this(当局部变量和成员变量重名时,可以用关键字this区分)    this代表对象,当前对象       this就是所在函数所属对象的引用      简单来说,哪个对象 ...

  8. 人脸检测识别,人脸检测,人脸识别,离线检测,C#源码

    百度网盘地址 微云地址 使用虹软人工智能开放平台技术开发完成

  9. 将CSV文件写入MySQL

    先打开CSV文件查看第一行有哪些字段,然后新建数据库,新建表.(若字段内容很多建议类型text,如果设成char后续会报错) 命令如下: load data infile '路径XXXX.csv' i ...

  10. python之list和tuple

    https://www.cnblogs.com/evablogs/p/6691743.html list和tuple区别: 相同:均为有序集合 异同:list可变,tuple一旦初始化则不可变 lis ...