微信小程序图像增强img.superresolution接口

整体流程:

  • 获得access_token
  • 调用img.superresolution得到media_id
  • 根据media_id下载图片

注:虽然以下的几个接口都是服务端API,但是我都是在客户端调用的,实测可行。

一、获取accecc_token

参考 auth.getAccessToken

请求地址:

GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET

示例代码:

    var that = this
    let APPID = "xxx"
    let APPSECRET = "xxx"
    wx.request({
      url: `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${APPID}&secret=${APPSECRET}`,
      method: ‘GET‘,
      success: (res) =>{
        console.log(res)
        console.log(res.data.access_token)
        that.setData({
          access_token: res.data.access_token
        })
      },
      fail: (res) =>{
        console.log(res)
      },
    })

二、调用图像清晰化接口

参考 img.supperresolution

请求地址:

POST https://api.weixin.qq.com/cv/img/superresolution?img_url=ENCODE_URL&access_token=ACCESS_TOCKEN

示例代码:

      wx.request({
        url: "https://api.weixin.qq.com/cv/img/superresolution",
        data: {
          img_url: "https://gss3.bdstatic.com/-Po3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike116%2C5%2C5%2C116%2C38/sign=8816325c4036acaf4ded9eae1db0e675/fcfaaf51f3deb48fcfadd0bbfb1f3a292cf5788a.jpg",
          access_token: that.data.access_token,
        },
        method: ‘POST‘,
        dataType: "json",
        header: {
          ‘content-type‘: ‘application/x-www-form-urlencoded‘
        },
        success: (res) => {
          console.log(res)
          that.setData({
            media_id: res.data.media_id
          })
        },
        fail: (res) => {
          console.log(res)
        },
      })

三、下载图片

返回的media_id有效期为3天,期间可以通过“获取临时素材”接口获取图片二进制,示例:

curl "https://api.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID" -o "output.jpg"

示例代码:

    setTimeout(function () {
      var downloadUrl = `https://api.weixin.qq.com/cgi-bin/media/get?access_token=${that.data.access_token}&media_id=${that.data.media_id}`
      console.log(downloadUrl)
      that.setData({
        downloadUrl: downloadUrl
      })
    }, 2000)

如果要从输入框获取图片URL,textarea标签挺不错的

<view class="section">
  <view>图片URL: </view>
  <textarea maxlength="1000" bindblur="bindTextAreaBlur" auto-height placeholder="请输入图片链接" />
</view>
  bindTextAreaBlur: function (e) {
    console.log(e.detail.value)
    this.setData({
      imgUrl: e.detail.value
    })
  },

原文地址:https://www.cnblogs.com/lfri/p/12054117.html

时间: 2024-11-04 14:11:43

微信小程序图像增强img.superresolution接口的相关文章

微信小程序的Web API接口设计及常见接口实现

微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,通过小程序的请求Web API 平台获取JSON数据后,可以在小程序界面上进行数据的动态展示.在数据的关键 一环中,我们设计和编写Web API平台是非常重要的,通过这个我们可以实现数据的集中控制和管理,本篇随笔介绍基于Asp.NET MVC的Web API接口层的设计和常见接口代码的展示,以便展示我们常规Web API接口层的接口代码设计.参数的处理等内容. 1.Web API整体性的架构设计 我们整体性的架构设计

整合微信小程序的Web API接口层的架构设计

在我前面有很多篇随笔介绍了Web API 接口层的架构设计,以及对微信公众号.企业号.小程序等模块的分类划分.例如在<C#开发微信门户及应用(43)--微信各个项目模块的定义和相互关系>介绍了相关模块的划分,在<基于微信小程序的系统开发准备工作>介绍了Web API的架构设计思路.本篇随笔对之前介绍的架构内容进行统一的调整更新,以便更加方便实际项目的应用开发,以期达到统一.重用.清晰的目的. 1.公众号.企业号.小程序模块的划分 我们知道,目前微信企业应用,分为公众号.企业号(企业

微信小程序源码下载(200多个)

