网站搭建-django-07-url

系统:Windows 7 语言版本:Anaconda3-4.3.0.1-Windows-x86_64 编辑器:pycharm-community-2016.3.2

  • 本系列介绍如何搭建一个网站,后端使用django框架
  • 已知一个静态网页,实现通过url访问

效果如下

Part 1:url设置逻辑

  1. 整个url分成2级,一级在整个项目的urls文件,一个在appurls中。这种方法其实为了方便后续的管理
  2. app里面的urls文件是手动创建的,具体内容如下
  3. url其实相当于索引,用户能够看到的内容来自于View

url两级设置

项目整体urls设置

from django.contrib import admin
from django.urls import path, re_path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    re_path(r'', include(('homepage.urls', 'xuexi'), namespace='xuexi')),
]

app中的urls文件

from django.urls import re_path, path

from .views import HomepageView

app_name = "homepage"

urlpatterns = [
    re_path('', HomepageView.as_view(), name='index'),
]

Part 2:View

  1. HomepageView是一个类,里面有一个get方法,在本示例中我们输入url后,实际上浏览器如何响应就是通过这个get函数实现的
  2. 也就是说前面一顿操作:url两级传递,View类,只是桥梁
  3. 这个get函数比较简单,就是返回homepage.html这个文件,当然也传递了一个参数去html文件
from django.shortcuts import render
from django.views.generic.base import View

# Create your views here.


class HomepageView(View):
    def get(self, request):
        paras = [1, 2, 3, 4]
        return render(request, 'homepage.html', {
            'paras': paras,
        })

Part 3:Html文件

  1. 对于前端文件,html,js,css,建议使用Visual Studio Code这个免费产品去查看,非常友好。
  2. 其实本示例中并没有使用到后端传的参数
<!DOCTYPE html>
{% load staticfiles %}
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
    <title>学习伙伴</title>

    <!--引入bootstrap-->
    <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.css' %}">

    <script src="{% static 'bootstrap/js/bootstrap.js'%}" type="text/javascript"></script>
    <script src="{% static 'bootstrap/js/bootstrap3-typeahead.js'%}" type="text/javascript"></script>


</head>
<body>
    <div class="row container-fluid " style="margin-top: 20px">
        <div class="col-md-12">
            <h5>Python工程师</h5>
            <div class="border border-top  border-success" style="height: 1px;margin-top: 10px; margin-bottom: 20px"></div>
            <div class="container-fluid font-weight-bold text-black">
                <div class="col-md-4">
                    <ul>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI4NjAxMjcyOQ==&mid=2247484029&idx=1&sn=2112fa57c48a50632e9a83a1d30a3899&chksm=ebe2262bdc95af3d3dda8e8d136cbf0de6f20c76d398125f0c5d70d821149ea3e5fc4abc8031&token=928421920&lang=zh_CN#rd" target="_blank">【目录】Python-入门</a></li>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI4NjAxMjcyOQ==&mid=2247484076&idx=1&sn=7312caaa36a168b0ac18942f6172f96f&chksm=ebe226fadc95afec967503a4a870cbb9540cf6ccd05279ce51ba7887df0ee7d697d1f3bb75d2#rd" target="_blank">【目录】Python-UI项目</a></li>
                    </ul>

                </div>
            </div>
        </div>
    </div>

    <div class="row container-fluid " style="margin-top: 20px">
        <div class="col-md-12">
            <h5>Excel高效办公之VBA</h5>
            <div class="border border-top  border-success" style="height: 1px;margin-top: 10px; margin-bottom: 20px"></div>
            <div class="container-fluid font-weight-bold text-black">
                <div class="col-md-4">
                    <ul>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI2NzM0MDk5NA==&mid=2247485168&idx=1&sn=7bb6caa39c0bc23be9606aa66f8d32d9&chksm=ea811b5dddf6924bf685c3b96b7d9960b4c3cbb0c0da8819a62a64ebba799468089be7cd2067#rd" target="_blank">【目录】VBA-学习路径图</a></li>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI2NzM0MDk5NA==&mid=2247485130&idx=1&sn=2f79d7467b75232cce28e2c8f3261746&chksm=ea811b67ddf6927134f840ae6556d4819b8437620045d37389bf8efe0021746f7d6105f40bd3&token=1009952806&lang=zh_CN#rd" target="_blank">【目录】VBA自动化走起来</a></li>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI2NzM0MDk5NA==&mid=2247485185&idx=1&sn=3200617751bfa11a83fadf7b47e367f9&chksm=ea811aacddf693baedbab4230381fbc307191e2213d80e536f7f9414d8f18ffae2fa1ba4714f&token=1009952806&lang=zh_CN#rd" target="_blank">【目录】数据库,UI界面一个少不了</a></li>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI2NzM0MDk5NA==&mid=2247485129&idx=1&sn=f492cb09b262558ae6f037937fe621aa&chksm=ea811b64ddf6927275ad37d7c10f944baf66129fa2e48d0b9eedde3c7c6777839f2865e014cb#rd" target="_blank">【目录】bat</a></li>
                        <li><a href="https://mp.weixin.qq.com/s?__biz=MzI2NzM0MDk5NA==&mid=2247484982&idx=1&sn=3e9da44f5acd36b0d165344535a66421&chksm=ea811b9bddf6928ddf9ecade27645a275c07d7deced783ba452fc3673dd796fd6915bcea76c8&token=1009952806&lang=zh_CN#rd" target="_blank">【目录】vbs</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</body>

</html>

html文件

Part 4:运行项目

  1. 如果你是首次运行,可能会提醒你,缺少一个库mysqlclient,安装上即可
  2. Terminal窗口输入python manage.py runserver 0.0.0.0:8000,就可以启动项目
  3. 这时候如果你的手机也是连接在家里面的网,你只要在手机中输入你电脑的IPcmd下输入ipconfig即可获取本机IP),加上端口号就可以访问这个网页,也就是所谓的局域网。
  4. 也就是说,如果你们公司有一个局域网,那么你就可以搭建自己的网站,大家都可以访问,是不是有点方便简单。

安装mysqlclient

项目启动

网站访问

小结:至此一个简单的局域网小网站就搭建完毕了,是不是很简单呢


本文分享自微信公众号 - Python工程师(DatenSpiel)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-07-15

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券