使用jQuery的ajax提交图片信息

1 设置图片id(html)

首先,定义上传图片的id,根据上传文件的id获取图片信息:

 注:图片的id应该设置在input标签里面

 2 发送ajax请求(js)
var formData = new FormData();
formData.append("file", jQuery("#photo_input")[0].files[0]);
if(formData!=null){
  jQuery.ajax({
  url:"/user/photo",
  type:"POST",
  data:formData,
  contentType: false,
  processData: false,
  success:function(res){
      if(res.code==200&&res.data!=null){
         jQuery("#photo").attr("src",res.data);
      }
      else{
         alert("修改失败!"+res.data);
      }
 }
 });
}

参数说明:

  • type:获取文件,必须使用"POST";
  • processData:默认情况下为true,通过data选项传递进来的数据,如果是一个对象,都会出来转化成一个查询字符串,如果要发送不希望转换的信息,要设置为false;
  • contentType:默认值:“application/x-www-form-urlencoded”。发送信息至服务器时内容编码类型。默认值适合大多数情况。如果你明确地传递了一个 content-type 给 jQuery.ajax() 那么它必定会发送给服务器。
3 后端处理
  public AjaxResult photo(MultipartFile file, HttpServletRequest request){
        //从参数中获取用户
        Userinfo userinfo=SessionUtil.getUser(request);
        if(userinfo==null||userinfo.getUid()<=0){
            return AjaxResult.fail(-1,"请先登录");
        }
        //获取原来的文件名和后缀
        String originalFilename=file.getOriginalFilename();
        String ext = "."+ originalFilename.split("\\.")[1];
        //生成一个新的文件名(以防有重复的名字存在导致被覆盖)
        String uuid = UUID.randomUUID().toString().replace("-", "");
        String newName = uuid + ext;
        String path =imagepath+newName;//保存路径newName;
        try {
            file.transferTo(new File(path));
        } catch (IOException e) {
            e.printStackTrace();
        }
        String urlpath = "/image/"+newName;
        //将文件名更新到数据库中
        int result=userService.updatephoto(urlpath,userinfo.getUid());
        //将处理结果返回给前端
        return AjaxResult.succ(urlpath);
   }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/40424.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

day40-Mybatis(resultMap拓展)

0目录 Mybatis-resultMap拓展 1.2.3 1.数据库字段和javabean实体类属性不一致时 解决方案1&#xff1a;将sql语句中给予别名&#xff08;别名同javabean中实体类保持一致&#xff09; 解决方案2&#xff1a;使用resultMap 2.两表关联&#xff08;用户表和角色表关联查询&…

【算法基础:数据结构】2.2 字典树/前缀树 Trie

文章目录 知识点cpp结构体模板 模板例题835. Trie字符串统计❤️❤️❤️❤️❤️&#xff08;重要&#xff01;模板&#xff01;&#xff09;143. 最大异或对&#x1f62d;&#x1f62d;&#x1f62d;&#x1f62d;&#x1f62d;&#xff08;Trie树的应用&#xff09; 相关题目…

【UE4 塔防游戏系列】06-炮塔发射子弹攻击敌人

效果 步骤 1. 新建一个Actor蓝图类&#xff0c;命名为“TotalBulletsCategory”&#xff0c;用来表示子弹蓝图总类&#xff0c;后面会有很多不同类型的子弹会继承该类 打开“TotalBulletsCategory”&#xff0c;添加粒子系统组件、盒体碰撞组件和发射物移动组件 调整发射物重力…

电压放大器在超声波焊接中的作用以及应用

电压放大器是一种运用于电子设备中的信号放大器&#xff0c;主要作用是将小信号放大为更高幅度的信号。在超声波焊接中&#xff0c;电压放大器起到了重要的作用&#xff0c;它可以将从传感器采集到的微小信号放大为能够被检测和处理的合适大小的信号。 超声波焊接是现代工业生产…

使用shell监控应用运行状态通过企业微信接收监控通知

目的&#xff1a;编写shell脚本来监控应用服务运行状态&#xff0c;若是应用异常则自动重启应用通过企业微信接收监控告警通知 知识要点&#xff1a; 使用shell脚本监控应用服务使用shell脚本自动恢复异常服务通过企业微信通知接收监控结果shell脚本使用数组知识&#xff0c;…

二次元少女-InsCode Stable Diffusion 美图活动一期

一、 Stable Diffusion 模型在线使用地址&#xff1a; https://inscode.csdn.net/inscode/Stable-Diffusion 二、模型相关版本和参数配置&#xff1a; 模型版本&#xff1a;chilloutmix_NiPrunedFp32Fix.safetensors 采样方法(Sampler)Sampling method&#xff1a;DPM SDE …

xpath下载安装——Python爬虫xpath插件下载安装(2023.7亲测可用!!)

目录 1.免费下载插件链接&#xff08;若失效评论区留言发送最新链接&#xff09;&#xff08;2023.7亲测可用&#xff09; 2.安装插件 &#xff08;1&#xff09;打开chrome浏览器页面&#xff0c;点击&#xff1a;右上角三个点 > 扩展程序 > 管理拓展程序 &#xff…

2023-7-19-第二十式迭代器模式