微信小程序源码下载汇总,点击标题进入对应的微信小程序下载页面. 最新 demo源码(点击标题进入帖子下载) 描述 1 微信小程序 会议室预定小程序 微信小程序 会议室预定小程序**** 本内容被作者隐藏 **** 2 微信小程序-双人五子棋小游戏 微信小程序-双人五子棋小游戏**** 本内容被作者隐藏 **** 3 打卡签到小程序 用微信小程序实现的一个简单的打卡签到的小程序拒绝 4 微信小程序---左滑删除 微信小程序---左滑删除**** 本内容被作者隐藏 **** 5 一个借钱的记事本的微

微信小程序结合后台数据管理实现商品数据的动态展示、维护

微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,本篇随笔介绍微信小程序结合后台数据管理实现商品数据的动态展示.维护,介绍如何实现商品数据在后台管理系统中的维护管理,并通过小程序的请求Web API 平台获取JSON数据在小程序界面上进行动态展示. 1.整体性的架构设计 我们整体性的架构设计,包含一个Web管理后台.一个Web API统一接口层.当然还有数据库什么,另外还有一个小程序客户端.整个架构体系还是以我之前随笔介绍的<整合微信小程序的Web API接口层的架

CSDN博文精选 微信小程序全方位解析

责编:陈秋歌,关注微信开发等领域,寻求报道或者投稿请发邮件chenqg#csdn.net.研发心得.项目实战.前沿技术.外文翻译--,只要是技术干货,十分欢迎投稿至chenqg#csdn.net.人人都是主编,这里就是你的舞台. 欢迎加入"微信开发技术"群,参与热点.难点技术交流.请加群主微信「Rachel_qg」,申请入群,务必注明「公司+职位」. 九个月之前,应用号首次被提出.近日,应用号以"小程序"的名称,正式向200人发出公测邀请."无需下载,用完

微信小程序学习指南

作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 微信小程序正式公测, 张小龙全面阐述小程序,定档1月9日上线(附90分钟演讲全文) ... 前言:新人第一坑,跳坑指南:修改后,必须保存:ctrl+S: 1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教

记录使用微信小程序的NFC和蓝牙功能读取15693芯片的开发历程

开发目标: (1) 对于Android手机,直接通过微信小程序调用手机的NFC功能,对15693协议的芯片进行读写操作: (2)对于苹果手机(及没有NFC模块的手机),通过微信小程序的蓝牙功能连接到蓝牙/NFC读写器,然后通过蓝牙发送指令操作读写器对15693协议的芯片进行读写操作. DAY #1 上午开了半天会,下午开始开发. 先开发简单的:直接通过Android手机的NFC模块读写芯片.开发思路如下: 1. 首先调用 wx.getHCEState(OBJECT), 判断设备是否支持NFC,如

微信小程序时代来临,极限工坊小程序助力亿万级市场|淘小咖

微信小程序逐渐成了移动互联网营销不可或缺的一种工具,成为撬动移动互联网千亿市场红利的一个契机,对用户来说,能够在最短时间内获取服务,无需下载软件. 对商家来说,可以从线上引流,直接触达用户,扩大营销渠道,实现用户沉淀和裂变营销,而不用再被平台绑架. 小程序轻松解决了这两个痛点,为用户带去便利,为商家带来盈利,这也就使得微信小程序越来越受欢迎. 可以说,伴随微信小程序的快速发展,我们正迎来微信小程序的时代. 小程序对于企业运营优势在哪儿呢? 小程序简单点说,它相当于一个展示网站或网上商城,包含在线

微信小程序开发本地数据缓存教程

微信小程序开发过程中,本地数据缓存是必不可少的一部分.而且本地数据缓存的用途还挺多的,下面木鱼小铺(https://www.muyu007.cn)就和大家分享一下微信小程序开发本地数据缓存教程,希望对大家有所帮助! 第一步:读写本地数据缓存 微信小程序为了方便开发者缓存数据提供了读写本地数据缓存接口,读本地数据缓存采用的是wx.getStorage/wx.getStorageSync接口,写本地数据缓存的是wx.setStorage/wx.setStorageSync接口.其中以Sync结尾的是