图片管理之保存图片数据

article/2025/9/10 3:43:04

保存图片数据

在保存数据之前我们需要先获取图片关联的sku的id

1、获取sku表id

接口分析

请求方式: GET /meiduo_admin/skus/simple/

# -------获取sku的id--------url(r'skus/simple/$', images.ImageView.as_view({'get': 'simple'})),

请求参数: 通过请求头传递jwt token数据。

返回数据: JSON

 [{"id": 1,"name": "Apple MacBook Pro 13.3英寸笔记本 银色"},{"id": 2,"name": "Apple MacBook Pro 13.3英寸笔记本 深灰色"},......]
返回值类型是否必须说明
Idintsku商品id
name数组Sku商品名称

后端实现

from rest_framework.permissions import IsAdminUser
from rest_framework.viewsets import ModelViewSet
from meiduo_admin.serializers.images import ImageSeriazlier, SKUSeriazlier
from goods.models import SKUImage, SKU
from meiduo_admin.utils import UserPageNum
from rest_framework.response import Responseclass ImageView(ModelViewSet):# 图片序列化器serializer_class = ImageSeriazlier# 图片查询集queryset = SKUImage.objects.all()# 分页pagination_class = UserPageNumpermission_classes = [IsAdminUser]#  获取sku商品信息def simple(self, request):#  查询所有的sku商品data = SKU.objects.all()#  序列化操作返回ser = SKUSeriazlier(data, many=True)return Response(ser.data)

序列化器的定义

from goods.models import SKUclass SKUSeriazlier(serializers.ModelSerializer):class Meta:model=SKUfields=('id','name')

2、保存图片数据

接口分析

请求方式:POST /meiduo_admin/skus/images/

#  图片查询路由****************************
router = DefaultRouter()
router.register('skus/images', images.ImageView, base_name='images')
# print(router.urls)
urlpatterns += router.urls

请求参数: 通过请求头传递jwt token数据。

表单提交数据:"sku": "SKU商品id","image": "SKU商品图片"
参数类型是否必须说明
skustrSKU商品id
imageFielSKU商品图片

返回数据: JSON

 {"id": "图片id","sku": "SKU商品id","image": "图片地址"}
参数类型是否必须说明
idInt图片id
skuintSKU商品id
imagestr图片地址

后端实现

在保存图片的同时,我们还需要异步生成新的详情页页面,这是我们需要定义异步任务

【后端人员修改图片后,执行静态页面更改图片时可能速度会慢一些,所以防止阻塞这儿要使用异步任务】

import os
from django.conf import settings
from django.shortcuts import renderfrom meiduo_mall.utils.categories import get_categories
from meiduo_mall.utils.breadcrumb import get_breadcrumb
from goods.models import SKU
from celery_tasks.main import app@app.task(name='get_detail_html')
def get_detail_html(sku_id):#  获取当前sku对象sku = SKU.objects.get(id=sku_id)# 分类数据categories = get_categories()# 获取面包屑导航breadcrumb = get_breadcrumb(sku.category)# 获取spuspu = sku.spu# 获取规格信息:sku===>spu==>specsspecs = spu.specs.order_by('id')# 查询所有的sku,如华为P10的所有库存商品skus = spu.skus.order_by('id')'''{选项:sku_id}说明:键的元组中,规格的索引是固定的示例数据如下:{(1,3):1,(2,3):2,(1,4):3,(2,4):4}'''sku_options = {}sku_option = []for sku1 in skus:infos = sku1.specs.order_by('spec_id')option_key = []for info in infos:option_key.append(info.option_id)# 获取当前商品的规格信息if sku.id == sku1.id:sku_option.append(info.option_id)sku_options[tuple(option_key)] = sku1.id# 遍历当前spu所有的规格specs_list = []for index, spec in enumerate(specs):option_list = []for option in spec.options.all():# 如果当前商品为蓝、64,则列表为[2,3]sku_option_temp = sku_option[:]# 替换对应索引的元素:规格的索引是固定的[1,3]sku_option_temp[index] = option.id# 为选项添加sku_id属性,用于在html中输出链接option.sku_id = sku_options.get(tuple(sku_option_temp), 0)# 添加选项对象option_list.append(option)# 为规格对象添加选项列表spec.option_list = option_list# 重新构造规格数据specs_list.append(spec)context = {'sku': sku,'categories': categories,'breadcrumb': breadcrumb,'category_id': sku.category_id,'spu': spu,'specs': specs_list}response = render(None, 'detail.html', context)file_name = os.path.join(settings.BASE_DIR, 'static/detail/%d.html' % sku.id)# 写文件with open(file_name, 'w') as f1:f1.write(response.content.decode())

视图代码

在settings中配置fastdfs文件路径:

#  指定fastdfs文件路径
FASTDFS_PATH = os.path.join(BASE_DIR, 'utils/fdfs/client.conf')

images.py

