当前位置:首页 » 网页前端 » 前端怎么传图片给后端
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

前端怎么传图片给后端

发布时间: 2022-06-02 21:24:00

‘壹’ 我用的是ssh框架,前端传了一个图片到后台,后台将图片写进了我的本地磁盘,数据库也存贮了图片的地址,

在前端图片处鼠标右键查看属性。看看显示的内容是图片还是地址还是其他的。
如果显示的是图片,你看看从前端别的工具能不能直接访问图片。
如果显示的是网址或者图片地址,那就是代码问题了。。

‘贰’ 前端将图片转换为base64位,使用ajax传递到后台,但是图片经过base64转换成字符串后非常长,无法使用ajax

前端JS
var reader = new FileReader();
reader.onload = function (e) {
//图片base64数据
var imgBase64Data = e.target.result;
var pos = imgBase64Data.indexOf("4")+2;
imgBase64Data = imgBase64Data.substring(pos, imgBase64Data.length - pos);//去掉Base64:开头的标识字符
$.ajax({
type: "POST",
url: "http://imginapi.com/image/AddImage",
async: false,
xhrFields: { withCredentials: true },
data: { 'base64StrImgData': imgBase64Data, 'imgFormat': fileext},
dataType: "text",
success: function (data) {
alert(data);
domUtils.on(iframe, 'load', callback);
},

error: function (err) {
alert("error");
alert(err.responseText);
}

});
return;

};
reader.readAsDataURL(input.files[0]);

后台C#代码:
/// <summary>
/// 图像转换为Base64编码
/// </summary>
/// <param name="image">图像</param>
/// <param name="format">图像格式</param>
/// <param name="throwException">出现异常时是否抛出</param>
/// <returns>转换成功返回其Base64编码;失败返回空串</returns>
public static string ImageToBase64(System.Drawing.Image image, ImageFormat format, OPResult opRes, bool throwException = false)
{
return ExceptionHelper.ExceptionRecord(() =>
{
string base64String = "";
try
{
using (MemoryStream ms = new MemoryStream())
{
image.Save(ms, format);
byte[] imageBytes = ms.ToArray();
base64String = Convert.ToBase64String(imageBytes);
}
}
catch (Exception ex)
{
throw new Exception("将图片转成base64字符串时出现异常:" + ex);
}

return base64String;
}, opRes, throwException);
}

‘叁’ 前端发送数据到后端

前段发送数据到后端有两种方式post和get方式:

$.ajax({
type:"post",
url:"api.php",
dataType:"json",
success:function(data){

}
});
$.ajax({
type:"get",
url:"api.php",
dataType:"json",
success:function(data){

}
});

这两种都是页面js操作的,也可以直接写下边这种:

window.location.href="api.php?name=aaa&sex=1";

‘肆’ java web前端上传文件到后台常用的几种方式

1、使用form表单提交
但是这里要记得添加enctype属性,这个属性是指定form表单在向服务器提交之前,对表单数据如何进行编码。 文件域中的name="file"属性的值,需要和后台接收的对象名一致,不然接收不到。
2、使用ajax提交文件
使用ajax提交首先引入jquery-form.js文件才能实现,接着使用上面的html代码,加入以js则可以实现ajax提交文件。
3、使用FormData对象
4、后台接收文件,框架采用的Spring Boot 微服务框架,因为该框架搭建很方便所以采用这个框架写例子。

‘伍’ 前端页面怎么传递数据给后端,后端用soringboot调用的过程代码

前端用ajax进行异步网络请求传递数据给服务器:
$.ajax({ url: "test.html", context: document.body, success: function(){
$(this).addClass("done");
}});
后台在自己对应的控制器里获取传递过来的get值或者post值
以PHP举例 可以用$_POST['username']接受POST请求传递过来的username参数

‘陆’ 前端怎么传图片给后台(java)

你可以现在前台控制台打印一下base64的流,看看是否获取图片成功。如果成功再去后台看看获取的文件信息,haerd中是否有数据。
然后就是你没有后台代码,这里也不好判断是否是接收问题

‘柒’ 前端批量上传图片后端怎么接收

循环啊 异步啊,直接转换成base64传到后台,后台循环解码,保存在文件夹里面不就可以了。