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

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

news 2026/4/20 11:22:00

一、视图创建

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…...

编程日记 2023/11/25 19:56:10

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…...

编程日记 2023/11/25 19:55:09

elk 简单操作手册

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

编程日记 2023/11/25 19:54:08

CSS画一条线

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

编程日记 2023/11/25 19:53:07

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

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

编程日记 2023/11/25 19:52:06

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;答案中不可以包含重复的三元组。 …...

编程日记 2023/11/25 19:50:04

黑马点评笔记 分布式锁

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

编程日记 2023/11/25 19:48:03

java---抽象类 用abstract修饰

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

编程日记 2023/11/25 19:47:01

JVM 之 javac、java、javap 命令详解

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

编程日记 2023/11/25 19:46:01

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

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

编程日记 2023/11/25 19:43:59

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

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

编程日记 2023/11/25 19:42:58

mysql union 和 union all区别？

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

编程日记 2023/11/25 19:41:56

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/25 19:40:55

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…...

编程日记 2023/11/25 19:39:54

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

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

编程日记 2023/11/25 19:38:53

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

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

编程日记 2023/11/25 19:37:52

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…...

编程日记 2023/11/25 19:36:51

mobiusp 正在创作乐曲

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

编程日记 2023/11/25 19:35:50

Jensen不等式

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

编程日记 2023/11/25 19:34:49

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

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

编程日记 2023/11/25 19:32:46

DbVisualizer Pro永久激活指南：从JRE配置到license生成（Linux版）

DbVisualizer Pro在Linux系统下的高效配置与授权管理指南 引言 对于数据库开发人员和管理员来说&#xff0c;DbVisualizer Pro无疑是一款功能强大的跨平台数据库工具。它支持几乎所有主流数据库系统&#xff0c;提供了直观的图形界面和丰富的功能集。然而&#xff0c;在Linux…...

编程新知 2026/4/20 10:52:16

Python桌面应用自动更新实战：PyUpdater保姆级配置指南（附常见错误排查）

Python桌面应用自动更新实战&#xff1a;PyUpdater保姆级配置指南&#xff08;附常见错误排查&#xff09; 当你花了三个月开发的Python桌面应用终于上线&#xff0c;用户反馈却卡在"版本过旧无法使用"的尴尬境地时&#xff0c;自动更新功能就从"锦上添花"…...

编程新知 2026/4/20 9:57:53

从C API到Connector/C++：一个C++算法工程师的MySQL连接库迁移心路与性能对比

从C API到Connector/C&#xff1a;一个C算法工程师的MySQL连接库迁移心路与性能对比 在算法开发领域&#xff0c;数据是模型的血液。三年前我刚加入金融风控团队时&#xff0c;面对每天TB级的交易数据&#xff0c;MySQL成了最可靠的伙伴。但当我第一次用C API编写数据管道时&am…...

编程新知 2026/4/20 9:25:07

Java开发者快速上手：Phi-4-mini-reasoning本地API调用集成教程

Java开发者快速上手&#xff1a;Phi-4-mini-reasoning本地API调用集成教程 1. 开篇&#xff1a;为什么选择Phi-4-mini-reasoning 如果你是一名Java开发者&#xff0c;最近可能已经注意到AI模型集成正在成为后端开发的新常态。Phi-4-mini-reasoning作为一款轻量级推理模型&…...

编程新知 2026/4/20 6:16:45

x86‌汇编 REPE CMPSB‌ 指令学习

REPE CMPSB‌ 是 x86 汇编语言中用于‌逐字节比较两个字符串‌的组合指令&#xff1b;‌CMPSB‌&#xff1a;比较两个内存区域中的字节&#xff0c;分别由 DS:SI 和 ES:DI 指向。 比较后会设置标志寄存器中的 ‌ZF&#xff08;零标志位&#xff09;‌&#xff1a;若两字节相等&…...

编程新知 2026/4/20 5:20:08

房地产行业的 AI 变革：房产带看与估值 Agent

房地产行业的 AI 变革：房产带看与估值 Agent 全解析 引言 痛点引入 你有没有过这样的房产交易经历？为了买一套合适的二手房，周末连续跑3天、跟着中介看12套房子，最后发现一半房源不符合你“离地铁1公里、带学区、朝南三房”的核心需求；业主挂出一套房源，中介给出的估价…...

编程新知 2026/4/20 4:22:03

SSD硬盘对HTML工具速度有影响吗_存储介质与开发效率关系【详解】

SSD显著提升HTML开发效率&#xff1a;启动快4.6秒、热重载快750ms、构建快24.7秒、DevTools加载快11.8秒&#xff0c;因SSD在随机读写、I/O延迟和吞吐量上远超HDD。如果您在使用HTML开发工具时发现页面加载、文件保存或构建过程响应迟缓&#xff0c;则可能是存储介质的读写性能…...

编程新知 2026/4/20 3:47:15

告别几十个ECU！手把手拆解车身域控制器（附SPC58NH/S32G方案选型指南）

车身域控制器实战指南&#xff1a;从传统ECU到集中式架构的硬件整合 车身电子系统正经历一场从分散到集中的革命。想象一下&#xff0c;一辆现代汽车内部可能分布着上百个独立工作的电子控制单元(ECU)&#xff0c;它们各自为政&#xff0c;通过复杂的线束网络相互连接。这不仅增…...

编程新知 2026/4/20 2:23:26

多客圈子论坛代码审计（PHP代码审计）

前言&#xff1a;前几天看到同学发来了一个漏洞分析的报告&#xff0c;想着来分析分析源代码&#xff0c;就有了这篇文章&#xff0c;第一次写代码审计的文章&#xff0c;可能会有很多不足点&#xff0c;欢迎大家批评指正&#xff0c;谢谢! 项目源代码&#xff1a;https://pan…...

编程新知 2026/4/20 1:55:15

D3KeyHelper暗黑3技能连点器：从零开始掌握智能自动化战斗

D3KeyHelper暗黑3技能连点器&#xff1a;从零开始掌握智能自动化战斗 【免费下载链接】D3keyHelper D3KeyHelper是一个有图形界面&#xff0c;可自定义配置的暗黑3鼠标宏工具。 项目地址: https://gitcode.com/gh_mirrors/d3/D3keyHelper 想要在暗黑破坏神3中轻松实现技…...

编程新知 2026/4/20 1:10:50