&#x1f37f;*★,*:.☆(&#xffe3;▽&#xffe3;)/$:*.★* &#x1f37f; &#x1f4a5;&#x1f4a5;&#x1f4a5;欢迎来到&#x1f91e;汤姆&#x1f91e;的csdn博文&#x1f4a5;&#x1f4a5;&#x1f4a5; &#x1f49f;&#x1f49f;喜欢的朋友可以关注一下&#xf…

TortoiseGit 入门指南12:创建标签

前面的文章不止一次的提到过 标签 &#xff08;Tag&#xff09;&#xff0c;我们在《TortoiseGit 入门指南08&#xff1a;浏览引用以及在引用间切换》一文中知道&#xff0c;标签 是一种 引用&#xff1b;还知道每个提交都对应着一个 SHA-1 值&#xff0c;而引用就是 SHA-1 的一…

SuperGlue学习记录之最优传输

在进行最优传输相关理论的学习过程中&#xff0c;找到SuperGlue这篇论文&#xff0c;该篇论文通过最优传输来完成特征点的匹配过程。 SuperGlue结构 先来看一下其结构&#xff1a; 首先将两张图片送入特征提取网络&#xff0c;通过卷积网络提取出特征&#xff0c;主要有四个值…

Generative Adversarial Network

Goodfellow,2014年 文献阅读笔记--GAN--Generative Adversarial NetworkGAN的原始论文-组会讲解_gan英文论文_Flying Warrior的博客-CSDN博客 启发:如何看两个数据是否来自同一个分布? 在统计中,two sample test。训练一个二分类的分类器,如果能分开这两个数据,说明来自…

网络安全—信息安全—黑客技术(学习笔记)

一、什么是网络安全&#xff1f; 网络安全可以基于攻击和防御视角来分类&#xff0c;我们经常听到的 “红队”、“渗透测试” 等就是研究攻击技术&#xff0c;而“蓝队”、“安全运营”、“安全运维”则研究防御技术。 无论网络、Web、移动、桌面、云等哪个领域&#xff0c;都…

[深度学习入门]什么是神经网络?[神经网络的架构、工作、激活函数]

目录 一、前言二、神经网络的架构——以手写数字识别三、神经网络的工作1、单输入单输出感知器函数2、二维输入参数3、三维输入参数 四、激活函数1、激活函数2、ReLU激活函数3、非线性激活函数&#xff08;1&#xff09;二输入二输出的神经网络的架构&#xff08;2&#xff09;…

计算机网络 day8 动态路由 - NAT - SNAT实验 - VMware的网卡的3种模式

目录 动态路由&#xff1a;IGP 和 EGP 参考网课&#xff1a;4.6.1 路由选择协议概述_哔哩哔哩_bilibili ​编辑 IGP&#xff08;Interior Gateway Protocol&#xff09;内部网关协议&#xff1a; EGP&#xff08;Interior Gateway Protocol&#xff09;外部网关协议&#x…

使用模板创建【vite+vue3+ts】项目出现 “找不到模块‘vue‘或其相应的类型声明” 的解决方案

问题描述 项目前台需要使用Vue3Ts来写一个H5应用&#xff0c;然后我用模板创建 npm create vitelatest vue3-vant-mobile -- --template vue-ts创建完后进入HelloWorld.vue&#xff0c;两眼一黑 解决办法一 npm i --save-dev types/node然后在tsconfig.json的"compi…

软件测试银行项目面试过程

今天参加了一场比较正式的面试&#xff0c;汇丰银行的视频面试。在这里把面试的流程记录一下&#xff0c;结果还不确定&#xff0c;但是面试也是自我学习和成长的过程&#xff0c;所以记录下来大家也可以互相探讨一下。 请你做一下自我介绍&#xff1f;&#xff08;汇丰要求英…

Kind | Kubernetes in Docker 把k8s装进docker!

有点像杰克船长的黑珍珠 目录 零、说明 一、安装 安装 Docker 安装 kubectl 安装 kind 二、创建/切换/删除集群 创建 切换 删除 将镜像加载到 kind 群集中 零、说明 官网&#xff1a;kind Kind&#xff1a; Kubernetes in Docker 的简称。kind 是一个使用 Docker 容…

TortoiseGit 入门指南11:还原与重置

Git 就像个时光机器&#xff0c;能让我们还原到任何提交。 还原未提交的更改 假如我们在查看一个干净的代码仓库&#xff0c;干净意味着工作区中的文件保持着最后一次提交的状态&#xff0c;没有修改。在查看的过程中&#xff0c;我们有意或无意的修改了工作区中的文件&#…

MySQL数据库(五)

目录 一、数据库的约束 1.1 约束类型 1.1.1 null约束 1.1.2unique约束 1.1.3default默认值约束 1.1.4primary key主键约束 1.1.5foreign key外键约束 二、内容重点总结 一、数据库的约束 1.1 约束类型 not null - 指示某列不能存储 null值。unique - 保证某列的每行必须有唯一…

blender 叶片制作

圆润叶片 效果展示 shift a 新建矩形&#xff0c;s y 延 y 轴方向压扁&#xff0c;ctrl r 循环切割&#xff0c;滚动滚轮&#xff0c;延 y 轴方向切两条循环线&#xff0c;框选点&#xff0c;s 缩放&#xff0c;调整到叶片造型&#xff0c;添加细分修改器&#xff1b;给叶片…