微信 Java 实现JS-SDK 图片上传下载完整流程

前置知识

在开发过程中，我们需要了解微信JS-SDK的基本使用方法和原理，了解微信开放平台的基础知识。同时，我们还需要通过Java语言来实现JS-SDK的图片上传下载功能。

实现过程

步骤一：申请应用密钥和JS-SDK权限

在微信开放平台上为自己的应用申请应用密钥，并在公众号后台开启JS-SDK权限。获取JS-SDK权限的方式可参考微信官方文档：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html

步骤二：引入JS-SDK资源和SHA1算法

引入微信JS-SDK资源以及SHA1算法，这里我们通过CDN方式进行引入，代码如下：

<script src="//res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script src="//cdn.bootcdn.net/ajax/libs/jsSHA/2.0.2/sha.js"></script>

步骤三：配置JS-SDK

通过配置weixin.config()的参数，可以完成对JS-SDK的配置。其中，需要开发者填写自己的AppID、timestamp、nonceStr和signature等参数，代码如下：

wx.config({
    appId: '',
    timestamp: ,
    nonceStr: '',
    signature: '',
    jsApiList: []
});

步骤四：实现图片上传功能

调用微信JS-SDK的chooseImage接口，可让用户从相册或相机中选择图片，并上传至微信服务器。上传成功后，微信服务器将返回图片的服务器ID，我们可以通过该ID获取图片的URL。

以下是基于Java语言实现图片上传的示例代码：

private String uploadFile(String accessToken, String url, File file) {
    String result = "";
    try {
        CloseableHttpClient httpClient = HttpClients.createDefault();
        HttpPost httpPost = new HttpPost(url + "?access_token=" + accessToken + "&type=image");
        httpPost.setHeader("User-Agent", "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36");
        FileBody bin = new FileBody(file);
        HttpEntity entity = MultipartEntityBuilder.create().addPart("media", bin).build();
        httpPost.setEntity(entity);
        CloseableHttpResponse response = httpClient.execute(httpPost);
        HttpEntity responseEntity = response.getEntity();
        if (responseEntity != null) {
            result = EntityUtils.toString(responseEntity, Charset.forName("UTF-8"));
        }
        response.close();
        httpClient.close();
    } catch (IOException e) {
        e.printStackTrace();
    }
    return result;
}

步骤五：实现图片下载功能

调用微信JS-SDK的downloadImage接口，可根据图片的服务器ID，将图片下载至本地。以下是基于Java语言实现图片下载的示例代码：

private void downloadFile(String accessToken, String mediaId, String outputPath) {
    CloseableHttpClient httpClient = HttpClients.createDefault();
    HttpGet httpGet = new HttpGet("https://api.weixin.qq.com/cgi-bin/media/get?access_token=" + accessToken + "&media_id=" + mediaId);
    try {
        CloseableHttpResponse response = httpClient.execute(httpGet);
        HttpEntity entity = response.getEntity();
        if (entity != null) {
            FileOutputStream fos = new FileOutputStream(outputPath);
            entity.writeTo(fos);
            fos.close();
        }
        response.close();
        httpClient.close();
    } catch (IOException e) {
        e.printStackTrace();
    }
}

总结

通过以上步骤，我们成功实现了微信JS-SDK图片上传下载的功能。需要注意的是，JS-SDK的使用需要合法有效的签名，图片上传下载的功能在本地开发环境下可能会失败，请在公网服务器上测试实际效果。

END