IMWebConf 2017 官网彩蛋解谜
前言
IMWebConf 2017 ←这是官网
然后看到了这个:
所以就试了下,作为一个前端菜鸟,发现通关还挺简单的,不过每个方面的知识都涉及到一点,所以在这里总结一下。
下面进入正题。
第 0 关
就在这个页面打开控制台就能看到这个信息:
window.location.search.match(/imweb-magic-land/) == true
在Google搜索 window.location.search
,顺便打开控制台试一下 :
应该明白了吧?这个指的就是url后面带的参数,那么要为 true 的话,就在url后加上 ?imweb-magic-land
变成这样:http://2017.imweb.io/?imweb-m...
顺利进入下一关~!
第 1 关
打开上面的url,控制台输出了这样的信息:
这个简单,切换到Elements标签,然后搜索 portal
,可以看到一个id为 portal
的p标签:
这串数字就是进入下一关的参数啦~
不过直接在控制台输入 window.location.search = document.getElementById('portal').innerText
就可以自动跳转了~
第 2 关
这一关真的没难度,切换到 Application
选项卡,打开 localStorage
:
key = portal
的值就是下一关的参数了。
注意看最上面的一条数据,包含了当前页的位置信息,所以每次都会不同的哦,想直接到最后一关是不行的~
第 3 关
这一关就给了一条信息,只能试试看,切换到 Elements
标签,搜索一下导师姓名:
哈哈果然,拿到传送门,下一关~
第 4 关
这一关给了一串‘乱码’,不过熟悉的一看就知道这是中文经过Encode之后的样子。找一个解码的网站,输入这个字符串,得到信息:
果然~仍然切换到 Elements
标签,查找:
哈哈,下一关!
第 5 关
这一关仍然是这个套路,不过搜索之后发现怎么没有呢?不着急,看看 style
里(应该就在 Elements
下的右边)。先点击选中这个h3标签:
这样右边显示的就是当前元素的样式:
content
里的内容就是下一关的位置了
第 6 关
这一关的信息是两串数字,一看就是时间戳嘛。
直接转换成时间:
在 日程 > 性能 找到:
点击头像 5 下之后,控制台输出信息,下一关~
第 7 关
没有第 7 关了,到这里就结束了~
End.
后记
通过六关,拿到了三张优惠券,不过还是买不起哈哈哈。
说起来这个主要目的是宣传,所以没什么难度也是正常的,window.location.search
这个学习了,前段时间做实习项目,看到封装了一个函数可以拿到url后面的信息,还感觉很神奇,结果原来是这样子。
本文转载于:猿2048➤https://www.mk2048.com/blog/blog.php?id=ha0a1bkci1j
IMWebConf 2017 官网彩蛋解谜的更多相关文章
- 官网实例详解-目录和实例简介-keras学习笔记四
官网实例详解-目录和实例简介-keras学习笔记四 2018-06-11 10:36:18 wyx100 阅读数 4193更多 分类专栏: 人工智能 python 深度学习 keras 版权声明: ...
- PyCharm 2017 官网 下载 安装 设置 配置 (主题 字体 字号) 使用 入门 教程
一.安装 Python 3.6 首先,要安装好 Python 3.6.如果你还没有安装,可以参考咪博士之前的教程 Python 3.6.3 官网 下载 安装 测试 入门教程 (windows) 二.官 ...
- 怎么在官网下载jstl【配图详解】
JSTL(JSP Standard Tag Library,JSP标准标签库)是一个非常优秀的开源JSP标签库,如果要在系统使用JSTL标签,则必须将jstl.jar和 standard.jar文件放 ...
- Ubuntu16.04下Neo4j图数据库官网安装部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 说在前面的话 首先,查看下你的操作系统的版本. root@zhouls-virtual-machine:~# cat /etc/issue Ubuntu LTS \n \l r ...
- Ubuntu14.04下Neo4j图数据库官网安装部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 说在前面的话 首先,查看下你的操作系统的版本. root@zhouls-virtual-machine:~# cat /etc/issue Ubuntu 14.04.4 LTS ...
- Ubuntu14.04下Mongodb官网卸载部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 前期博客 Ubuntu14.04下Mongodb官网安装部署步骤(图文详解)(博主推荐) https://docs.mongodb.com/manual/tutorial/ins ...
- Ubuntu16.04下Mongodb官网卸载部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 前期博客 Ubuntu16.04下Mongodb官网安装部署步骤(图文详解)(博主推荐) https://docs.mongodb.com/manual/tutorial/ins ...
- Ubuntu14.04下Mongodb官网安装部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 在这篇博客里,我采用了非官网的安装步骤,来进行安装.走了弯路,同时,也是不建议.因为在大数据领域和实际生产里,还是要走正规的为好. Ubuntu14.04下Mongodb(离线安 ...
- Ubuntu16.04下Mongodb官网安装部署步骤(图文详解)(博主推荐)
不多说,直接上干货! 在这篇博客里,我采用了非官网的安装步骤,来进行安装.走了弯路,同时,也是不建议.因为在大数据领域和实际生产里,还是要走正规的为好. Ubuntu16.04下Mongodb(离线安 ...
随机推荐
- AntBlazor Theme in ABP Framework
介绍 ABP抽象了主题系统,将已有的UI更改到其他的UI框架非常简单,本文介绍了如何将主题切换为AntBlazor Theme. 源码以及示例在Gihub开源. Lsw.Abp.AntDesignUI ...
- 超简单的集成表达式树查询组件,Sy.ExpressionBuilder 使用说明
Sy.ExpressionBuilder是一套依赖于表达式树上的集成的查询组件.设计的初衷没别的,就为了少写代码,让查询业务可以变得更加模式化.目前可以从nuget 获取到该组件. 来到查询,查询实体 ...
- 手把手教你使用 Java 在线生成 pdf 文档
一.介绍 在实际的业务开发的时候,研发人员往往会碰到很多这样的一些场景,需要提供相关的电子凭证信息给用户,例如网银/支付宝/微信购物支付的电子发票.订单的库存打印单.各种电子签署合同等等,以方便用户查 ...
- 4. 堪比JMeter的.Net压测工具 - Crank 进阶篇 - 认识wrk、wrk2
目录 堪比JMeter的.Net压测工具 - Crank 入门篇 堪比JMeter的.Net压测工具 - Crank 进阶篇 - 认识yml 堪比JMeter的.Net压测工具 - Crank 进阶篇 ...
- DB门面-数据查询
1.1.1 查询所有数据 $selData = DB::table('article')->get(); 1.1.2 单条件查询 #DB::table('表名')->where('字段', ...
- jq全选、全不选、反选、单删、批量删除
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...
- LGP5430题解
新的 \(O(k+\log n)\) 做法. 考虑计算每个猴子对答案的贡献. 打个表: 1 1 2 4 8 16 32 ... 可以看出第 $ i $ 个猴子对答案的贡献是 \(i^k \times ...
- Net中事件的高级用法之三
1.事件的高级应用 使用事件可以解除代码耦合 2.事件高级应用实例 using System; using System.Collections.Generic; using System.Linq; ...
- VUE3 之 状态动画 - 这个系列的教程通俗易懂,适合新手
1. 概述 老话说的好:不用羡慕别人,每个人都有属于自己的人生道路,重要的是在前进道路上遇见阻碍时,如何去积极的面对并解决. 言归正传,今天我们来聊聊 VUE 的状态动画. 2. 状态动画 2.1 数 ...
- xss平台搭建
1. xss平台搭建 l 将xss平台源码放置在网站目录下 l 进入MySQL管理界面中的phpMyAdmin界面,新建一个XSS平台的数据库 l 修改XSS源码文件目录下的config.php中的数 ...