reqwest.js 从 api 获取数据(一)

1.编辑 views.py



在 views.py 中 增加一个 try_reqwest 方法,因为数据是在前端靠 reqwest.js 获取,所以这里的 context 为空 {}。

def try_reqwest(request):
    return render(request, 'try_reqwest.html', {})

2.分配 url



编辑 url.py,分配一个网址来展示 try_reqwest

……
# 从 view 中引入 try_reqwest 方法
from library.views import try_reqwest

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    ……
    # 给 try_reqwest 分配网址
    url(r'^try_reqwest', try_reqwest),
]

3.编写前端



编辑 templates 文件夹中的 try_reqwest.html:

<!DOCTYPE html>
<!-- 静态文件标签 -->
{% load staticfiles %}

<html>
    <head>
        <title>try_reqwest</title>
        <script type="text/javascript" src="{% static "js/reqwest.js" %}"></script>
    </head>

    <!-- verbatim 标签,表示该标签内的内容不是用django渲染 -->
    {% verbatim %}
    <body>
        <script type="text/javascript">
            var bookList = {};
            reqwest({
                url:'http://127.0.0.1:8000/api/book/',  // 请求的url
                type:"json",  // 请求的格式:json
                method:"get",  // 请求的方法:get
                // 请求成功或执行的方法,这里保存在bookList中
                success:function (resp) {
                    bookList = resp
                }
            })
        </script>
    </body>
    {% endverbatim %}

</html>

4.测试



打开:http://127.0.0.1:8000/try_reqwest , 点开 console 控制台,输入:bookList 试试:

说明成功从 api 中获取数据了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容