在要求输入邮箱的文本域,请填写真实的邮件地址。非真实邮件地址,将收不到回复信息。

标签:javascript

JavaScript

JavaScript录音错误浏览器不支持getUserMedia

背景 新项目有一个新的需求,需要用到浏览器录音。在本地进行测试的时候并没有发现问题,部署以后访问就出现了如下错误: 浏览器不支持 getUserMedia 经过了解得知getUserMedia 是默认不支持 http 访问的,必须要用 https 协议且需要合法的域名。 解决方法 使用https协议访问 申请域名并配置SSL证书,实现HTTPS协议请求访问即可避免此问题 配置浏览器临时解决方案 打开谷歌浏览器,在地址栏中输入chrome://flags/#unsafely-treat-insecure-origin-as-secure后并回车可见如下内容: 将目标网站输入到Insecure origins treated as secure中,然后将Disabled下拉改为Enabled。使用此方法即可临时解决无法...

8个月前 (04-30) 1015℃ 0评论 0喜欢

Web前端

JS录音获取麦克风权限被拒绝访问

背景 因业务需求原因,需要在网页上进行录音,使用Javascript来进行操作,完成录音并保存上传到指定服务器。实现相关代码后进行测试,发现访问音频设备最后被拒绝。 原因 网页上反馈的异常信息如下图所示 经过再次的查看,确认未经处理的异常信息如下: DOMException: Permission denied by system 查下浏览器的设置,浏览器是否禁用麦克风,经过确认浏览器并没有发现什么问题。 浏览器各项检查都非常的正常,尝试录音错误依然再次出现,按道理来讲,应该是没有什么问题的。就目前情况而言,的确可能存在不讲道理的情况呀。随后更换一台电脑进行了一下测试,经过测试发现没有任何问题,正常录音。这就诡异了!也许是音频硬件原因?将这音频设备在其他电脑上进行再次确认,测试结果还是没有问题。这就让人郁闷了. ...

1年前 (2023-11-09) 1605℃ 0评论 0喜欢

Web前端

HTML5音频资源加载失败的处理方法

背景 页面加载很多音频标签,音频资源一些加载不成功,音频标签不可用,并且排除以下几种情况: 检查音频的链接是否有效 检查音频格式是否支持 检查网络连接是否通畅 如果确认以上内容没有任何问题,则是页面加载过多的音频资源而导致部分音频资源加载失败。可以使用JavaScript进行资源加载重试,当然重试的策略需要进行限制,避免无限制尝试。 实现方式 以下是使用JavaScript代码实现自动重新加载资源的一个简单的示例,当音频标签加载失败时,它会自动尝试重新加载音频: const audio = document.querySelector('audio'); audio.addEventListener('error', () => { audio.load(); }); 在上面示例中,首先选择了音频标签,并添加了一个...

1年前 (2023-07-16) 1520℃ 0评论 1喜欢

Web前端

Chrome浏览器中的XPath

背景 某一个应用自动在网页上获取一些文本内容,本来是通过document.querySelector来找指定节点。经过一段时间网页貌似升级了,一些节点的class属性的值会出现随机的变动,每次class属性的值都会不一样。最初的方式就失去了作用,根据节点内容的分析发现可以通过xpath来获取。曾经在IE浏览器上使用过XPath,并且API相当简单。在非IE浏览器上貌似没有这么好用。以下内容在Chrome浏览器进行尝试,经过测试可以完成自己的预期工作。 浏览器支持 Mozilla是根据DOM标准来实现对XPath的支持的。DOM Level 3附加标准DOM Level 3 XPath定义了用于在DOM中计算XPath表达式的接口。遗憾的是,这个标准要比微软直观的方式复杂得多。虽然有好多与XPath相关的对象,最重要的两个是:XPathEvaluator和XPathRes...

2年前 (2022-12-03) 1776℃ 0评论 16喜欢

JavaScript

Javascript判断当前页面是否处于激活状态

