uniapp图片上传功能前后端代码(java)

本篇文章分享uniapp图片上传功能前后端代码(java)，对你有帮助的话记得收藏一下，看Java资料网收获更多编程知识

注意点：1.接口名 2.文件大小和类型限制 3.后端服务器要启动 4.如果前后端分离部署，确保后端支持跨域请求（CORS）

前端代码：

<template>
	<view class="main">

		<image :src="imagesrc" @click="onclick" lazy-load=true
			style="top: 470rpx;height: 700rpx;width: 700rpx;padding: 20rpx;"></image>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				imagesrc: "../../static/logo.png"//初始图片
			}
		},
		methods: {

			onclick() {
				var _this = this;

				uni.chooseImage({
					count: 1,//默认为9，我们一次上传一张
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择album，从摄像机选择camera
					success: res => {
						console.log(JSON.stringify(res.tempFilePaths[0]));
						_this.imagesrc = res.tempFilePaths[0],
							uni.uploadFile({
								url: 'http://localhost:8080/Oss/upload', //仅为示例，非真实的接口地址
								filePath: _this.imagesrc,
								name: 'file',
								formData: {
								//这里面是和图片一起传过来的数据

								},
								success: (uploadFileRes) => {
									console.log("上传至后端成功")
									console.log(uploadFileRes.data);
								},
								fail: (res) => {
									console.log("上传至后端失败")
								}
							});
						console.log("图片上传至本地成功")
					},
					fail: function(res) {
						console.log("图片上传至本地失败");
					},
				});
			}
		}

	}
</script>

<style lang="scss" scoped>

</style>

不需上传到后端已经可以实现将前端照片更换，但是图片只是临时存储，下次登录又消失了
效果图

java后端接受代码

重要点就 这两个，接受格式和后端的业务逻辑代码，（我这里是上传到阿里云OSS）上传的代码详细见（java上传文件至阿里云OSS）

文章来源:https://blog.csdn.net/2201_75559074/article/details/143021404
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若内容造成侵权/违法违规/事实不符，请联系邮箱：jacktools123@163.com进行投诉反馈，一经查实，立即删除！