小程序图片上传 wx.uploadFile 后台java PHP两个版本

栏目: Java · 发布时间: 4年前

内容简介:上传图片:前台选择图片并把临时地址上传后台,后台把图片上传至自己的服务器,以下是上传图片的方法,有后台是java的还有PHP的,如有疑问或不解,请留言。前端:wxml:<view class='quan' bindtap='addTeamImage' >+</view>//定义添加图片的点击点。

上传图片:前台选择图片并把临时地址上传后台,后台把图片上传至自己的服务器,以下是上传图片的方法,有后台是 java 的还有 PHP 的,如有疑问或不解,请留言。

前端:

wxml:<view class='quan' bindtap='addTeamImage' >+</view>//定义添加图片的点击点。

js:

addTeamImage: function () {      //对应wxml的点击事件

var that = this;

wx.chooseImage({    //选择图片

count: 1,

success: function (res) {    //选择图片成功

var tempFilePaths = res.tempFilePaths; //图片临时地址

that.setData({defaultHead: tempFilePaths[0]  });

wx.uploadFile({     //上传图片

url: saveRunteamImgUrl,    //后台上传图片的方法地址

filePath: tempFilePaths[0],    //上传图片的临时地址

name: 'file',      //文件格式

success: function (res) {    //上传成功

let obj = JSON.parse(res.data)      //返回值是json格式转化成object

that.setData({

teamHeadUrl: obj.data     //将返回的图片服务器地址保存在变量中

})

if (obj.data == "error") {     //后台的上传方法出现问题

wx.showToast({ title: '图片上传失败,请重试!', icon: 'none', duration: 2000 })

that.setData({ teamHeadUrl: '' })

}},

})},

fail: function (res) {     //图片上传失败

that.setData({ teamHeadUrl: '' })

}})},

java后台:

ImageController.java

package com.th.controller;

//引入文件

import org.springframework.web.bind.annotation.*;

import org.springframework.web.multipart.MultipartFile;

import org.springframework.web.multipart.MultipartHttpServletRequest;

import javax.servlet.http.HttpServletRequest;

import java.io.File;

import java.io.IOException;

import java.util.Map;

/**

  • Created by wanglimin on 2019/1/31.

*/

@RestController

@RequestMapping("/image")

public class ImageController extends BaseController { //声明上传图片类文件

@ResponseBody
@RequestMapping(value = "/uploadImage", method = RequestMethod.POST,produces = "application/json")
public Map<String,Object> uploadImage(HttpServletRequest request) throws IOException {
    MultipartHttpServletRequest req =(MultipartHttpServletRequest)request;
    MultipartFile multipartFile =  req.getFile("file");

    String realPath = "https://www.***.com/image";//服务器存放图片地址
        try {
        File dir = new File(realPath);
        if (!dir.exists()) {
            dir.mkdir();
        }
        String newPath = System.currentTimeMillis()+""+(int)(1+Math.random()*(10000-1+1))+".jpg";//图片名称是毫秒数加1-10000的随机数
        File file  =  new File(realPath,newPath);
        multipartFile.transferTo(file);
        return rtnParam(0,file.getPath());    // 返回图片上传到服务器上的地址
    } catch (IOException e) {
        e.printStackTrace();
    } catch (IllegalStateException e) {
        e.printStackTrace();
    }

    return rtnParam(0,"error");     //方法错误   rtnParam是继承base类中的方法
}

}

BaseController.java

public class BaseController {

private Map<String, Object> errorCodeMap;

protected Map<String, Object> rtnParam(Integer errorCode, Object data) {
    errorCodeMap = new HashMap<String, Object>();
    errorCodeMap.put("errorCode", errorCode);
    errorCodeMap.put("data", data);
    return errorCodeMap;
}

}

PHP后台

<?php

namespace ApiController;

use ThinkUpload;

use ThinkPage;

use ThinkController;

/**

*

* 客户端接口唯一入口

* @author Administrator

*

*/

class DefaultPostController extends Controller {   //注:前台的上传图片连接后台地址改:' https:// * .com/api/defaultPost'’

public function index(){

if(IS_POST){

$obj = new ThinkUpload();// 实例化上传类

$obj->maxSize = 2048000 ;// 设置附件上传大小

$obj->savePath ='/runteam/'; // 设置附件上传目录

$obj->exts =  array('jpg','jpeg','gif','png');// 设置附件上传类型

$obj->saveName = array('uniqid','');//文件名规则

$obj->replace = true;//存在同名文件覆盖

$obj->autoSub = false;//使用子目录保存

// 上传文件 gb

$info =  $obj->upload();

$file = $info['file'];

$return = $file['savepath'].$file['savename'];

header('Content-Type:application/json; charset=utf-8');

exit(json_encode($return));  //返回服务器图片地址

}

}

}

获取更多文章,请关注公众号。

小程序图片上传 wx.uploadFile 后台java PHP两个版本


以上所述就是小编给大家介绍的《小程序图片上传 wx.uploadFile 后台java PHP两个版本》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

人类2.0

人类2.0

皮埃罗∙斯加鲁菲(Piero Scaruffi) / 闫景立、牛金霞 / 中信出版集团股份有限公司 / 2017-2-1 / CNY 68.00

《人类2.0:在硅谷探索科技未来》从在众多新技术中选择了他认为最有潜力塑造科技乃至人类未来的新技术进行详述,其中涉及大数据、物联网、人工智能、纳米科技、虚拟现实、生物技术、社交媒体、区块链、太空探索和3D打印。皮埃罗用一名硅谷工程师的严谨和一名历史文化学者的哲学视角,不仅在书中勾勒出这些新技术的未来演变方向和面貌,还对它们对社会和人性的影响进行了深入思考。 为了补充和佐证其观点,《人类2.0......一起来看看 《人类2.0》 这本书的介绍吧!

URL 编码/解码
URL 编码/解码

URL 编码/解码

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具