背景 现有一个考试项目,当在浏览器进行考试时需要判断用户是否存在切屏,如果切屏就对当前考试进行自动强制交卷。浏览器中可通过window对象的onblur、onfocus判断,或者document的hidden属性判断。 获取焦点(onfocus)和失去焦点(onblur) 关于是否失焦点,浏览器对象有onfocus 和 onblur事件可以监听。但是触发这两个事件的前提是页面之前是获取焦点的,就是说要是激活的。也就是说页面刚刚渲染完,用户在没有页面上任何操作时,页面是不会正常监听这两个事件的;或者页面在打开状态下,但是触发了onblur之后并无页面操作的情况下也不会正常监听这两个事件。直到,用户操作页面触发focus,之后离开页面才会触发blur,再次点击到当前页面时才会触发focus,如此反复都会触发相应的事件。 onblur 在chrome浏览器下,点击...

2年前 (2022-11-21) 3513℃ 0评论 5喜欢

IT相关

网站被恶意镜像的简单快速处理方法

背景 站点网上飘,哪有不挨刀。总是遇到千奇百怪的问题,让人猝不及防。在5月1日的前一天,发现博客被人镜像了,这是一个非常糟心的问题,我非常肯定的是这次的镜像不怀好意。为什么我会这么说呢?因为镜像站点域名太不像话了,太长了,有没有特殊的含义,所以我认为这种镜像网站是非常有恶意的。如下图: 镜像站点域名 JavaScript简单紧急处理 这种恶意的镜像站点无法绝对的杜绝,只能尽可能的减小影响。此次处理非常简单,直接使用Javascript对当前域名进行判断,与指定域名不符就跳转回指定的域名。 版本一 var local=window.location.host; if(local.indexOf("skyfinder.cc")==-1){ location.href = location.href.replace(local,"skyfinder....

4年前 (2021-05-02) 1005℃ 0评论 14喜欢

IT相关

网页被人恶意嵌入框架(iframe)的处理办法

背景 人生在世,都会遇到各种问题,就连写个博客也不得安宁。突然发现自己的博客被别人恶意的以框架(iframe/object)形式嵌入了, 这种网页被嵌入框架的情况很常见,只是这次是我罢了。其实我不太明白,为什么要选择个人博客嵌入。不管怎么样自己还是得做出点响应,要不然自己总是觉得缺了一些什么。 发现 这次发现也算一次偶然,突然想看看统计数据,所以就登录到了百度统计查看记录,结果就发现了一些比较奇怪的来源,所以就尝试访问看了看。大致如下: 打开来源后就晓得博客被人恶意嵌入了框架或者被恶意镜像了,经过查看网页代码,确认博客是被恶意嵌入了框架(iframe)。如下图: 观点 这是2008年开始在国内流行另一种流氓行为:使用框架(Frame),将你的网页嵌入它的网页中。只是现在改为了object,其实也是框架了。 其实用框...

5年前 (2020-06-24) 2311℃ 0评论 14喜欢

IT相关

莫名其妙的网站跳转

昨天19:50左右突然收到之前同事的一条微信消息,发来一个网址。点开网址之后呈现的是一个信息内容网站,之后跳转到一个时时彩的网站。当时直接就关掉了,随后就问下他是不是被盗了账号,是不是使用了自动清理微信好友的公众号!最后得知其也在帮朋友查找这个网站跳转的问题,故发给我看一下。 背景由来 被恶意跳转的网站 随后使用Chrome开发人员工具看了下网页加载,基本就确定是被注入了JavaScript代码,至于注入了什么地方就需要另行查证。在页面进行了相关的查证,并没有发现任何JavaScript的跳转代码。最后考虑外部文件,果然发现了恶意的跳转代码。如下图: 被插入的恶意跳转 发现被插入的代码以后,立即告知了他。他即刻进行了修改。强制刷新以后,问题不再出现。奈何几分钟后此问题再次复现,并且位置已经发生改变。这一定是被入侵或者是挂了马的,随后将推测告知并让其采用其他...

6年前 (2019-03-07) 1007℃ 0评论 0喜欢

其他分享

左右带有箭头的焦点图轮播

左右带有箭头的焦点图轮播 点击左右箭头可以实现图片切换效果。 右下角有图片切换页次。 jQuery实现此功能。 浏览器支持 IE浏览器支持此特效。 edge浏览器支持此特效。 谷歌浏览器支持此特效。 safria浏览器支持此特效。 opera浏览器支持此特效。 火狐浏览器支持此特效。 下载: 左右带有箭头的焦点图轮播     转载请注明:清风亦平凡 » 左右带有箭头的焦点图轮播 ...

6年前 (2018-12-13) 1189℃ 0评论 0喜欢

其他分享

全屏自适应焦点图轮播

全屏自适应焦点图轮播 实现了焦点图轮播效果。 焦点图轮播具有横向自适应功能。 浏览器支持: IE浏览器支持此特效。 谷歌浏览器支持此特效。 火狐浏览器支持此特效。 opera浏览器支持此特效。 safria浏览器支持此特效。   下载: 全屏自适应焦点图轮播   转载请注明:清风亦平凡 » 全屏自适应焦点图轮播 ...

6年前 (2018-12-11) 985℃ 0评论 0喜欢

IT相关

JSON Web Token 入门教程

SON Web Token(缩写 JWT)是目前最流行的跨域认证解决方案,本文介绍它的原理和用法。 一、跨域认证的问题 联网服务离不开用户认证。一般流程是下面这样。 1、用户向服务器发送用户名和密码。 2、服务器验证通过后,在当前对话(session)里面保存相关数据,比如用户角色、登录时间等等。 3、服务器向用户返回一个 session_id,写入用户的 Cookie。 4、用户随后的每一次请求,都会通过 Cookie,将 session_id 传回服务器。 5、服务器收到 session_id,找到前期保存的数据,由此得知用户的身份。 这种模式的问题在于,扩展性(scaling)不好。单机当然没有问题,如果是服务器集群,或者是跨域的服务导向架构,就要求 session 数据共享,每台服务器都能够读取 session。 举例来说,A 网站和 B 网站是同一家公司的关联服务。现在要求,用...

6年前 (2018-12-09) 1151℃ 0评论 0喜欢

其他分享

响应式焦点图轮播效果

响应式焦点图轮播效果: 实现了焦点图轮播效果。 根据屏幕大小的不同显示效果会不同。 jQuery实现此功能。 浏览器支持: IE浏览器支持此特效。 edge浏览器支持此特效。 谷歌浏览器支持此特效。 火狐浏览器支持此特效。 opera浏览器支持此特效。 safria浏览器支持此特效。   下载: 响应式焦点图轮播效果 转载请注明:清风亦平凡 » 响应式焦点图轮播效果 ...

6年前 (2018-12-05) 1077℃ 0评论 0喜欢

其他分享

“灰度”效果的js插件 GRAYSCALE.JS

grayscale.js 是一个实现网页元素 “灰度” 效果的js插件,可以运行在大多数的浏览器中,在 Mozilla Firefox 2/3, Safari4, IE6 / 7, Opera 9 中成功运行。 下载: grayscale.js   更多信息参考:https://j11y.io/javascript/grayscaling-in-non-ie-browsers/       转载请注明:清风亦平凡 » “灰度”效果的js插件 GRAYSCALE.JS ...

6年前 (2018-12-05) 1669℃ 0评论 2喜欢

JavaScript

js Date 操作之神奇的 date

Date 对象算是较常用的对象之一,但很多人完全不会操作,就算一些简单的操作也用 moment 而不自己尝试一下。本次分享下 Date 中的 date 使用技巧,希望能给大家启发。 MDN官网介绍 setDate()方法根据本地时间来指定一个日期对象的天数。如果 dayValue 超出了月份的合理范围,setDate 将会相应地更新 Date 对象。例如,如果为 dayValue 指定0,那么日期就会被设置为上个月的最后一天。 获取月份天数 // 获取月份天数 function getMonthDayCount(year, month) { return new Date(year, month, 0).getDate(); } console.log(getMonthDayCount(2017, 10)); // 31 Date 第三个参数的本质跟 setDate 是...

6年前 (2018-12-03) 1071℃ 0评论 3喜欢

JavaScript

JavaScript获取用户的DPI

在某些情况下,需要获得用户的DPI。以下方法是用JavaScript实现获取用户的DPI。 function getDPI() { var arrDPI = new Array; var devicePixelRatio = window.devicePixelRatio || 1; var tmpNode = document.createElement("DIV"); tmpNode.style.cssText = "height: 1in; left: -100%; position: absolute; top: -100%; width: 1in;"; document.body.appendChild(tmpNode); arrDPI[0] = parseInt(tmpNode.o...

9年前 (2016-07-02) 2499℃ 0评论 3喜欢