yii2和微信那点事 / 关于微信小程序正确显示yii2高级版restful接口编码为base64编码图片的经验总结

阿北哥ya 279次阅读

我使用的是yii2高级版,为了能让前台后都能正确访问到图片,同时提升图片的安全性,我决定将所有的图片资源文件都放在了公共目录下面:common\images\unitimages\1\home 如图: 我在api\controllers\UnitController.php文件中是这样写的:

 /*
 * @return array 返回base64格式的图片编码数组
 */
public function actionGetHomeImages(){
    $path=Yii::getAlias('@common').'\images\unitimages\1\home';//获取图片所在的目录
    $i=0;
    $handle = opendir($path);//打开图片所在的目录
    //循环遍历目录下所有 的图片文件,并对每个图片文件进行base64编码
    while (false !== ($file = readdir($handle))) {
        list($filesname,$ext)=explode(".",$file);
        if($ext=="gif" or $ext=="jpg" or $ext=="JPG" or $ext=="GIF" ) {
            if (!is_dir('./'.$file)) {
                $array[]['url']=$this->base64EncodeImage($path.'\\'.$file);//保存图片名称
                ++$i;
            }
        }
    }
    return $array;
}

/*
 * 将图片文件转换为base64编码
 */
protected function base64EncodeImage ($image_file) {
    $base64_image = '';
    $image_info = getimagesize($image_file);
    $image_data = fread(fopen($image_file, 'r'), filesize($image_file));
    $base64_image = 'data:' . $image_info['mime'] . ';base64,' . (base64_encode($image_data));
    return $base64_image;
}

服务器端返回的json数组如下图: 下面介绍微信小程序端如何实现直接显示base64编码的图片: / 关键请求的代码 */ data: { motto: 'Hello World', userInfo: {}, movies: [], }, var that = this; wx.request({ url: 'https://api.nai8.me/unit/get-home-images', method: 'POST', header: { 'content-type': 'application/json' }, success: function (res) { if (res.statusCode == 200) { that.setData({ movies: res.data, })
} else { console.log(res.errMsg) } }, })

/*
*xml界面的代码
*/
<swiper class="swiper" indicator-dots="true" autoplay="true" interval="5000" duration="1000">  
  <block wx:for="{{movies}}" wx:for-index="index">  
    <swiper-item>  
      <image src="{{item.url}}" class="slide-image" mode="aspectFill"/>  
    </swiper-item>  
  </block>  

完成后的效果图片就是这样的:

此文编号为429 上次更新于2个月前 / Yii 频道
相关文章
留言
小提醒 欢迎大家留言并且我会拿出时间去看,当然我会删除那些被视为垃圾或广告的留言。
暂时没有回复
首页 登录 / 注册