django 设置媒体url_(django)url路由配置及渲染方式

一,url路由path及转化器

URL(uniform Resoure Locator)统一资源定位符,是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址,互联网上的每个文件都有唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它。

设置好url,用户才能访问

1,URL的格式:

解释:

schema://host[:port#]/path/.../[?query-string][#anchor]

schema:指定使用的协议(如:http,https,ftp)

host:Http服务器的IP地址或者域名

port:端口号,http默认是80端口

path:访问资源的路径

query-string:发送给http服务器的数据

anchor:锚点

2,urls.py的作用

URL配置(URLconf)就像是Django所支撑网站的目录。它的本质是URL模式以及URL模式调用的视图函数之间的映射表。以这样的方式告诉Django,对于哪个URL调用那段代码。URL的加载就是从配置文件中开始

例如:在项目下urls.py文件:from django.contrib import admin

from django.urls import path

from . import views

urlpatterns = [

path('admin/', admin.site.urls),

path("abc/",views.hello),

path("ab/", views.hello_python),

path("ab//", views.hello_name),#获取变量name

]

views.py文件:from django.shortcuts import render

from django.http import HttpResponse

# Create your views here.

def hello(request):

return HttpResponse("123344")

​def hello_python(request):

return HttpResponse("HELLO PYTHON!!")def hello_name(request,name):

return H

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue和Django都是非常流行的Web开发框架,Vue是一个JavaScript框架,用于构建单页面应用程序,而Django是一个Python框架,用于构建Web应用程序。在这里,我将向您展示如何使用Vue和Django构建一个完整的Web应用程序。 首先,您需要决定如何组织您的项目。您可以将Vue作为前端,Django作为后端,或者将它们结合在一起,使用Django作为API,并使用Vue作为前端框架来调用API。 在这里,我们将使用Vue和Django结合在一起,使用Django作为API,Vue作为前端框架。这意味着我们将使用Django来处理所有的后端逻辑,并使用Vue来渲染前端页面并调用Django API。 步骤如下: 1. 安装和配置Django 首先,您需要安装Django。您可以使用pip在命令行中运行以下命令来安装Django: ``` pip install django ``` 安装完成后,您需要创建一个新的Django项目。在命令行中输入以下命令: ``` django-admin startproject myproject ``` 这将创建一个名为myproject的新Django项目。 2. 创建Django应用程序 在Django中,应用程序是一个可重用的组件,用于执行特定任务。在我们的项目中,我们将创建一个名为api的Django应用程序,用于处理所有的API请求。 在命令行中,进入myproject目录,并运行以下命令: ``` python manage.py startapp api ``` 这将创建一个名为api的新Django应用程序。 3. 配置Django路由Django中,路由用于指定应用程序如何响应特定的URL。在我们的项目中,我们将使用Django路由来指定如何处理API请求。 在api应用程序的目录中,创建一个名为urls.py的新文件,并添加以下代码: ```python from django.urls import path from . import views urlpatterns = [ path('api/', views.api_view, name='api_view'), ] ``` 这将创建一个新的路由,并将其指向api_view视图函数。我们将在下一步中创建这个视图函数。 4. 创建Django视图函数 在Django中,视图函数用于处理HTTP请求并返回HTTP响应。在我们的项目中,我们将创建一个名为api_view的视图函数,用于处理API请求。 在api应用程序的views.py文件中,添加以下代码: ```python from django.http import JsonResponse def api_view(request): data = { 'message': 'Hello, world!' } return JsonResponse(data) ``` 这将创建一个简单的视图函数,返回一个包含“Hello, world!”消息的JSON响应。 5. 配置Django设置Django中,设置用于配置应用程序的特定行为。在我们的项目中,我们需要配置Django以允许跨域请求,并将api应用程序添加到INSTALLED_APPS设置中。 在myproject目录中,打开settings.py文件,并添加以下代码: ```python INSTALLED_APPS = [ # ... 'api', ] CORS_ORIGIN_ALLOW_ALL = True ``` 这将启用跨域请求,并将api应用程序添加到INSTALLED_APPS设置中。 6. 创建Vue应用程序 接下来,我们将创建Vue应用程序。在命令行中,运行以下命令: ``` vue create myapp ``` 这将创建一个名为myapp的新Vue应用程序。 7. 配置Vue应用程序 在Vue应用程序的src目录中,打开main.js文件,并添加以下代码: ```javascript import Vue from 'vue' import App from './App.vue' import axios from 'axios' Vue.config.productionTip = false Vue.prototype.$http = axios.create({ baseURL: 'http://localhost:8000' }) new Vue({ render: h => h(App), }).$mount('#app') ``` 这将配置Vue应用程序,使其使用Axios库调用Django API。请注意,我们使用了http://localhost:8000作为API的基本URL,这是Django的默认端口。 8. 创建Vue组件 在Vue应用程序的src目录中,创建一个名为HelloWorld.vue的新文件,并添加以下代码: ```html <template> <div> <h1>{{ message }}</h1> </div> </template> <script> export default { data() { return { message: '' } }, mounted() { this.$http.get('/api/') .then(response => { this.message = response.data.message }) } } </script> ``` 这将创建一个Vue组件,用于显示从Django API返回的消息。 9. 渲染Vue应用程序 在Vue应用程序的src目录中,打开App.vue文件,并添加以下代码: ```html <template> <div> <HelloWorld /> </div> </template> <script> import HelloWorld from './components/HelloWorld.vue' export default { name: 'App', components: { HelloWorld } } </script> ``` 这将渲染Vue应用程序,并在页面上显示HelloWorld组件。 10. 运行项目 现在,您已经完成了Vue和Django配置。在命令行中,进入myproject目录,并运行以下命令: ``` python manage.py runserver ``` 这将启动Django服务器。在另一个命令行窗口中,进入myapp目录,并运行以下命令: ``` npm run serve ``` 这将启动Vue开发服务器。现在,您可以在浏览器中访问http://localhost:8080,看到来自Django API的“Hello, world!”消息。 至此,您已经成功地使用Vue和Django构建了一个完整的Web应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值