uni-app上传头像base64转码

uni-app上传头像base64转码

首先需要调起相册,使用 uni.chooseImage 方法选择相册,点击相册里面的图片,
确定可以选择图片并获取到图片的路径之后,uni-app官网有插件可以来使用,引入插件之后,使用插件的方法就可以获取base64转码。
插件网址:http://ext.dcloud.net.cn/plugin?id=123
完整代码

路径记得写成自己文件所在的路径

import { pathToBase64, base64ToPath } from '../../../common/image-tools.js'
 uni.chooseImage({
	 sourceType: ["camera", "album"],
	 sizeType: "compressed",
	 count: 1,
	 success: (res) => {
		 pathToBase64(res.tempFilePaths[0])
			.then(base64 => {
				console.log(base64);
			 })
			 .catch(error => {
				console.error(error);
			 });
  		}
    });
UniApp是一个基于 Vue.js 的跨平台框架,它允许开发者构建一次,运行于多个平台上,包括Web、H5、iOS、Android等。要在 UniApp 中实现实时音频录制并发送为语音文件,你可以采用以下步骤: 1. **引入所需模块**: 首先,在项目中安装必要的插件,如 `uni-mediarecorder` 和 `uni-file-opener`,用于音频处理和文件操作。 ```bash npm install uni-mediarecorder uni-file-opener ``` 2. **配置权限**: 在项目的 App.json 或全局 JSON 文件中,添加对麦克风访问的权限声明。 ```json "permission": { "scope.permission microphone": { "desc": "需要访问您的麦克风" } } ``` 3. **设置录音组件**: 使用 `uni-mediarecorder` 组件创建一个录音功能,监听录音完成事件 (`onchange`)。 ```html <template> <view> <uni-mediaRecorder :duration="recordingDuration" ref="mediaRecorder" :format="audioFormat" @change="handleRecordChange" ></uni-mediaRecorder> <button @click="startRecording">开始录音</button> <button @click="stopRecording">停止录音</button> </view> </template> <script> export default { data() { return { recordingDuration: 10, audioFormat: 'mp3', // 支持的格式如 mp3, wav 等 audioBlob: null, }; }, methods: { startRecording() { this.$refs.mediaRecorder.start(); }, stopRecording() { this.$refs.mediaRecorder.stop(); }, handleRecordChange(e) { const blob = e.detail.blob; if (blob.size > 0) { // 录音完成后转码成适合发送的格式(例如 base64) this.convertAudioBlobToBase64(blob); } else { console.error('录音失败'); } }, convertAudioBlobToBase64(audioBlob) { uni.fileManager.readFile({ filePath: audioBlob.name, // 获取到的文件路径 type: 'binary', }).then((res) => { this.audioBase64 = window.btoa(res.data); // 发送base64编码的音频数据 this.sendVoice(this.audioBase64); }); }, sendVoice(base64Data) { // 发送接口将 base64 数据作为语音内容 // 示例:axios.post('/api/sendVoice', { voiceBase64: base64Data }) }, }, }; </script> ``` 4. **处理发送**: 完成录音并转换为 Base64 后,调用接口将语音数据发送给服务器,这里假设已经实现了 API 接口。 注意:实际应用中,你可能需要处理更多边缘情况,并确保在用户停止录音时能正确停止录音,以及处理网络请求等异常。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值