配置方面的东西在这里就不再赘述,请看之前的一篇文章,连接为:基于Django的Web端垃圾分类查询
获取数据的核心代码如下:
import json
import urllib.request
from urllib.parse import quote
def search(request):
keyword = request.GET.get('keyword')
get_length = request.GET.get('len')
get_type = request.GET.get('type')
data = {
"five": 0, "seven": 1, "head": 1, "tail": 2}
length = data[get_length]
type_ = data[get_type]
APIKEY = '588481dc94e6ddc00d10947d57aa8e91'
word_quote = quote(keyword)
url = f'http://api.tianapi.com/txapi/cangtoushi/index?key={APIKEY}&word={word_quote}&len={length}&type={type_}'
try:
r = urllib.request.Request(url=url)
req = urllib.request.urlopen(r)
content = req.read().decode('utf-8')
json_response = json.loads(content)
except Exception as e:
raise e
else:
if json_response['code'] == 200 and (json_response['newslist'] is not None):
news_list = json_response['newslist']
elif json_response['code'] == 200 and (json_response['newslist'] is None):
empty_data = '未搜索到数据!请修改关键词!'
else:
error = '暂时不能搜索,请稍后再试!'
return render(request, 'testapp/search.html', locals())
首页的 html 代码如下:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.3/css/bootstrap.min.css" rel="stylesheet">
head>
<body>
<div class="container">
<p class="h2">藏头诗p>
<form class="form-inline" action="{% url 'testapp:search' %}" method="get">
{% csrf_token %}
关键词(4-8 字):<input class="form-control" type="text" name="keyword" required>
<select class="form-control" name="len">
<option value="five">五言律诗option>
<option value="seven">七言律诗option>
select>
<select class="form-control" name="type">
<option value="head">藏头option>
<option value="tail">藏尾option>
select>
<input class="btn btn-light" type="submit" value="Submit">
form>
div>
body>
html>
web 端界面如下图,支持 4-8 字,五言和七言律诗,藏头和藏尾:
搜索结果 html 代码如下:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.3/css/bootstrap.min.css" rel="stylesheet">
head>
<body>
<div class="container">
<p class="h2">藏头诗p>
<form class="form-inline" action="{% url 'testapp:search' %}" method="get">
{% csrf_token %}
关键词(4-8 字):<input class="form-control" type="text" name="keyword" required>
<select class="form-control" name="len">
<option value="five">五言律诗option>
<option value="seven">七言律诗option>
select>
<select class="form-control" name="type">
<option value="head">藏头option>
<option value="tail">藏尾option>
select>
<input class="btn btn-light" type="submit" value="Submit">
form>
<br>
<p class="font-weight-bold">结果如下:p>
<ul class="list-group">
{% for i in news_list %}
<li class="list-group-item">示例:{
{ i.list }}li>
{% endfor %}
ul>
<br>
<p><a class="text-muted" href="{% url 'testapp:index' %}">backa>p>
div>
body>
html>
web 端界面如下:
具体的过程并不复杂,API 使用的是天行数据,web 端界面优化使用的是 bootstrap。