ps:mockjs在进行相同的双数次请求的时候,会出现请求404的状况,希望有大佬帮解决下

首先创建dom

<img id='bbn' src="" alt="图图">
<button id="but">asdsa</button>

在js中先写好mock

Mock.mock(/query/g,function(option){//拦截query请求
                return Mock.mock({
                        imgUrl: Mock.Random.dataImage('50x20', Mock.mock({'regexp': /\w{4}/}).regexp)
                });
});

在写点击事件

$('#but').on('click',function(){
           $.get('query',function(data){
                 var data = JSON.parse(data);
                  $('#bbn').attr('src',data.imgUrl);
           });
});

让初始化就有一个

$.get('query',function(data){
  var data = JSON.parse(data);
  $('#bbn').attr('src',data.imgUrl);
});

前端mockjs模拟图片验证码的更多相关文章

  1. 如何在vue-cli项目中结合mockjs模拟假数据

    1.前言 在如今前后端分离的开发方式已被广泛采用的今天,前端同学和后端同学各自独立开发,后端提供数据接口,前端调用接口获取数据渲染页面.但是在实际开发中,后端开发由于逻辑相对复杂接口迟迟提供不到位,而 ...

  2. Android-简单的图片验证码

    Android-图片验证码生成1.为啥要验证码?图片验证码在网络中使用的是比较普遍的.一般都是用来防止恶意破解密码.刷票.论坛灌水.刷页等.2.怎样的验证码比较好?验证码的获取方式无非就两种,一种是后 ...

  3. 从session实现机制分析模拟请求验证码的可行性(转)

    悲剧了,发现写完这篇blog没有配上这个格调超高的标题.   1.0问题背景 现在要实现一个带验证码网站的的自动登陆功能.验证码识别过程不再这篇文章的讨论之中.(之后有篇文章我会详细的总结验证码的识别 ...

  4. WebSite---前台系统图片验证码心得

    背景: 因为移动端APP和Msite手机注册发送短信验证码没有添加图片验证码功能.公司的短信接口被恶意刷取.所以我们就觉得在移动端添加一个图片验证码功能.分享一下大体实现方式思路.PS demo是自己 ...

  5. 纯JS实现图片验证码功能并兼容IE6-8

    最近要搞一个图片验证码功能,但是又不想自己写后台代码.于是自己准备搞一个纯前端的验证码功能,于是网上搜索了一下,找到一个插件gVerify.js,简单好用,实现完美.不过后面接到说要兼容IE8,想想也 ...

  6. 基于spring mvc的图片验证码实现

    本文实现基于spring mvc的图片验证码,分后台代码和前端页面的展现以及验证码的验证. 首看后台实现代码: @RequestMapping({"authCode"}) publ ...

  7. SpringBoot + Spring Security 学习笔记(三)实现图片验证码认证

    整体实现逻辑 前端在登录页面时,自动从后台获取最新的验证码图片 服务器接收获取生成验证码请求,生成验证码和对应的图片,图片响应回前端,验证码保存一份到服务器的 session 中 前端用户登录时携带当 ...

  8. 用Java实现图片验证码功能

    一.什么是图片验证码? 可以参考下面这张图: 我们在一些网站注册的时候,经常需要填写以上图片的信息. 1.图片生成实体类: package com.hexianwei.graphic; import ...

  9. 潭州课堂25班:Ph201805201 django 项目 第九课 图片验证码前台实现,判断用户是否注册功能实现 (课堂笔记)

    u胎代码实现 : 针对每一个 app 写个 js 脚本, 先给 users 的 app 应用创建个 js:在指定目录下的 js 文件夹下,创建 users 文件夹,下创建 suth.js ,图片验证 ...

随机推荐

  1. ionic3.0 alipay-base插件移除后会添加多余的链接文件在nodes-modules中,导致再安装其他插件或移除插件时报错问题

    1.报错截图: 2.如图因为nodes-module 文件夹中有多余的链接文件导致报错. 3.解决方法:将该链接文件删除即可.

  2. Rendering Problems The following classes could not be found:- android.support.v7.internal.app.WindowDecorActionBar (Fix Build Path, Create Class)

    如图出现如下的错误的时候,一般都是升级Androdi Studio 后导致的,引入库不全,或者其他 东西缺少 可以如下解决方案:

  3. 【记录】安装mysql Install/Remove of the Service Denied!错误的解决办法

    最近安装 Mysql 5.6版本,在安装的过程中出现Install/Remove of the Service Denied!错误!(本人Win10 系统) 出现此问题是由于当前用户权限不够,需要以管 ...

  4. 2018-8-10-WPF-DrawingVisual

    title author date CreateTime categories WPF DrawingVisual lindexi 2018-08-10 19:16:53 +0800 2018-2-1 ...

  5. Python3:_pickle使用方法

    常遇到的问题: python3使用pickle读取文件提示TypeError或者UnicodeDecodeError的解决办法 “ModuleNotFoundError: No module name ...

  6. groupby 技术

    分组键可以有很多形式,且类型不必相同: 1.列表或数组,其长度与待分组的轴一样 2.表示DataFrame某个列名的值 3.字典或Series,给出待分组轴上的值与分组名之间的对应关系 4.函数,用于 ...

  7. MySQL不支持事务处理的解决方法

    MySQL数据库默认的存储引擎类型是MyISAM,这种存储引擎类型不支持事务处理. 在MySQL中,只有InnoDB存储引擎类型的数据表才能支持事务处理. 因此,如果想让MySQL支持事务处理,只要将 ...

  8. mutable and immutable

    employees = ['Corey', 'John', 'Rick', 'Steve', 'Carl', 'Adam'] output = '<ul>\n' for employee ...

  9. Vulhub-漏洞环境的搭建

    安装Docker #安装pip curl -s https://bootstrap.pypa.io/get-pip.py | python3 #安装最新版docker curl -s https:// ...

  10. 「CTS2019 | CTSC2019」随机立方体 解题报告

    「CTS2019 | CTSC2019」随机立方体 据说这是签到题,但是我计数学的实在有点差,这里认真说一说. 我们先考虑一些事实 如果我们在位置\((x_0,y_0,z_0)\)钦定了一个极大数\( ...