{"id":49303,"date":"2023-02-23T04:57:25","date_gmt":"2024-01-04T01:56:59","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/"},"modified":"2024-04-29T15:52:29","modified_gmt":"2024-04-29T07:52:29","slug":"%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/","title":{"rendered":"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206"},"content":{"rendered":"<p>\u7531\u4e8e\u6211\u6b63\u5728\u4f7f\u7528Python\u7f16\u5199\u7684Web\u5e94\u7528\u7a0b\u5e8f\uff0c\u524d\u7aef\u90e8\u5206\u4f3c\u4e4e\u4e5f\u5373\u5c06\u5f00\u59cb\u8fd0\u8f6c\uff0c\u56e0\u6b64\u6211\u5c1d\u8bd5\u7528Django\u6765\u642d\u5efa\u4e00\u4e2a\u53ef\u89c1\u7684\u73af\u5883\u3002<\/p>\n<h2>\u529e\u516c\u73af\u5883<\/h2>\n<p>MacBookAir \uff08M1\uff09<\/p>\n<p>Python\u7248\u672c\uff1a3.10.8<br \/>\nDjango\u7248\u672c\uff1a4.1.7<\/p>\n<h3>\u524d\u63d0<\/h3>\n<p>\u5f53\u7136\u5305\u62ecPython\uff0c\u524d\u63d0\u662f\u8fd8\u6709Django\u4e5f\u5df2\u5b89\u88c5\u8fdb\u6765\u3002<\/p>\n<p>\u786e\u8ba4\u65b9\u6cd5\u5728\u8fd9\u91cc\u3002<\/p>\n<pre class=\"post-pre\"><code>\/\/ Python\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u78ba\u8a8d\r\npython --version\r\nPython 3.10.8\r\n\r\n\/\/ Django\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u78ba\u8a8d\r\npython\r\n&gt;&gt;&gt; import django\r\n&gt;&gt;&gt; django.get_version()\r\n'4.1.7'\r\n&gt;&gt;&gt; exit()\r\n<\/code><\/pre>\n<p>\u5982\u679c\u6ca1\u6709\u5b89\u88c5Django\uff0c\u5219\u53ef\u4ee5\u901a\u8fc7pip install django\u6765\u8fdb\u884c\u5b89\u88c5\u3002<\/p>\n<h2>\u642d\u5efaDjango\u7684\u5f00\u53d1\u73af\u5883<\/h2>\n<p>\u6211\u5011\u5c07\u6e96\u5099\u958b\u767c\u4eba\u54e1\u7684\u76ee\u9304\u3002<\/p>\n<pre class=\"post-pre\"><code>django-admin startproject \u3053\u3053\u306b\u4f5c\u308a\u305f\u3044PJ\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u540d\r\n<\/code><\/pre>\n<p>\u8fd9\u6b21\u6211\u4eec\u5c06\u4ee5\u540d\u4e3ahoge\u7684\u540d\u79f0\u521b\u5efa\uff0c\u6240\u4ee5\u6267\u884c\u547d\u4ee4django-admin startproject hoge\u3002<\/p>\n<p>\u5e94\u8be5\u4f1a\u521b\u5efa\u76ee\u5f55\u548c\u4e00\u4e9b\u6587\u4ef6\u3002<br \/>\n\u6211\u4eec\u5c06\u8fdb\u5165\u4f7f\u7528cd hoge\u521b\u5efa\u7684\u76ee\u5f55\u4e2d\u3002<\/p>\n<pre class=\"post-pre\"><code>cd hoge\r\npython manage.py runserver\r\n\r\nWatching for file changes with StatReloader\r\nPerforming system checks...\r\n\r\nSystem check identified no issues (0 silenced).\r\n\r\nYou have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.\r\nRun 'python manage.py migrate' to apply them.\r\nMarch 22, 2023 - 08:03:56\r\nDjango version 4.1.7, using settings 'hoge.settings'\r\nStarting development server at http:\/\/127.0.0.1:8000\/\r\nQuit the server with CONTROL-C.\r\n<\/code><\/pre>\n<p>\u6267\u884cpython manage.py runserver\u540e\uff0c\u4f1a\u51fa\u73b0\u4e00\u5927\u4e32\u7c7b\u4f3c\u4e0a\u9762\u7684\u5185\u5bb9\uff0c\u5f53\u8bbf\u95eehttp:\/\/127.0.0.1:8000\/\u65f6\uff0c\u53ef\u4ee5\u786e\u8ba4\u672c\u5730\u73af\u5883\u3002<\/p>\n<p>\u53ea\u8981\u5b58\u50a8favicon\u56fe\u6807\uff0c\u5c31\u80fd\u6d88\u9664\u7ec8\u7aef\u4e0a\u51fa\u73b0\u7684\u8bf8\u5982&#8221;GET \/favicon.ico HTTP\/1.1&#8243; 404 2110\u4e4b\u7c7b\u7684\u4fe1\u606f\u3002<\/p>\n<h2>\u8bbe\u5b9a\u5468\u56f4<\/h2>\n<h3>\u8bbe\u7f6e.py<\/h3>\n<h3>\u5c06\u8bed\u8a00\u8bbe\u7f6e\u66f4\u6539\u4e3a\u65e5\u672c\u8bed\u3002<\/h3>\n<pre class=\"post-pre\"><code><span class=\"hdl\"><span class=\"o\">- <\/span><span class=\"n\">LANGUAGE_CODE<\/span> <span class=\"o\">=<\/span> <span class=\"sh\">'<\/span><span class=\"s\">en-us<\/span><span class=\"sh\">'<\/span>\r\n<\/span><span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"n\">LANGUAGE_CODE<\/span> <span class=\"o\">=<\/span> <span class=\"sh\">'<\/span><span class=\"s\">ja<\/span><span class=\"sh\">'<\/span>\r\n<\/span>\r\n<span class=\"hdl\"><span class=\"o\">- <\/span><span class=\"n\">TIME_ZONE<\/span> <span class=\"o\">=<\/span> <span class=\"sh\">'<\/span><span class=\"s\">UTC<\/span><span class=\"sh\">'<\/span>\r\n<\/span><span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"n\">TIME_ZONE<\/span> <span class=\"o\">=<\/span> <span class=\"sh\">'<\/span><span class=\"s\">Asia\/Tokyo<\/span><span class=\"sh\">'<\/span>\r\n<\/span><\/code><\/pre>\n<h3>\u5982\u679c\u4f7f\u7528\u6a21\u677f\uff0c\u8fd9\u8fb9\u4e5f\u8981\u8fdb\u884c\u8bbe\u7f6e\u3002<\/h3>\n<p>&#8211; \u9700\u8981\u5b8c\u6210\u7684\u4e8b\u60c5 de<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u6dfb\u52a0\u4e00\u4e2a\u540d\u4e3a&#8221;hoge\/template\/&#8221;\u7684\u76ee\u5f55\u6765\u5b58\u653e\u4f5c\u4e3a\u6a21\u677f\u7684HTML\u6587\u4ef6\u3002<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u6dfb\u52a0\u4e00\u4e2a\u540d\u4e3a&#8221;hoge\/static\/&#8221;\u7684\u76ee\u5f55\u6765\u5b58\u653eCSS\u3001JS\u7b49\u8d44\u6e90\u6587\u4ef6\u3002<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\u5728Python\u4e2d\u5199\u5165\u4ee5\u4e0b\u5185\u5bb9\uff1a<\/ol>\n<pre class=\"post-pre\"><code><span class=\"kn\">from<\/span> <span class=\"n\">pathlib<\/span> <span class=\"kn\">import<\/span> <span class=\"n\">Path<\/span>\r\n<span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"kn\">import<\/span> <span class=\"n\">os<\/span>\r\n<\/span>\r\n<span class=\"o\">~~<\/span> <span class=\"n\">\u7701\u7565<\/span> <span class=\"o\">~~<\/span>\r\n\r\n<span class=\"n\">TEMPLATES<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[<\/span>\r\n    <span class=\"p\">{<\/span>\r\n        <span class=\"sh\">'<\/span><span class=\"s\">BACKEND<\/span><span class=\"sh\">'<\/span><span class=\"p\">:<\/span> <span class=\"sh\">'<\/span><span class=\"s\">django.template.backends.django.DjangoTemplates<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span>\r\n        <span class=\"sh\">'<\/span><span class=\"s\">DIRS<\/span><span class=\"sh\">'<\/span><span class=\"p\">:<\/span> <span class=\"p\">[<\/span>\r\n<span class=\"hil\"><span class=\"o\">+ <\/span>          <span class=\"n\">os<\/span><span class=\"p\">.<\/span><span class=\"n\">path<\/span><span class=\"p\">.<\/span><span class=\"nf\">join<\/span><span class=\"p\">(<\/span><span class=\"n\">BASE_DIR<\/span><span class=\"p\">,<\/span> <span class=\"sh\">'<\/span><span class=\"s\">frontend\/dist<\/span><span class=\"sh\">'<\/span><span class=\"p\">),<\/span>\r\n<\/span>        <span class=\"p\">],<\/span>\r\n        <span class=\"sh\">'<\/span><span class=\"s\">APP_DIRS<\/span><span class=\"sh\">'<\/span><span class=\"p\">:<\/span> <span class=\"bp\">True<\/span><span class=\"p\">,<\/span>\r\n        <span class=\"sh\">'<\/span><span class=\"s\">OPTIONS<\/span><span class=\"sh\">'<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\r\n            <span class=\"sh\">'<\/span><span class=\"s\">context_processors<\/span><span class=\"sh\">'<\/span><span class=\"p\">:<\/span> <span class=\"p\">[<\/span>\r\n                <span class=\"sh\">'<\/span><span class=\"s\">django.template.context_processors.debug<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span>\r\n                <span class=\"sh\">'<\/span><span class=\"s\">django.template.context_processors.request<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span>\r\n                <span class=\"sh\">'<\/span><span class=\"s\">django.contrib.auth.context_processors.auth<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span>\r\n                <span class=\"sh\">'<\/span><span class=\"s\">django.contrib.messages.context_processors.messages<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span>\r\n            <span class=\"p\">],<\/span>\r\n        <span class=\"p\">},<\/span>\r\n    <span class=\"p\">},<\/span>\r\n<span class=\"p\">]<\/span>\r\n\r\n<span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"n\">STATICFILES_DIRS<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[<\/span>\r\n<\/span><span class=\"hil\"><span class=\"o\">+ <\/span>   <span class=\"n\">os<\/span><span class=\"p\">.<\/span><span class=\"n\">path<\/span><span class=\"p\">.<\/span><span class=\"nf\">join<\/span><span class=\"p\">(<\/span><span class=\"n\">BASE_DIR<\/span><span class=\"p\">,<\/span> <span class=\"sh\">\"<\/span><span class=\"s\">frontend\/static<\/span><span class=\"sh\">\"<\/span><span class=\"p\">),<\/span>\r\n<\/span><span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"p\">]<\/span>\r\n<\/span><\/code><\/pre>\n<p>\u5728DIRS\u4e2d\uff0c\u5199\u5165\u57fa\u672c\u6a21\u677f\u7684\u8def\u5f84\u3002\uff08\u7528\u4e8eHTML\u7684\u663e\u793a\u8bbe\u7f6e\uff09<br \/>\n\u5728STATICFILES_DIRS\u4e2d\uff0c\u5199\u5165\u5b58\u653e\u5916\u90e8\u52a0\u8f7d\u7684CSS\/JS\/\u56fe\u50cf\u7b49\u6587\u4ef6\u7684\u76ee\u5f55\uff0c\u4e0e\u6a21\u677f\u6587\u4ef6\u5206\u5f00\u3002<\/p>\n<p>\u7531\u4e8eBASE_DIR\u662fDjango\u6267\u884cmanage.py\u7684\u4f4d\u7f6e\uff08\u6700\u9876\u5c42\uff09\uff0c\u6700\u597d\u4e0d\u8981\u66f4\u6539\u3002<\/p>\n<h2>\u663e\u793a\u65b0\u9875\u9762\u3002<\/h2>\n<p>\u56e0\u4e3a\u6dfb\u52a0\u4e86\u6a21\u677f\uff0c\u6240\u4ee5\u8981\u5c55\u793a\u65b0\u9875\u9762\u3002<\/p>\n<h3>\u51c6\u5907index.html\u6587\u4ef6\u3002<\/h3>\n<p>\u521b\u5efa hoge\/frontend\/dist\/index.html \u6587\u4ef6\u3002<\/p>\n<p>\u53ea\u9700\u8981\u663e\u793ah1\u6807\u7b7e\u5c31\u53ef\u4ee5\u4e86\uff0c\u6240\u4ee5\u4e0d\u9700\u8981\u8bbe\u7f6eCSS\u7b49\u5185\u5bb9\u3002\u53ea\u9700\u51c6\u5907head\u548cbody\u6807\u7b7e\u3002<\/p>\n<h3>\u51c6\u5907env.py<\/h3>\n<p>\u63a5\u4e0b\u6765\uff0c\u6211\u4eec\u5c06\u51c6\u5907\u4e00\u4e2a\u7f16\u5199Python\u6587\u4ef6\u7684\u8bbe\u7f6e\uff0c\u4ee5\u663e\u793a\u6a21\u677f\u3002<\/p>\n<p>\u521b\u5efahoge\/hoge\/env.py\u3002<br \/>\n\u8fd9\u6b21\u5148\u6682\u65f6\u5c06\u5176\u547d\u540d\u4e3aenv\u3002<\/p>\n<pre class=\"post-pre\"><code><span class=\"kn\">from<\/span> <span class=\"n\">django.shortcuts<\/span> <span class=\"kn\">import<\/span> <span class=\"n\">render<\/span>\r\n\r\n<span class=\"k\">def<\/span> <span class=\"nf\">top<\/span><span class=\"p\">(<\/span><span class=\"n\">request<\/span><span class=\"p\">):<\/span>\r\n    <span class=\"k\">return<\/span> <span class=\"nf\">render<\/span><span class=\"p\">(<\/span><span class=\"n\">request<\/span><span class=\"p\">,<\/span> <span class=\"sh\">'<\/span><span class=\"s\">index.html<\/span><span class=\"sh\">'<\/span><span class=\"p\">)<\/span>\r\n<\/code><\/pre>\n<p>\u4e3a\u8c03\u7528template\uff0c\u4f7f\u7528render\u51fd\u6570\u3002<br \/>\n\u6ce8\u610f\uff0crender\u51fd\u6570\u5fc5\u987b\u4f7f\u7528django.shortcuts\u624d\u80fd\u4f7f\u7528\u3002<\/p>\n<p>\u5c06\u5b58\u653e\u5728template\u76ee\u5f55\u4e2d\u7684index.html\u6587\u4ef6\u653e\u7f6e\u3002<\/p>\n<h2>\u5728urls.py\u4e2d\u5c06\u8def\u5f84\u6307\u5411\u65b0\u9875\u9762\u3002<\/h2>\n<pre class=\"post-pre\"><code><span class=\"kn\">from<\/span> <span class=\"n\">django.contrib<\/span> <span class=\"kn\">import<\/span> <span class=\"n\">admin<\/span>\r\n<span class=\"kn\">from<\/span> <span class=\"n\">django.urls<\/span> <span class=\"kn\">import<\/span> <span class=\"n\">path<\/span>\r\n<span class=\"hil\"><span class=\"o\">+ <\/span><span class=\"kn\">from<\/span> <span class=\"n\">.<\/span> <span class=\"kn\">import<\/span> <span class=\"n\">env<\/span>\r\n<\/span>\r\n<span class=\"n\">urlpatterns<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[<\/span>\r\n    <span class=\"nf\">path<\/span><span class=\"p\">(<\/span><span class=\"sh\">'<\/span><span class=\"s\">admin\/<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span> <span class=\"n\">admin<\/span><span class=\"p\">.<\/span><span class=\"n\">site<\/span><span class=\"p\">.<\/span><span class=\"n\">urls<\/span><span class=\"p\">),<\/span>\r\n<span class=\"hil\"><span class=\"o\">+ <\/span>  <span class=\"nf\">path<\/span><span class=\"p\">(<\/span><span class=\"sh\">'<\/span><span class=\"s\">top\/<\/span><span class=\"sh\">'<\/span><span class=\"p\">,<\/span> <span class=\"n\">env<\/span><span class=\"p\">.<\/span><span class=\"n\">top<\/span><span class=\"p\">,<\/span> <span class=\"n\">name<\/span><span class=\"o\">=<\/span><span class=\"sh\">'<\/span><span class=\"s\">top<\/span><span class=\"sh\">'<\/span><span class=\"p\">),<\/span>\r\n<\/span><span class=\"p\">]<\/span>\r\n<\/code><\/pre>\n<p>\u8fd9\u662f\u4e00\u4e2a\u9ed8\u8ba4\u663e\u793a\u4e3aadmin\/\u7684\u9875\u9762\uff0c\u539f\u59cb\u8bb0\u5f55\u4e2d\u6709\u8fd9\u4e2a\u4fe1\u606f\u3002<\/p>\n<p>\u8bf7\u8bfb\u53d6\u4e4b\u524d\u521b\u5efa\u7684env.py\u6587\u4ef6\uff0c\u5e76\u5728env.py\u4e2d\u8ffd\u52a0\u8c03\u7528\u7684html\u6587\u4ef6\u7684\u53d8\u91cf\u3002<\/p>\n<pre class=\"post-pre\"><code>path('top\/', env.top, name='top'),\r\n<\/code><\/pre>\n<p>\u4ece\u5de6\u8fb9\u5f00\u59cb<\/p>\n<p>\u8868\u793a\u3057\u305f\u3044URL\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u8a18\u8f09\u3002<br \/>\n\u4eca\u56de\u306fhttp:\/\/127.0.0.1:8000\/top\/\u306b\u30a2\u30af\u30bb\u30b9\u3059\u308b\u3068index.html\u306e\u5185\u5bb9\u3092\u8868\u793a\u3055\u305b\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>env.py\u306etop\uff08index.html\u3092\u547c\u3073\u51fa\u3059\u305f\u3081\u306b\u5b9a\u7fa9\u3057\u305f\u5909\u6570\uff09<\/p>\n<p>name\u306f&#8230;.\u7279\u306b\u6c17\u306b\u305b\u305a\u308f\u304b\u308a\u3084\u3059\u3044\u3082\u306e\u3092<\/p>\n<p>\u5728\u4fdd\u5b58\u4e4b\u540e\uff0c\u518d\u6b21\u6267\u884c&#8221;python manage.py runserver&#8221;\u547d\u4ee4\u540e\uff0c\u6211\u8ba4\u4e3a\u5f53\u60a8\u8bbf\u95ee\u6307\u5b9a\u8def\u5f84\u7684URL\u65f6\uff0c\u65b0\u6587\u4ef6\u4f1a\u88ab\u52a0\u8f7d\u3002<\/p>\n<h2>\u52a0\u8f7dcss\u3001js\u548c\u56fe\u50cf<\/h2>\n<p>\u6211\u4f1a\u7ee7\u7eed\u6dfb\u52a0CSS\u548cJS\u6765\u4fdd\u6301\u8fd9\u4e2a\u72b6\u6001\u3002<\/p>\n<pre class=\"post-pre\"><code><span class=\"cp\">&lt;!DOCTYPE html&gt;<\/span>\r\n<span class=\"nt\">&lt;html<\/span> <span class=\"na\">lang=<\/span><span class=\"s\">\"jp\"<\/span><span class=\"nt\">&gt;<\/span>\r\n<span class=\"nt\">&lt;head&gt;<\/span>\r\n  <span class=\"nt\">&lt;title&gt;<\/span>Hondana<span class=\"nt\">&lt;\/title&gt;<\/span>\r\n  <span class=\"nt\">&lt;link<\/span> <span class=\"na\">rel=<\/span><span class=\"s\">\"stylesheet\"<\/span> <span class=\"na\">href=<\/span><span class=\"s\">\"\/static\/css\/style.css\"<\/span><span class=\"nt\">&gt;<\/span>\r\n<span class=\"nt\">&lt;\/head&gt;<\/span>\r\n<span class=\"nt\">&lt;body&gt;<\/span>\r\n  <span class=\"nt\">&lt;h1&gt;<\/span>Top<span class=\"nt\">&lt;\/h1&gt;<\/span>\r\n  <span class=\"nt\">&lt;div<\/span> <span class=\"na\">class=<\/span><span class=\"s\">\"img\"<\/span><span class=\"nt\">&gt;<\/span>\r\n    <span class=\"nt\">&lt;img<\/span> <span class=\"na\">src=<\/span><span class=\"s\">\"\/static\/images\/test.png\"<\/span> <span class=\"na\">alt=<\/span><span class=\"s\">\"test\"<\/span><span class=\"nt\">&gt;<\/span>\r\n  <span class=\"nt\">&lt;\/div&gt;<\/span>\r\n  <span class=\"nt\">&lt;script <\/span><span class=\"na\">src=<\/span><span class=\"s\">\"\/static\/js\/app.js\"<\/span><span class=\"nt\">&gt;&lt;\/script&gt;<\/span>\r\n<span class=\"nt\">&lt;\/body&gt;<\/span>\r\n<span class=\"nt\">&lt;\/html&gt;<\/span>\r\n<\/code><\/pre>\n<p>\u5982\u679c\u5728HTML\u4e2d\u4f7f\u7528\u6837\u5f0f\u6216\u811a\u672c\u6807\u7b7e\u6dfb\u52a0\u5185\u5bb9\uff0c\u5b83\u4eec\u53ef\u80fd\u4e0d\u4f1a\u88ab\u52a0\u8f7d&#8230;<br \/>\n\u5728Django\u73af\u5883\u4e2d\u52a0\u8f7d\u5916\u90e8\u6587\u4ef6\u9700\u8981\u8fdb\u884c\u4ee5\u4e0b\u914d\u7f6e\u3002<\/p>\n<pre class=\"post-pre\"><code><span class=\"cp\">&lt;!DOCTYPE html&gt;<\/span>\r\n<span class=\"hil\">+ {% load static %}\r\n<\/span><span class=\"nt\">&lt;html<\/span> <span class=\"na\">lang=<\/span><span class=\"s\">\"jp\"<\/span><span class=\"nt\">&gt;<\/span>\r\n<span class=\"nt\">&lt;head&gt;<\/span>\r\n  <span class=\"nt\">&lt;title&gt;<\/span>Hondana<span class=\"nt\">&lt;\/title&gt;<\/span>\r\n<span class=\"hdl\">- <span class=\"nt\">&lt;link<\/span> <span class=\"na\">rel=<\/span><span class=\"s\">\"stylesheet\"<\/span> <span class=\"na\">href=<\/span><span class=\"s\">\"\/static\/css\/style.css\"<\/span><span class=\"nt\">&gt;<\/span>\r\n<\/span><span class=\"hil\">+ <span class=\"nt\">&lt;link<\/span> <span class=\"na\">rel=<\/span><span class=\"s\">\"stylesheet\"<\/span> <span class=\"na\">href=<\/span><span class=\"s\">\"{% static 'css\/style.css' %}\"<\/span><span class=\"nt\">&gt;<\/span>\r\n<\/span><span class=\"nt\">&lt;\/head&gt;<\/span>\r\n<span class=\"nt\">&lt;body&gt;<\/span>\r\n  <span class=\"nt\">&lt;h1&gt;<\/span>Top<span class=\"nt\">&lt;\/h1&gt;<\/span>\r\n  <span class=\"nt\">&lt;div<\/span> <span class=\"na\">class=<\/span><span class=\"s\">\"img\"<\/span><span class=\"nt\">&gt;<\/span>\r\n    <span class=\"nt\">&lt;img<\/span> <span class=\"na\">src=<\/span><span class=\"s\">\"\/static\/images\/test.png\"<\/span> <span class=\"na\">alt=<\/span><span class=\"s\">\"test\"<\/span><span class=\"nt\">&gt;<\/span>\r\n  <span class=\"nt\">&lt;\/div&gt;<\/span>\r\n<span class=\"hdl\">- <span class=\"nt\">&lt;script <\/span><span class=\"na\">src=<\/span><span class=\"s\">\"\/static\/js\/app.js\"<\/span><span class=\"nt\">&gt;&lt;\/script&gt;<\/span>\r\n<\/span><span class=\"hil\">+ <span class=\"nt\">&lt;script <\/span><span class=\"na\">src=<\/span><span class=\"s\">\"{% static 'js\/app.js' %}\"<\/span><span class=\"nt\">&gt;&lt;\/script&gt;<\/span>\r\n<\/span><span class=\"nt\">&lt;\/body&gt;<\/span>\r\n<span class=\"nt\">&lt;\/html&gt;<\/span>\r\n<\/code><\/pre>\n<p>\u5728HTML\u6807\u7b7e\u4e0a\u6dfb\u52a0{% load static %}\u3002<br \/>\n\u5982\u679c\u5728\u8fd9\u91cc\u6dfb\u52a0\uff0c\u53ef\u4ee5\u4ece\u5916\u90e8\u52a0\u8f7dCSS\uff0cJS\u548c\u56fe\u7247\u3002<\/p>\n<p>\u5728Chinese\uff0c\u53ea\u9700\u8981\u4e00\u79cd\u9009\u9879\u3002<\/p>\n<p>\u4f7f\u7528{% static &#8216;\u6587\u4ef6\u8def\u5f84&#8217; %}\u6765\u6dfb\u52a0CSS\u548cJS\u6587\u4ef6\u7684\u76ee\u5f55\u3002\u8fd9\u91cc\u7684static\u662f\u6839\u636esetting.py\u4e2d\u8bbe\u7f6e\u7684\u76ee\u5f55\u3002<\/p>\n<p>\u8bf7\u6ce8\u610f\uff0c\u8def\u5f84\u4e5f\u662f\u6839\u636e\u8bbe\u5b9a\u7684\u76ee\u5f55\u6765\u8fdb\u884c\u7684\u3002<\/p>\n<p>\u5982\u679c\u7ee7\u7eed\u6267\u884c python manage.py runserver \uff0c\u5219\u4f1a\u663e\u793a\u8bbe\u7f6e\u7684 CSS\u3001JS\u3001\u56fe\u50cf\u7b49\u3002<\/p>\n<h2>\u9019\u6a23\u4f7f\u7528Django\u69cb\u5efa\u61c9\u7528\u7a0b\u5f0f\u7684\u524d\u7aef\u986f\u793a\u5c31\u53ef\u4ee5\u4e86\uff01<\/h2>\n<p>\u56e0\u4e3a\u6211\u662f\u7b2c\u4e00\u6b21\u63a5\u89e6Django\uff0c\u6240\u4ee5\u8fb9\u67e5\u8be2\u8fb9\u8fdb\u884c\u5f00\u53d1\uff0c\u4f46\u5236\u4f5c\u51fa\u6765\u7684\u65f6\u95f4\u5e76\u6ca1\u6709\u592a\u957f\u3002<br \/>\n\u5bf9\u4e8e\u5c0f\u578b\u5f00\u53d1\u9879\u76ee\uff0c\u6211\u89c9\u5f97\u7528node.js\u76f8\u6bd4\u4e8e\u7e41\u7410\u7684\u5f00\u53d1\uff0c\u4f7f\u7528Django\u80fd\u66f4\u5feb\u901f\u5730\u5b8c\u6210\u5e76\u5728\u6d4f\u89c8\u5668\u4e0a\u8fdb\u884c\u786e\u8ba4\u3002?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u7531\u4e8e\u6211\u6b63\u5728\u4f7f\u7528Python\u7f16\u5199\u7684Web\u5e94\u7528\u7a0b\u5e8f\uff0c\u524d\u7aef\u90e8\u5206\u4f3c\u4e4e\u4e5f\u5373\u5c06\u5f00\u59cb\u8fd0\u8f6c\uff0c\u56e0\u6b64\u6211\u5c1d\u8bd5\u7528Django\u6765\u642d\u5efa\u4e00\u4e2a [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-49303","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.5 (Yoast SEO v21.5) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206 - Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/\u5c1d\u8bd5\u4f7f\u7528django\u6574\u7406\u524d\u7aef\u90e8\u5206\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206\" \/>\n<meta property=\"og:description\" content=\"\u7531\u4e8e\u6211\u6b63\u5728\u4f7f\u7528Python\u7f16\u5199\u7684Web\u5e94\u7528\u7a0b\u5e8f\uff0c\u524d\u7aef\u90e8\u5206\u4f3c\u4e4e\u4e5f\u5373\u5c06\u5f00\u59cb\u8fd0\u8f6c\uff0c\u56e0\u6b64\u6211\u5c1d\u8bd5\u7528Django\u6765\u642d\u5efa\u4e00\u4e2a [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/\u5c1d\u8bd5\u4f7f\u7528django\u6574\u7406\u524d\u7aef\u90e8\u5206\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-04T01:56:59+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-29T07:52:29+00:00\" \/>\n<meta name=\"author\" content=\"\u6e05, \u5b87\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u6e05, \u5b87\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/\",\"name\":\"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206 - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2024-01-04T01:56:59+00:00\",\"dateModified\":\"2024-04-29T07:52:29+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/1a6ecd3d914d22a5ac32791ffc1fbd8e\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.silicloud.com\/zh\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/1a6ecd3d914d22a5ac32791ffc1fbd8e\",\"name\":\"\u6e05, \u5b87\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/4b2016c18459a605fc469c7566608f5686491baa112d0871ee613f61b7210565?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/4b2016c18459a605fc469c7566608f5686491baa112d0871ee613f61b7210565?s=96&d=mm&r=g\",\"caption\":\"\u6e05, \u5b87\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/qingyu\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206 - Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/\u5c1d\u8bd5\u4f7f\u7528django\u6574\u7406\u524d\u7aef\u90e8\u5206\/","og_locale":"zh_CN","og_type":"article","og_title":"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206","og_description":"\u7531\u4e8e\u6211\u6b63\u5728\u4f7f\u7528Python\u7f16\u5199\u7684Web\u5e94\u7528\u7a0b\u5e8f\uff0c\u524d\u7aef\u90e8\u5206\u4f3c\u4e4e\u4e5f\u5373\u5c06\u5f00\u59cb\u8fd0\u8f6c\uff0c\u56e0\u6b64\u6211\u5c1d\u8bd5\u7528Django\u6765\u642d\u5efa\u4e00\u4e2a [&hellip;]","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/\u5c1d\u8bd5\u4f7f\u7528django\u6574\u7406\u524d\u7aef\u90e8\u5206\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2024-01-04T01:56:59+00:00","article_modified_time":"2024-04-29T07:52:29+00:00","author":"\u6e05, \u5b87","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u6e05, \u5b87","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"3 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/","name":"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206 - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2024-01-04T01:56:59+00:00","dateModified":"2024-04-29T07:52:29+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/1a6ecd3d914d22a5ac32791ffc1fbd8e"},"breadcrumb":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.silicloud.com\/zh\/blog\/"},{"@type":"ListItem","position":2,"name":"\u5c1d\u8bd5\u4f7f\u7528Django\u6574\u7406\u524d\u7aef\u90e8\u5206"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/1a6ecd3d914d22a5ac32791ffc1fbd8e","name":"\u6e05, \u5b87","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/4b2016c18459a605fc469c7566608f5686491baa112d0871ee613f61b7210565?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4b2016c18459a605fc469c7566608f5686491baa112d0871ee613f61b7210565?s=96&d=mm&r=g","caption":"\u6e05, \u5b87"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/qingyu\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%b0%9d%e8%af%95%e4%bd%bf%e7%94%a8django%e6%95%b4%e7%90%86%e5%89%8d%e7%ab%af%e9%83%a8%e5%88%86\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/49303","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=49303"}],"version-history":[{"count":2,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/49303\/revisions"}],"predecessor-version":[{"id":86209,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/49303\/revisions\/86209"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=49303"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=49303"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=49303"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}