当前位置: 首页 > news >正文

Python 前后端分离项目Vue部署应用

一、视图创建

from django.http import JsonResponse
from django.shortcuts import render# Create your views here.
from django.views import Viewclass IndexView(View):def get(self,request):# 前后端分离 (前端JS代码渲染数据)return JsonResponse({'name':'Hello,mike'})

二、配置子路由

from django.urls import pathfrom book import viewsurlpatterns = [#子路由path('', views.IndexView.as_view()),]

三、配置主路由

from django.contrib import admin
from django.urls import path, includeurlpatterns = [path('', include('book.urls')),  #子路由path('admin/', admin.site.urls),
]

四、解决跨域查看(Python 安装django-cors-headers解决跨域问题-CSDN博客)

五、HTML页面

 my.html页面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>前后端分离数据</title><script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script><script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="app">{{name}}</div>
<script>new Vue({el:'#app',data:{name:'',},mounted:function () {axios.get('http://127.0.0.1:8000').then(response=>{this.name=response.data.name}).catch(error=>{alert(error)})},})
</script>
</body>
</html>

 六、运行前后端服务

 http://127.0.0.1:8000

 http://127.0.0.1:8080/my.html 

 效果:

 

相关文章:

Python 前后端分离项目Vue部署应用

一、视图创建 from django.http import JsonResponse from django.shortcuts import render# Create your views here. from django.views import Viewclass IndexView(View):def get(self,request):# 前后端分离 &#xff08;前端JS代码渲染数据&#xff09;return JsonRespo…...

Linux中安装MySQ-合集

Linux中安装MySQL Centos中 1、卸载不必要的软件 先卸载mariadb安装MySQL必要环境 rpm -qa|grep mariadb rpm -e --nodeps mariadb-libs yum install -y gcc-c yum install net-tools yum -y install gcc如果需要Java等程序 yum install -y java* java-1.8.0-openjdk* op…...

elk 简单操作手册

1.1. 基础概念 EFK不是一个软件,而是一套解决方案,开源软件之间的互相配合使用,高效的满足了很多场合的应用,是目前主流的一种日志系统。 EFK是三个开源软件的缩写,分别表示:Elasticsearch , Filebeat, Kibana , 其中Elasticsearch负责日志保存和搜索,Filebeat负责收集日志,Ki…...

CSS画一条线

<p style"border: 1px solid rgba(0, 0, 0, 0.1);"></p> 效果&#xff1a;...

分享常用设计模式之单例模式(懒汉模式和饿汉模式)和几种关于设计模式的面试题

目录 1.单例模式 1.懒汉模式 2.饿汉模式 2.设计一个不能被继承的类 3.设计一个不能被继承但是可以在外部环境创建该类对象的类 4.设计一个可以被继承但不能在外部环境创建该类的对象的类 5.限制派生类对象不能拷贝也不能赋值 1.单例模式 设计一个不能在外部环境创建该类…...

python每日一题——6三数之和

题目 给你一个整数数组 nums &#xff0c;判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k &#xff0c;同时还满足 nums[i] nums[j] nums[k] 0 。请 你返回所有和为 0 且不重复的三元组。 注意&#xff1a;答案中不可以包含重复的三元组。 …...

黑马点评笔记 分布式锁

文章目录 分布式锁基本原理和实现方式对比Redis分布式锁的实现核心思路实现分布式锁版本一Redis分布式锁误删情况说明解决Redis分布式锁误删问题分布式锁的原子性问题分布式锁-Redission分布式锁-redission可重入锁原理分布式锁-redission锁重试和WatchDog机制分布式锁-redissi…...

java---抽象类 用abstract修饰

抽象类是不能被[ 直接 ] [ 显式 ]实例化的如果抽象类中有一个抽象方法,那么这个类一定要声明为抽象类(反过来说,如果一个类是抽象类,那么它里面可以没有抽象方法)如果父类中有一个抽象方法,那么抽象的子类,要么也得是抽象的,要么就把抽象的方法全部给具体化(实现了) 抽象方法 …...

JVM 之 javac、java、javap 命令详解

目录 一. 前言 二. javac 命令 三. java 命令 四. javap 命令 一. 前言 在日常工作中&#xff0c;我们新建 Java工程&#xff0c;写好代码后&#xff0c;编译和运行几乎都是通过 IDE&#xff08;如idea、eclipse&#xff09;工具完成。但作为 Java开发者还是要了解下 Java虚…...

市场被套牢,没有了解积累和分配,昂首资本一一介绍

很多投资者对市场中的积累和分配的概念不是很清楚&#xff0c;下面昂首资本将一一介绍。 积累意味着尽可能多地买入筹码&#xff0c;而不大幅抬高价格&#xff0c;直到在你买入时的价格水平上没有或几乎没有筹码。这种买入通常发生在市场熊市之后&#xff0c;此时有最佳买入价…...

notion 3.0.0 版本最新桌面端汉化教程,支持MAC和WIN版本

notion客户端汉化&#xff08;目前版本3.0.0&#xff09; 最近notion桌面端更新了3.0.0版本后会导致老版本汉化失效&#xff0c;本项目实现了最新版Notion桌面端的汉化。 文件下载地址&#xff1a;汉化文件下载地址 项目说明 本项目针对新的客户端做了汉化文化&#xff0c;依…...

mysql union 和 union all区别?

在MySQL中&#xff0c;UNION和UNION ALL都是用于合并两个或多个SELECT语句的结果集。它们之间的主要区别在于如何处理重复记录。 UNION:UNION在合并结果集时会删除重复的记录。这意味着如果两个SELECT语句的输出结果中有相同的记录&#xff0c;那么UNION只会保留其中一个。在执…...

uni-app小程序 swiper 分页器样式修改

小程序中使用 wx-swiper-dot和wx-swiper-dot-active选择器 H5中使用uni-swiper-dot和uni-swiper-dot-active选择器 .swiper {height: 408px;margin-bottom: 28rpx;::v-deep .uni-swiper-dot {background: #e7e7e7;&.uni-swiper-dot-active {background: #b1b1b1;}}// #ifde…...

2023.11.23使用flask实现在指定路径生成文件夹操作

2023.11.23使用flask实现在指定路径生成文件夹操作 程序比较简单&#xff0c;实现功能&#xff1a; 1、前端输入文件夹 2、后端在指定路径生成文件夹 3、前端反馈文件夹生成状态 main.py from flask import Flask, request, render_template import osapp Flask(__name__)a…...

【Unity入门】Input.GetAxis(““)控制物体移动、旋转

使用Unity的Input.GetAxis(“”)控制物体移动、旋转 Input.GetAxis(“”) 是 Unity 引擎中的一个方法&#xff0c;用于获取游戏玩家在 键盘 或 游戏手柄 上输入的某个轴&#xff08;Axis&#xff09;的值。这里的 “” 是一个字符串参数&#xff0c;表示要获取的轴的名称。 在…...

【C++ 设计模式】面向对象设计原则 Template Method 模式 Strategy 策略模式

一、面向对象设计原则 重新认识面向对象 理解隔离变化 • 从宏观层面来看&#xff0c;面向对象的构建方式更能适应软件的变化&#xff0c; 能将变化所带来的影响减为最小 各司其职 • 从微观层面来看&#xff0c;面向对象的方式更强调各个类的“责任” • 由于需求变化导…...

Flink-简介与基础

Flink-简介与基础 一、Flink起源二、Flink数据处理模式1.批处理2.流处理3.Flink流批一体处理 三、Flink架构1.Flink集群2.Flink Program3.JobManager4.TaskManager 四、Flink应用程序五、Flink高级特性1.时间流&#xff08;Time&#xff09;和窗口&#xff08;Window&#xff0…...

mobiusp 正在创作乐曲

题目描述 mobiusp 创作了一首 n 个音符的乐曲&#xff0c;其中第 iii 个音符的音高为 ai​ &#xff0c;但是 mobiusp 对以前的创作风格和黑历史很不满意&#xff0c;他希望所有音符的音高 ai 都是 1∼7 的正整数&#xff0c;且相邻的音高差不超过 k 。 现在他要修改若干个音符…...

Jensen不等式

如果是正数&#xff0c;并且它们的和等于1&#xff0c;f是凸函数&#xff0c;那么&#xff1a; 也可表述为&#xff1a; 即x期望的凸函数值小于等于x凸函数值的期望...

北邮22级信通院数电:Verilog-FPGA(11)第十一周实验(2)设计一个24秒倒计时器

北邮22信通一枚~ 跟随课程进度更新北邮信通院数字系统设计的笔记、代码和文章 持续关注作者 迎接数电实验学习~ 获取更多文章&#xff0c;请访问专栏&#xff1a; 北邮22级信通院数电实验_青山如墨雨如画的博客-CSDN博客 目录 一.代码部分 1.1 counter_24.v 1.2 divid…...

linux之kylin系统nginx的安装

一、nginx的作用 1.可做高性能的web服务器 直接处理静态资源&#xff08;HTML/CSS/图片等&#xff09;&#xff0c;响应速度远超传统服务器类似apache支持高并发连接 2.反向代理服务器 隐藏后端服务器IP地址&#xff0c;提高安全性 3.负载均衡服务器 支持多种策略分发流量…...

云计算——弹性云计算器(ECS)

弹性云服务器&#xff1a;ECS 概述 云计算重构了ICT系统&#xff0c;云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台&#xff0c;包含如下主要概念。 ECS&#xff08;Elastic Cloud Server&#xff09;&#xff1a;即弹性云服务器&#xff0c;是云计算…...

23-Oracle 23 ai 区块链表(Blockchain Table)

小伙伴有没有在金融强合规的领域中遇见&#xff0c;必须要保持数据不可变&#xff0c;管理员都无法修改和留痕的要求。比如医疗的电子病历中&#xff0c;影像检查检验结果不可篡改行的&#xff0c;药品追溯过程中数据只可插入无法删除的特性需求&#xff1b;登录日志、修改日志…...

定时器任务——若依源码分析

分析util包下面的工具类schedule utils&#xff1a; ScheduleUtils 是若依中用于与 Quartz 框架交互的工具类&#xff0c;封装了定时任务的 创建、更新、暂停、删除等核心逻辑。 createScheduleJob createScheduleJob 用于将任务注册到 Quartz&#xff0c;先构建任务的 JobD…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

算法笔记2

1.字符串拼接最好用StringBuilder&#xff0c;不用String 2.创建List<>类型的数组并创建内存 List arr[] new ArrayList[26]; Arrays.setAll(arr, i -> new ArrayList<>()); 3.去掉首尾空格...

站群服务器的应用场景都有哪些?

站群服务器主要是为了多个网站的托管和管理所设计的&#xff0c;可以通过集中管理和高效资源的分配&#xff0c;来支持多个独立的网站同时运行&#xff0c;让每一个网站都可以分配到独立的IP地址&#xff0c;避免出现IP关联的风险&#xff0c;用户还可以通过控制面板进行管理功…...

Chrome 浏览器前端与客户端双向通信实战

Chrome 前端&#xff08;即页面 JS / Web UI&#xff09;与客户端&#xff08;C 后端&#xff09;的交互机制&#xff0c;是 Chromium 架构中非常核心的一环。下面我将按常见场景&#xff0c;从通道、流程、技术栈几个角度做一套完整的分析&#xff0c;特别适合你这种在分析和改…...

go 里面的指针

指针 在 Go 中&#xff0c;指针&#xff08;pointer&#xff09;是一个变量的内存地址&#xff0c;就像 C 语言那样&#xff1a; a : 10 p : &a // p 是一个指向 a 的指针 fmt.Println(*p) // 输出 10&#xff0c;通过指针解引用• &a 表示获取变量 a 的地址 p 表示…...

API网关Kong的鉴权与限流:高并发场景下的核心实践

&#x1f525;「炎码工坊」技术弹药已装填&#xff01; 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 引言 在微服务架构中&#xff0c;API网关承担着流量调度、安全防护和协议转换的核心职责。作为云原生时代的代表性网关&#xff0c;Kong凭借其插件化架构…...