ajax上传多图到php服务器的方法 - 网站

ajax上传多图到php服务器的方法

分类:js_jQuery答疑 - 常见问题 · 发布时间:2021-11-16 17:06 · 阅读:4446

这篇文章主要为大家详细介绍了ajax上传多图到php服务器的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

一般上传图片到服务器有两种方式:

1、把图片转换成二进制直接存储到数据库里

2、把图片存储到本地目录,并将图片地址存储到数据库里

先粗浅地谈下我对这两种存储方法的优劣点的认识:

1、把图片转换成二进制直接存储到数据库的优点是有利于数据的备份和迁移,但缺点就是会影响数据读写速率。一般大图、多图不建议用此方式,一般存储用户头像、富文本内容存储时可以应用此方式。

2、将图片存储到本地目录,在数据库上只存储图片路径的优点是有利于数据的读写,毕竟存一个地址要比存整个图片的大小要小得多。但是缺点就不利于数据的备份和迁移。

先介绍一下存储图片路径的方法:

html代码:

 

ajax请求:

 function fsubmit() { var form1=document.getElementById("form1"); var fd =new FormData(form1); $.ajax({ url: "photo.php", type: "POST", data: fd, processData: false, contentType: false, success: function(response,status,xhr){ console.log(xhr); var json=$.parseJSON(response); var result = ''; result += '
'; result += '
'; result += '
' + json['photo1']; result += '
' + json['photo2']; $('#result').html(result); } }); return false; }

php代码:photo.php

 //注意要在目录下新建一个名为img的文件夹用来存放图片 $path2 = "img/" . $filename2; if(move_uploaded_file($_FILES['photo1']['tmp_name'], $path1) && move_uploaded_file($_FILES['photo2']['tmp_name'], $path2) ){ $response['isSuccess'] = true; $response['photo1'] = $path1; $response['photo2'] = $path2; }else{ $response['isSuccess'] = false; } echo json_encode($response); ?> 

数据库表我就不贴了,存图片地址,字段类型直接用字符型就可以了。

现在在介绍一下把图片转换成二进制直接存进数据库的方法:

这里我没有用ajax请求,直接用表单的post 请求提交数据

html代码:

 
上传头像

php代码:photo.php

  

这样就把图片转换成二进制并储存进数据库了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持html中文网。

标签:
ajax 上传 服务器

相关文章

AJAX乱码与异步同步以及封装jQuery库实现步骤详解

这篇文章主要介绍了异步通信技术AJAX乱码问题、异步与同步、手动封装一个jQuery库,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习吧

AJAX的跨域问题解决方案

跨域简单的说,就是从一个域名的网页去访问另一个域名网页的资源,下面这篇文章主要给大家介绍了关于AJAX的跨域问题解决的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

利用Ajax实现智能回答的机器人示例代码

这篇文章主要介绍了利用Ajax实现智能回答的机器人,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

ajax、axios和fetch之间优缺点重点对比总结

今天被问到用没用过ajax axios,我回答经常用axios,但ajax用的比较少,下面这篇文章主要给大家介绍了关于ajax、axios和fetch之间优缺点重点对比总结的相关资料,需要的朋友可以参考下

如何通过axios发起Ajax请求(最新推荐)

Axios是专注于网络数据请求的库,相比于原生的XMLHttpRequest对象,axios简单易用。相比于Jquery,axios更加轻量化,只专注于网络数据请求,这篇文章主要介绍了如何通过axios发起Ajax请求,需要的朋友可以参考下

返回分类 返回首页