做个网站导航链接的小项目,每次输入网址、标题等一系列信息很麻烦。所以想通过只输入网址自动获取相关内容。
问题描述
通过输入一个网址,点击按钮后获取该网站的标题、描述内容和图标等信息。
最开始打算用vue前端实现功能,但是由于浏览器的同源策略限制,前端无法直接从其他网站获取这些元数据。
解决方案
通过java后端实现
1.添加依赖
<dependency>
<groupId>org.jsoup</groupId>
<artifactId>jsoup</artifactId>
<version>1.14.3</version>
</dependency>
2.Java代码
创建一个后端API接口,用于接收前端发送的网址,并获取网站的标题、描述内容和图标等数据。
/*
* 获取网址中数据,标题、描述内容、图标
* */
@GetMapping("/websiteinfo")
public AjaxResult getWebsiteInfo(String url) throws IOException {
/*使用Jsoup库的connect方法连接到指定的URL,并使用get方法获取网页的内容。它返回一个Document对象,表示整个HTML文档。*/
Document doc = Jsoup.connect(url).get();
/*获取网站元数据*/
String title = doc.title();
Element descriptionTag = doc.select("meta[name=description]").first();
String description = descriptionTag != null ? descriptionTag.attr("content") : "";
Element iconTag = doc.select("link[rel=icon], link[rel=shortcut icon]").first();
String iconLink = iconTag != null ? iconTag.attr("href") : "";
/*返回前端*/
Map<String, String> map = new HashMap<>();
map.put("title", title);
map.put("description", description);
map.put("iconLink", iconLink);
return AjaxResult.success(map);
}
最后将数据返回给前端接收即可,图标直接用的网址链接后面加/favicon.ico
实现。
最后附上实现效果图