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. 一文读懂MQTT协议

    1  概述 MQTT(Message Queuing Telemetry Transport,消息队列遥测传输协议),是一种基于发布/订阅(publish/subscribe)模式的"轻量级 ...

  2. 使用ReadStream方法读取文件事件传递过程

    const fs = require('fs'); let file = fs.createReadStream("filename.js"); file.on("ope ...

  3. 【Jquery】this和event.target的区别

    1.js中事件是会冒泡的,所以this是可以变化的,但event.target不会变化,它永远是直接接受事件的目标DOM元素: 2.this和event.target都是dom对象,如果要使用jque ...

  4. Django之template操作

    一.模板渲染的原理 (一)使用 模板渲染首先有一个模板对象Template,然后有一个上下文对象Context,通过render方法进行渲染,最后返回字符串,render方法的本质还是调用了HttpR ...

  5. webpack devServer配置项的坑

    本文所用webpack版本为4+,阅读本章的同学请注意区分. webpack默认不需要配置文件 但是你仍可在项目的node_module目录同级目录建立一个webpack.config.js文件进行配 ...

  6. 70. SequenceInputStream(文件合并)

    缓冲输入字节流:----------------------| InputStream 输入字节流的基类----------------| FileInputStream  读取文件的输入字节流--- ...

  7. Java中的List集合

    List集合继承自collection接口,他自己也是个接口,没有具体的结构,与Set集合不同,List集合允许重复的元素. List集合特有方法:(Collection中没有这些) 这些在Arral ...

  8. 源码方式安装 lrzsz库

    源码方式安装 lrzsz库:https://www.cnblogs.com/cocoajin/p/11731787.html 我们都知道安装了lrzsz工具的linux系统环境,在shell里可以非常 ...

  9. thinkphp整合后台模板

    将后台模板源码dist文件夹中的所有文件移动到thinkphp view index中 thinkphp的资源文件都不是从view文件夹下读取的 因此需要资源文件asset文件夹和demo文件夹放到t ...

  10. WebBug靶场基础篇 — 02

    本篇以第一人称记录这个关卡的第 1-5 关. 由于我记录的过程有点偏向于思考,所以截图截的多 = =!所以文章有点长... 下午一觉醒来,已经 4 点多了,然后开电脑,在虚拟机里,铺了铺靶场,但是毕竟 ...