from rest_framework.permissions import IsAdminUser
from rest_framework.viewsets import ModelViewSet
from meiduo_admin.serializers.images import ImageSerializer, SKUSerializer
from goods.models import SKUImage, SKU
from meiduo_admin.utils import UserPageNum
from rest_framework.response import Response
from fdfs_client.client import Fdfs_client
from django.conf import settings
from celery_tasks.static_file.tasks import get_detail_htmlclass ImageView(ModelViewSet):# 图片序列化器serializer_class = ImageSerializer# 图片查询集queryset = SKUImage.objects.all()# 分页pagination_class = UserPageNum# permission_classes = [IsAdminUser]#  获取sku商品信息def simple(self, request):#  查询所有的sku商品data = SKU.objects.all()#  序列化操作返回ser = SKUSerializer(data, many=True)return Response(ser.data)# 重写拓展类的保存业务逻辑def create(self, request, *args, **kwargs):# 创建FastDFS连接对象client = Fdfs_client(settings.FASTDFS_PATH)# 获取前端传递的image文件data = request.FILES.get('image')# 上传图片到fastDFSres = client.upload_by_buffer(data.read())# 判断是否上传成功if res['Status'] != 'Upload successed.':return Response(status=403)# 获取上传后的路径image_url = res['Remote file_id']# 获取sku_idsku_id = request.data.get('sku')[0]# 保存图片img = SKUImage.objects.create(sku_id=sku_id, image=image_url)# 生成新的详情页页面get_detail_html.delay(img.sku.id)# 返回结果return Response({'id': img.id,'sku': sku_id,'image': img.image.url  # 这儿返回是完整的路由信息},status=201  # 前端需要接受201状态)

【上面的create方法可以封装到序列化器中的,具体操作可以看源码。其实这些代码在序列化器中写好后,这些代码是可以直接注释掉的,父类方法中已经提供了这些操作。在序列化器中是没有request属性的,可以使用self.context['request']代替】

修改后的代码:

序列化器:【视图中的create代码可以都注释掉了】

from rest_framework import serializers
from goods.models import SKUImage
from goods.models import SKU
from rest_framework.response import Response
from fdfs_client.client import Fdfs_client
from django.conf import settings
from celery_tasks.static_file.tasks import get_detail_htmlclass ImageSerializer(serializers.ModelSerializer):# 返回图片关联的sku的id值sku = serializers.PrimaryKeyRelatedField(read_only=True)class Meta:model = SKUImage# fields = ('sku', 'image', 'id')fields = '__all__'def create(self, validated_data):#  创建FastDFS连接对象client = Fdfs_client(settings.FASTDFS_PATH)#  获取前端传来的image文件data = self.context['request'].FILES.get('image')# data = request.data#  上传图片到fastDFSres = client.upload_by_buffer(data.read())#  判断是否上传成功if res['Status'] != 'Upload successed.':return Response(status=403)#  获取上传后的路径image_url = res['Remote file_id']#  获取sku_idsku_id = self.context['request'].data.get('sku')[0]#  保存图片img = SKUImage.objects.create(sku_id=sku_id, image=image_url)# 异步生成详情页静态页面get_detail_html.delay(img.sku.id)return img

 注意事项:这儿可能不能直接安装fdfs-client,这儿可以使用提前准备好的安装包文件,pip install fdfs-client-py-master.zip

 关于FastDFS客户端上传文件以及安装各个注意事件,查看博文:

https://blog.csdn.net/weixin_44799217/article/details/118463124


http://chatgpt.dhexx.cn/article/xE2NInav.shtml

相关文章

图片的上传与保存

先找到数据库的用户表点击设计添加 picture 字段与 nvarchar 数据类型 2.更新数据模型,先找到 S_User 表删除,然后再从数据库更新模型并保存 3.先在视图上写出图片上传与保存需要的页面 3.1 { title: ‘头像’, templet: customUserPicture },//头像…

yarn 下载安装

注意 尽量不要使用 npm 下载 yarn 因为可能下载的不是全局的,而且可能没有修改注册表 导致以后下载全局的东西的时候下载失败 如果已经安装了,且出现全局错误提示 可以直接使用 官网安装包 他会自动覆盖你之前的安装,并且擦写 注册表 下…

windows下安装yarn

目录 1.介绍 2.下载和安装 3.配置环境变量和镜像源 1.介绍 最近接触的公司前端项目用到了Yarn,先来了解一下Yarn,Yarn是Facebook最近发布的一款依赖包安装工具。Yarn是一个新的快速安全可信赖的可以替代NPM的依赖管理工具。 官网的说明是 Yarn is …

npm 安装yarn

Yarn是Facebook最近发布的一款依赖包安装工具。Yarn是一个新的快速安全可信赖的可以替代NPM的依赖管理工具 快速安装 //在NPM 中安装 npm install -g yarn MacOS 在Mac上安装比较方便,使用初始化脚本即可 1 curl -o- -L https://yarnpkg.com/install.sh | bash …

yarn常用安装命令

纯属哔哔赖赖瞎扯一下,以前一直用npm install、npm run ,突然来yarn,懵逼了,这是啥?感觉应该是和npm一样的东西,只是这里用yarn,难道它是npm更高级的替代品?为什么要替代npm&#xf…

