微信小程序的wx.chooseImage如何把图片传给后端

A00湖北云购科技

微信小程序的wx.chooseImage如何把图片传给后端

首选wx.chooseImage的用法先见官方文档 => wx.chooseImage
这个的返回值如下↓

这里可以看到 这个tempFilePaths是临时文件大致长下面这弔样
http://tmp/XvcnafLyJvBMd3fb70a1e37afc2dffd2463c0f893f88.jpg
只能本地自己用用 但如果离开本地 就用不了 非常蛋疼

这时就要用到解决的关键

wx.uploadFile

这个是用于上传文件的 官方文档 => wx.uploadFile
要使用到的参数如下

1. wx<span class="token punctuation">.</span><span class="token function">chooseImage</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
   
2.             count<span class="token operator">:</span> <span class="token number">1</span><span class="token punctuation">,</span>
   
3.             sourceType<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token string">'album'</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
   
4.             <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
   
5.               <span class="token keyword">let</span> temp_path <span class="token operator">=</span> res<span class="token punctuation">.</span>tempFilePaths<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">;</span>
   
6.               console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>temp_path<span class="token punctuation">)</span><span class="token punctuation">;</span>
   
7.               wx<span class="token punctuation">.</span><span class="token function">uploadFile</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
   
8.                 filePath<span class="token operator">:</span> temp_path<span class="token punctuation">,</span>
   
9.                 name<span class="token operator">:</span> <span class="token string">'后端要求的参数名'</span><span class="token punctuation">,</span>
   
10.                 url<span class="token operator">:</span> <span class="token string">'接口的url'</span><span class="token punctuation">,</span>
    
11.                 <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
    
12.                   console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>res<span class="token punctuation">.</span>data<span class="token punctuation">)</span><span class="token punctuation">;</span>
    
13.                 <span class="token punctuation">}</span><span class="token punctuation">,</span>
    
14.                 <span class="token function-variable function">fail</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
    
15.                   console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"失败..."</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    
16.                 <span class="token punctuation">}</span>
    
17.               <span class="token punctuation">}</span><span class="token punctuation">)</span>
    
18.             <span class="token punctuation">}</span>
    
19.           <span class="token punctuation">}</span><span class="token punctuation">)</span>

复制代码

如上 只要把你相册中选取图片的临时路径 传给uploadFile里的filepath 然后把后端给你的接口放上 就能用了 非常地 简单。。。
但是我研究了一个早上加一个下午才研究出来了 中间试过wx.downloadFile 和 wx.getImageInfo 来组合 这个chooseImage 但是都不行
最终还是被uploadFile救赎了。