首页 > 其他分享 >100_实战：京东搜索

100_实战：京东搜索

时间：2022-10-27 16:55:21浏览次数：59  
标签：实战 js 获取数据 编写 100 解析 京东 ES 页面

目录

效果图

image.png
image.png

项目搭建

创建模块

image.png
image.png
image.png
image.png
image.png

自定义ES依赖版本

image.png

添加依赖 com.alibaba.fastjson

image.png

删除多余的文件

image.png
image.png

配置 application.properties

image.png

拷贝基本静态文件 css js images

image.png

拷贝页面 index.html

image.png

编写IndexController

image.png

启动项目

image.png

访问主页

image.png

爬取数据

image.png
:::info
爬取数据：获取请求返回的页面信息，筛选出想要的数据就可以了
:::

导入依赖 jsoup 解析网页

image.png

编写页面解析工具类

分析页面

image.png
image.png
image.png
image.png
image.png
:::info
这些图片特别多的网站，图片都是懒加载的，先加载JD这种统一图片，再渲染本身图片，所以src不是真正的图片url，source-data-lazy-img才是真正的图片url
:::
image.png
image.png
image.png

测试解析方法

image.png
image.png
image.png
image.png

编写实体类

image.png

提取解析方法并测试

:::info
注意：new URL()这样写不支持中文，如果用中文，使用new URL()重载的方法或其他
:::
image.png
image.png
image.png
image.png

编写页面解析工具类

image.png
image.png

业务代码编写

ES配置类 ElasticSearchClientConfig

image.png

创建索引 jd_goods 使用代码或工具都可以

image.png

Service：解析页面将数据放入ES索引中

image.png

Controller：解析页面将数据放入ES索引中

image.png

测试接口

image.png
image.png
image.png
image.png

Service：从ES获取数据实现搜索功能

image.png
image.png

Controller：从ES获取数据实现搜索功能

image.png

测试接口

image.png

前端代码编写

npm安装模块 vue axios

image.png
image.png

拷贝js到/static/js下 axios.min.js vue.min.jsimage.png

image.png
image.png

index.html使用vue

image.png
image.png
image.png
image.png
image.png
image.png

测试

image.png

关键字高亮实现

Service：从ES获取数据实现关键字高亮

image.png
image.png
image.png

Controller：从ES获取数据实现关键字高亮

image.png

前端实现

image.png

测试

image.png

标签：实战,js,获取数据,编写,100,解析,京东,ES,页面
From： https://www.cnblogs.com/wl3pb/p/16832842.html

相关文章

  • PAT_甲级_1004 Counting Leaves (30分) (C++)
    目录​​1，题目描述​​​​题目大意​​​​输入：​​​​输出：​​​​2，解题思路​​​​关键：​​​​存储结构：​​​​dfs算法实现：​​​​3，代码【C++】​​1，题目描述 Samp......
  • koa实战
    项目初始化//初始化项目，生成package.jsonnpminit指定入口文件main.js项目的基础搭建创建src工作目录创建main.js主入口文件在main.js中引入koacon......
  • 牛逼！“京东热” 框架 JD-hotkey 开源了...单机 QPS 可达 37 万！！
    JD-hotkey是京东APP后台热数据探测框架，历经多次高压压测和2020年京东618大促考验。在上线运行的这段时间内，每天探测的key数量数十亿计，精准捕获了大量爬虫、刷子用......
  • 京东云开发者｜探寻软件架构的本质，到底什么是架构？
    不论是开发人员还是架构师，我们都一直在跟软件系统打交道，架构是在工作中出现最频繁的术语之一。那么，到底什么是架构？你可能有自己的答案，也有可能没有答案。对“架构”的理解......
  • Go配置文件绑定到结构体实战演示
    说明在实际的开发过程中，我们必然会用到MySQL、Redis等这样的服务。为了实现系统的配置化，我们会把一些配置信息单独放在一些文件中，使用到的地方直接读取配置文件即可。常见......
  • Python7-实战
    实战01（修改手机默认语言）1classPhone:2'''手机类'''3def__init__(self,language='英文'):4iflanguage=='英文':5print("智能手......
  • 机器学习实战：决策树-隐形眼镜类型
    输出结果model:{‘tearRate’:{‘reduced’:‘nolenses’,‘normal’:{‘astigmatic’:{‘yes’:{‘prescript’:{‘hyper’:{‘age’:{‘presbyopic’:‘nole......
  • 机器学习实战：决策树-是否有鱼
    输出结果model:{‘nosurfacing’:{0:‘no’,1:{‘flippers’:{0:‘no’,1:‘yes’}}}}predict:[1,1]yes代码"""@author:lishihang@software:PyCharm@file:i......
  • 机器学习实战：knn海伦约会
    importnumpyasnpimportpandasaspdimportmatplotlib.pyplotaspltimportcopydefautoNorm(x):"""最大值最小值归一化:paramx:需要归一化的特征向量......
  • SpringCloud微服务实战——搭建企业级开发框架（四十七）：【移动开发】整合uni-app搭建移动
      uni-app自带uni.request用于网络请求，因为我们需要自定义拦截器等功能，也是为了和我们后台管理保持统一，这里我们使用比较流行且功能更强大的axios来实现网络请求。  A......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99