yarn的安装与使用,以及一些常用命令

官网:首页 | Yarn - JavaScript 软件包管理器 | Yarn 中文文档 - Yarn 中文网 1 - 简介 Yarn 对你的代码来说是一个软件包管理器, 你可以通过它使用全世界开发者的代码,或者分享自己的代码给全世界的开发者。Yarn 做这些事情快捷、安全、可靠…

Node.js安装,npm安装yarn步骤

第一步,首先安装npm npm是node.js下的包管理器,node.js的下载网址 Node.js 1.下载安装包后一路无脑点击next最后点击finish即可,安装完成之后打开文件夹就是以下目录。 2.在cmd窗口输入node -v、npm -v查看版本检查是否安装成功 一般完成以…

yarn的下载与安装

yarn的下载与安装 近期老师留关于antd和antv的作业,安装了好久好久的yarn,一直报错如下: 考虑到yarn的安装出错主要是由于没有进行全局安装或者安装路径有问题。用npm安装时较容易导致无法进行全局安装,为了避免这一问题&#xff…

windows安装yarn 详细教程

1、yarn介绍:yarn是一个代码包管理器,它允许我们与来自世界各地的其他开发人员共享代码。想要更多了解可以进入官网查看:https://yarnpkg.com/getting-started 2、进入yarn官网,可以看见官网已经声明从新版本(16.10)开始&#xf…

yarn安装与配置【Windows】

📚文章导航 前言下载安装1. 官方安装包2. ⭐️ npm 命令安装 配置1. 环境变量2. 下载目录3. 淘宝镜像源 前言 今天在使用 hexo 搭建个人博客的时候,遇到了yarn install dependencies卡死的情况,之后发现 yarn 命令也不起作用了,经…

【yarn】 yarn的安装和使用

yarn的简介:Yarn是facebook发布的一款取代npm的包管理工具。yarn的特点:速度超快。Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率,因此安装速度更快。超级安全。在执行代码之前&am…

Yarn 安装与使用详细介绍

文章目录 背景什么是 Yarn速度快离线模式可靠可确定性网络优化扁平化模式版本控制其他关于 Yarn 的介绍 Yarn 安装windowsmac方式一方式二 Yarn 换源Yarn 常用命令Yarn 独有的命令 特性推荐阅读 背景 在 Node 生态系统中,依赖通常安装在项目的 node_modules 文件夹…

yarn的安装和使用(极其详细)

一、yarn的简介: Yarn是facebook发布的一款取代npm的包管理工具。 二、yarn的特点: 速度超快。Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。 同时利用并行下载以最大化资源 利用率,因此安装速度更快。超级安全。在…

使用npm安装yarn

很多同学用惯了npm安装项目依赖, 想要尝试使用yarn的命令, 但是第一次使用yarn的时候,发现报错, 这是什么情况呢? 因为,想要使用yarn,需要首先安装yarn。 那么问题来了,如何安装呢…

Python库之numpy库的安装教程

一、numpy简介 NumPy是一个功能强大的Python学习库,主要用于对多维数组执行计算。NumPy这个词来源于两个单词-- Numerical和Python。NumPy提供了大量的库函数和操作,可以帮助程序员轻松地进行数值计算。这类数值计算广泛用于以下任务: 1.机…

Numpy库的学习(一)

今天来学习一下Python库中,支持高级大量的维度数组与矩阵运算的神奇的Numpy库 Numpy同时也对数组运算提供大量的数学函数,对于大量计算运行效率极好 是大量机器学习框架的基础库 废话不多说,直接开整 Numpy中最核心的结构就是ndarray数组…

Numpy库的下载及安装(吐血总结)

Python很火,我也下了个来耍耍一阵子。可是渐渐地,我已经不满足于它的基本库了,我把目光转到了Numpy~~~~~ 然而想法总是比现实容易,因为我之前下的是Python3.3.x,所有没有自带pip!!!&…

Python - Numpy库的使用(简单易懂)

目录 numpy多维数组——数组的创建 1、array函数创建数组对象 2、通过arange、linspace函数创建等差数组对象 3、通过logspace函数创建等比数列数组 函数 zeros ones diag eye full numpy多维数组——生成随机数 函数 seed rand randn randint 函数 binomial normal 和…

python的 numpy库学习总结和介绍(超详细)模块

目录 前言 numpy是什么? 一、创建数据容器 1.np.array(),通过传递一个列表,元祖来创建 2.np.zeros(),np.ones(),np.empty(),np.full(),传递对应的形状参数,来创建一个初始化的数组 3.np.linspace()与np.arange()的使用 4.运用np.random…

Python库-numpy详解

Python库-numpy详解 1. ndarray介绍2. ndarray的基本操作生成数组数组索引、切片修改数组形状修改数组类型数组去重删除元素 3. ndarray运算逻辑运算通用判断函数三元运算符统计运算数组运算 4. matrix 矩阵介绍5. Python中矩阵运算扩展:正态分布简介正态分布图方差…