您的位置:首页 > 移动开发 > 微信开发

微信页面上传图片,安卓和ios上传接口的兼容处理

2017-07-10 09:30 495 查看
1.引入微信js,注意是1.2.0版本的,之前用1.1.0 ios一直有问题

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

2.微信上传接口调用

<form>
姓名<input type="text" name="uname"><br>
电话<input type="text" name="utel"><br>
<img id="image1" onclick="chooseImage(this)" style="width: 100px;height: 100px;border: 1px solid red;"><input type="hidden" name="img[]">
<img id="image2" onclick="chooseImage(this)" style="width: 100px;height: 100px;border: 1px solid red;"><input type="hidden" name="img[]">
<img id="image3" onclick="chooseImage(this)" style="width: 100px;height: 100px;border: 1px solid red;"><input type="hidden" name="img[]">
<br>
<input type="button" name="" value="提交" id="sub">
</form>

function chooseImage(obj){

    // 选择张片

    wx.chooseImage({

        count: 1, // 默认9

        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

        success: function(res) {

            var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片

            $(obj).attr('src', localIds);

            // 上传照片

            wx.uploadImage({

                localId: '' + localIds,

                isShowProgressTips: 1,

                success: function(res) {

                    serverId = res.serverId;

                    $(obj).next().val(serverId); // 把上传成功后获取的值附上

                    

                }

            });

        }

    });

}

3.上传图片

 $("#sub").on("click",function(){

         $.ajax({

            type:'POST',

            url:"file.php",

            data:$("form").serialize(),

            dataType: 'json',

            success : function(data){

                       alert(data);            

                 }

        });

    })

4.服务器端接收处理图片

<?php

header("Content-type:text/html;charset=utf-8");

session_start();

error_reporting(0);

require_once 'jssdk.php';

require_once 'DBHelper.class.php';

$AppID='****************';//必须改写*该项目公众账户appid,在公众帐号平台开发者模式中获取

$AppSecret='*************';//必须改写*该项目公众账户appsecret(该值为可变动值,如公众平台重置,则需改写),获取同上

$jssdk = new JSSDK($AppID,$AppSecret);

foreach ($_POST['img'] as $key => $value) {
$file[]=$jssdk->getmedia($value);

}

echo json_encode($file);

?>

// 获取图片地址

   function getmedia($media_id){

        $access_token=$this->getAccessTokens();

        $url = "http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=".$access_token."&media_id=".$media_id;

        if (!file_exists("./Uploads/")) {

            mkdir("./Uploads/", 0777, true);

        }

        $targetName = './Uploads/'.date('YmdHis').rand(1000,9999).'.jpg';

        $ch = curl_init($url); // 初始化

        $fp = fopen($targetName, 'wb'); // 打开写入

        curl_setopt($ch, CURLOPT_FILE, $fp); // 设置输出文件的位置,值是一个资源类型

        curl_setopt($ch, CURLOPT_HEADER, 0);

        curl_exec($ch);

        curl_close($ch);

        fclose($fp);

        return $targetName;

    }
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  微信上传 ios 图片