xiaojincai
/
yrxinterview


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>猿人学面试</title>
    <link rel="stylesheet" href="css/index.css">
    <script src="js/axios.min.js"></script>
    <script src="js/vue.js"></script>
</head>
<style>
    .banner{
        margin: 16px auto;
    }
</style>
<body>
    <section id="app">
        <div style="background-color: #FDC606;box-shadow: 0px 0px 4px 0 rgba(0,0,0,.5);">
            <header>
                <div class="left_nav">
                    <img @click="show=!show" class="phone" width="30" src="img/menu.png" alt="">
                    <img class="logo" src="img/logo.png" alt="logo">
                </div>
                <div class="nav">
                    <a class="act" href="/index.html">主页</a>
                    <a href="https://match.yuanrenxue.cn/" target="_blank">爬虫逆向比赛</a>
                    <a href="https://match.yuanrenxue.cn/" target="_blank">采集进阶课程</a>
                    <a href="https://tool.yuanrenxue.cn/" target="_blank">采集分析工具</a>
                    <a href="https://appmatch.yuanrenxue.cn/" target="_blank">APP题目</a>
                    <a href="https://www.yuanrenxue.cn/" target="_blank">关于猿人学</a>
                </div>
                <div class="login">
                    <div class="pc">
                        <!-- <img width="30px" src="img/logo.jpg" alt="logo"> -->
                        <div v-if="userInfo" class="menu">
                            {{userInfo.name}}
                            <ul>
                                <li><a href="/record.html">我的刷题记录</a></li>
                                <li @click="logout"><a>退出登录</a></li>
                            </ul>
                        </div>
                        <a v-else href="/login.html">请先登录</a>
                    </div>
                    <div class="phone">
                        <span v-if="userInfo">{{userInfo.name}}</span>
                        <a v-else href="/login.html">请先登录</a>
                    </div>
                </div>
            </header>
        </div>
        <transition name="slide">
            <div class="slide" v-if="show">
                <a class="act" href="/index.html">主页</a>
                <a href="https://match.yuanrenxue.cn/" target="_blank">爬虫逆向比赛</a>
                <a href="https://match.yuanrenxue.cn/" target="_blank">采集进阶课程</a>
                <a href="https://tool.yuanrenxue.cn/" target="_blank">采集分析工具</a>
                <a href="https://appmatch.yuanrenxue.cn/" target="_blank">APP题目</a>
                <a href="https://www.yuanrenxue.cn/" target="_blank">关于猿人学</a>
                <a v-if="userInfo" href="/record.html">我的刷题记录</a>
                <a v-if="userInfo" @click="logout">退出登录</a>
            </div>
        </transition>
        <div class="content index" >
            <div class="left" >
                <div class="banner">
                    <img width="100%" height="100%" :src="img[0]" alt="">
                </div>
            </div>
            <div class="right">
                <div class="banner">
                    <img width="100%" height="100%" :src="img[1]" alt="">
                </div>
            </div>
            <div class="left" v-if="list.length>0">
                <div class="part">
                    <h1 class="title"><span>JS逆向面试题</span></h1>
                    <ul class="list">
                        <li v-for="item in list[0].list">
                            <div>
                                <a :href="'/detail.html?cat=js&id='+item.interviewId">{{item.name}}</a>
                            </div>
                        </li>
                    </ul>
                    <a href="/list.html?cat=js" class="more">更多JS逆向面试题</a>
                </div>
                <div class="part">
                    <h1 class="title"><span>安卓逆向面试题</span></h1>
                    <ul class="list">
                        <li v-for="item in list[1].list">
                            <div>
                                <a :href="'/detail.html?cat=android&id='+item.interviewId">{{item.name}}</a>
                            </div>
                        </li>
                    </ul>
                    <a href="/list.html?cat=android" class="more">更多安卓逆向面试题</a>
                </div>
                <div class="part">
                    <h1 class="title"><span>爬虫面试题</span></h1>
                    <ul class="list">
                        <li v-for="item in list[2].list">
                            <div>
                                <a :href="'/detail.html?cat=crawler&id='+item.interviewId">{{item.name}}</a>
                            </div>
                        </li>
                    </ul>
                    <a href="/list.html?cat=crawler" class="more">更多爬虫面试题</a>
                </div>
            </div>
            <div class="right">
                <div class="part">
                    <h2 class="sec_title"><span>面试排行榜</span>  <a href="">更多</a></h2>
                    <ul class="list list_100">
                        <li v-for="item in top"><a :href="'/record.html?cid='+item.cid">{{item.cname}}</a><span>{{item.count}}</span></li>
                    </ul>
                </div>
                <div class="part">
                    <h2 class="sec_title"><span>贡献面试题</span></h2>
                    <form class="form">
                        <input v-model="name" type="text" placeholder="面试题目">
                        <textarea v-model="content"></textarea>
                        <button type="button" @click="post">提交</button>
                    </form>
                </div>
            </div>
        </div>
        <footer>
            <ul>
                <li>
                    <b>爬虫比赛</b> <br>
                    <a href="https://appmatch.yuanrenxue.cn/"  target="_blank">APP题目</a>
                    <a href="https://match.yuanrenxue.cn/"  target="_blank">爬虫逆向比赛</a>
                    <a href="https://tool.yuanrenxue.cn/"  target="_blank">采集分析工具</a>
                </li>
                <li>
                    <b>爬虫课程</b> <br>
                    <a href="https://shop45147253.m.youzan.com/wscgoods/detail/2okabph85ypv1?banner_id=f.86209928~goods.2~1~rVebiaQ5&alg_id=0&slg=0&components_style_layout=0&reft=1744878857227&spm=f.86209928&sf=wx_sm"  target="_blank">爬虫逆向进阶课</a>
                    <a href="https://shop45147253.m.youzan.com/wscgoods/detail/2xli2kj7ku3a5zk?banner_id=f.86209928~goods.2~2~lWrtebiJ&alg_id=0&slg=0&components_style_layout=0&reft=1744878880491&spm=f.86209928&sf=wx_sm"  target="_blank">反爬&风控对抗课</a>
                    <a href="https://shop45147253.m.youzan.com/wscgoods/detail/361rmliyhfwr184?banner_id=f.86209928~goods.2~3~25r4gDL2&alg_id=0&slg=0&components_style_layout=0&reft=1744878921640&spm=f.86209928&sf=wx_sm"  target="_blank">0基础+爬虫逆向课</a>
                </li>
                <li>
                    <b>关于猿人学</b> <br>
                    <a href="https://www.yuanrenxue.cn/tricks"  target="_blank">Python技术杂谈</a>
                    <a href="https://www.yuanrenxue.cn/earn-money"  target="_blank">Python爬虫挣钱</a>
                </li>
                <li class="contact" style="display: flex;line-height: 30px;">
                    <img style="margin-right: 10px;" width="100" height="100" src="img/wx.jpg" alt="">
                    扫一扫加我微信 <br>
                    备注面试题 <br>
                    拉你进面试交流群
                </li>
            </ul>
            <p>成都老猿智能科技有限公司Copyright @ 2025 猿人学面试 蜀ICP备2022000052号-2</p>
        </footer>
    </section>
    <script src="js/public.js"></script>
    <script>
        const { createApp } = Vue;
        createApp({
            data() {
                return {
                    show:0,
                    list:[],
                    img:[],
                    top:[],
                    name:'',
                    content:'',
                    userInfo:{}
                }
            },
            created(){
                const userInfo = JSON.parse(localStorage.getItem('userInfo'));
                this.userInfo = userInfo;
                this.getData();
            },
            methods:{
                logout(){
                    localStorage.removeItem('userInfo');
                    localStorage.removeItem('token');
                    this.userInfo = null;
                },
                getData(){
                    axios.get(url+'/api/yrx/que/top').then(res=>{
                        this.list = res.data.data;
                    })
                    axios.get(url+'/api/yrx/banner/list?position=index_left').then(res=>{
                        this.img[0] = res.data.data[0].img;
                    })
                    axios.get(url+'/api/yrx/banner/list?position=index_right').then(res=>{
                        this.img[1] = res.data.data[0].img;
                    })
                    axios.get(url+'/api/yrx/que/user/top').then(res=>{
                        this.top = res.data.data;
                    })
                },
                post(){
                    const token = localStorage.getItem('token'); // 获取token
                    if(!token){
                        window.location.href="/login.html";
                        return;
                    }
                    if (!this.name || !this.content) {
                        alert('面试题目和内容不能为空');
                        return;
                    }
                    axios.post(url+'/api/yrx/que/user/post', { name: this.name, content: this.content }, {
                        headers: {
                            'Authorization': `${token}` // 添加token到header
                        }
                    })
                    .then(res => {
                        if(res.data.code === 0){
                            alert('提交成功');
                            this.name = '';
                            this.content = '';
                        }
                    })
                    .catch(err => {
                        alert('提交失败，请重试');
                        console.error(err);
                    });
                }
            }
        }).mount('#app');
    </script>
</body>
</html>