某QMusic JS逆向

前言：

学习webpack

1、网站分析

背景

获取所有歌手，歌曲，歌词信息

获取思路

获取所有歌手 - > 所有歌手的歌

image-20231126211519710

在歌手查询页面，打开开发者调试工具，查询歌手名称，可以找到如图接口，对response进行分析，可以的到所有的歌手信息都在sigerlist中，

Yuki...大约 6 分钟

03-webpack-practice01

Webpack 练习专题 01

前言：

练习webpack 逆向

1、网站分析

网站YUhSMGNITTZMeTl6ZVc1amIyNW9kV0l1WTI5elkyOXphR2x3Y0dsdVp5NWpiMjB2eHV6aGlmeHV6aGlmDQo=

image-20231128004932272

通过分析可知，登陆请求需要以下参数

params = {
    "FECU": "8Lxcf5ADJ6bRiyAr0LR9yUX5DsYrSNA6a/skpauFFfZeSjbh2k0Fs4b45LvEqB1Ffk57xQ+XW215j0pG2AXuNogMmD551LWXPJlEy0hmjZMMTjZtJweKRHjFsIn6aTi+J6FmLll/zSff5z4mlniR19kcy5oPAgLeeOTNwIvp0c9NFqUBgYQfZC6DUT9hCCfL41"
}
data = {
    "username": "test",
    "password": "Iz1d05p7YI1+AY+xW+WLhnLBbmqpiC0tSA3gZ0VVwxyfS6gdZF0scjLPlZyd1nq1Fc22rBtGcCV1cBcA+jl4rqdDc4frW6NVqc5P6SG3+mhpARwDUGiuGz/SeuIj3mgs2aYu5x9p4KAhGj9zANg0MK2mcMAVNdiWcg0g1hZgy3YR2rwimJ40EYZJu4r8eLoV2ZiGRlk0aG6Ja7z1q2iFrrQYVdIb0ANaYf1MzFJc5gQa5ZUSbUgb07agCWhvAFx2jbM7LICBTSpV56IqN4+4pKMOuARdNsOLmlmPiEE0PeWDmM5hlchg+t3ChH5hutQJp0OGStszYIqaUOScEzvAMQ==",
    "captcha": "54645",
    "": ""
}

Yuki...大约 4 分钟

02-某qmusic逆向

某QMusic JS逆向

前言：

学习webpack

1、网站分析

背景

获取所有歌手，歌曲，歌词信息

获取思路

获取所有歌手 - > 所有歌手的歌

image-20231126211519710

在歌手查询页面，打开开发者调试工具，查询歌手名称，可以找到如图接口，对response进行分析，可以的到所有的歌手信息都在sigerlist中，

Yuki...大约 6 分钟

发起http请求

JS使用AJAX发起Http请求

前言：

在JS中没有发起Http请求的能力，所有我们需要引入代码片段让JS发起http请求，我们称这样的代码片段为——AJAX（Asynchronous JAvaScript by Xml ） AJAX借助 JS 中的一个内置对象：XMLHttpRequest，可简写为xhr

1、使用到对象XMLHttpRequest

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ajax 请求</title>
</head>
<body>

<script>
    <!-- js发送http请求 利用相应的代码片段-->
    var xhr=new XMLHttpRequest(); <!-- 初始化js中的内置对象XMLHttpRequest-->
    xmlhttp.onreadystatechange=function() // 执行成功后的回调函数
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
}
    xhr.open("post","/hhhhhhh");<!-- 提供HTTP请求的 方法和url-->
    xhr.send();<!-- 发起真正的请求-->
</script>
</body>
</html>

Yuki...大约 1 分钟

定位元素

js定位dom元素

1. 使用xpath定位

document.evaluate('xpath语法', document).iterateNext()
// 实例
document.evaluate('//h2[@class="text-title-big"]', document).iterateNext()

Yuki...小于 1 分钟

解析markdown文档并且代码高亮

前言：

安装如下包：

npm i marked
npm i highlight.js

Yuki...大约 2 分钟

README

前言

前端学习记录

记录前端学习的相关笔记

前端已学记录

HTMl
JS
CSS
React
Vue
Webpack
nodejs
...

下一步

Webpack
React
TailWind
Demo

Yuki...小于 1 分钟

扇贝单词逆向

前言：

由于想要获取一些单词信息，记录自己的单词学习记录。

1、分析网站

请求头分析

"authority": "apiv3.shanbay.com",
    "accept": "application/json, text/plain, */*",
    "accept-language": "zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7",
    "origin": "https://web.shanbay.com",
    "referer": "https://web.shanbay.com/",
    "sec-ch-ua": "\"Not.A/Brand\";v=\"8\", \"Chromium\";v=\"114\", \"Google Chrome\";v=\"114\"",
    "sec-ch-ua-mobile": "?0",
    "sec-ch-ua-platform": "\"Windows\"",
    "sec-fetch-dest": "empty",
    "sec-fetch-mode": "cors",
    "sec-fetch-site": "same-site",
    "user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36",
    "x-csrftoken": "4a08ae479d17443e5e68ef71613ff1be"

Yuki...大约 6 分钟

扇贝单词逆向

前言：

由于想要获取一些单词信息，记录自己的单词学习记录。

1、分析网站

请求头分析

"authority": "apiv3.shanbay.com",
    "accept": "application/json, text/plain, */*",
    "accept-language": "zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7",
    "origin": "https://web.shanbay.com",
    "referer": "https://web.shanbay.com/",
    "sec-ch-ua": "\"Not.A/Brand\";v=\"8\", \"Chromium\";v=\"114\", \"Google Chrome\";v=\"114\"",
    "sec-ch-ua-mobile": "?0",
    "sec-ch-ua-platform": "\"Windows\"",
    "sec-fetch-dest": "empty",
    "sec-fetch-mode": "cors",
    "sec-fetch-site": "same-site",
    "user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36",
    "x-csrftoken": "4a08ae479d17443e5e68ef71613ff1be"

Yuki...大约 6 分钟