微信小程序闺蜜花园选不了头像

1、请确认您的微信小程序是否已经更新到最新版本；

2、请检查您的网络状态，确保网络畅通；

3、如果以上两点检查无误，请尝试重新登录微信小程序，或者重新启动微信小程序；

4、如果以上方法仍无法解决问题，请尝试清除小程序缓存，再次尝试选择头像。

关于小程序如何授权登录，常规思路是自己写一个授权登录页面让用户实现点击的功能，也就是实现了通过 button 组件去触发 getUserInof 接口。在用户进入小程序的时候，判断用户是否授权了，如果没有授权的话就显示授权页面，让用户去执行授权的 *** 作。如果已经授权了，则直接跳过这个页面，进入首页。

对于多数小程序商户来说，所开发的小程序都是基于微信生态而建立的用户授权登陆体系。用户只要打开小程序后就可以一键授权允许小程序使用自己的微信头像，昵称，手机号或相关信息，轻松完成一键授权登录动作。

但随着小程序生态的发展，小程序技术不再是 BAT 的专属， 能够运行上架小程序的APP不止微信、支付宝、头条、百度这些超级APP了，越来越多的APP都能够拥有小程序运行能力。那么当这些小程序商家将之前所开发的微信小程序，能否平滑迁移至其他APP进行上架，并继续沿用微信授权登录体系呢？

FinClip能够实现：首先，用户需要将由FinClip 设计的小程序授权页面增加至已有的小程序代码包之中并提交审核，随后将关联的微信小程序的原始 ID，授权页面链接分别填入「关联微信登录」d窗进行关联，当用户打开非微信平台小程序时，如需要调用登录体系，则会引导用户打开微信查看对应页面进行授权，由FinClip完成用户登录数据同步。

微信头像设置为姓氏，需以下 *** 作。

1，打开手机浏览器。

2、输入框输入想要设置的姓氏，例如，搜索李字。

3、选择想要的，长按屏幕，点击保存。

4、打开手机微信，点右下方我。

5、点击微信名称。

6、点击头像，进入相册界面。找到，点右上角使用即可换头像。

说明:

想制作微信姓名头像的话，需要先去微信小程序里搜索姓氏。

进入其中后只需要输入你的姓氏，比如刘，然后点击生成就完成了姓名头像的制作。

接下来需要将姓氏图保存到手机本地。

主要步骤

获取用户头像

模板

合成

一、获取用户头像

制作自定义头像的第一步就是先选择。在海豚趣图的交互设计中，用户有三种选择的方式：微信头像、本地相册和相机拍摄。获取用户头像的产品设计如下图所示：

1、由于微信官方不再支持通过 wxgetUserInfo 接口来获取用户信息，我们必须通过使用 button 组件并将 open-type 指定为 getUserInfo 类型来获取或展示用户信息。

为优化用户体验，使用 wxgetUserInfo 接口直接d出授权框的开发方式将逐步不再支持。从2018年4月30日开始，小程序与小游戏的体验版、开发版调用 wxgetUserInfo 接口，将无法d出授权询问框，默认调用失败。正式版暂不受影响。

上图中d出底部菜单的交互方式无法通过 wxshowActionSheet 来实现（因为该接口只能指定字符串文本，不能使用 button, navigator 等组件）。

因此，只能通过自定义 actionSheet 组件来实现以上功能。

mmp-action-sheet 组件

以下是 mmp-action-sheet 组件的代码。

indexwxml

<view hidden="{{!actionShow}}" class="mask {{mask}}" bindtap="actionHide">  <view class="actionSheet animated {{animation}}">

   <slot></slot>

   <button class="close" bindtap="actionHide">{{closeText}}</button>

 </view></view>

2、通过 slot 在 action-sheet 中插入自定义的内容，比如 button、navigator 等。

indexwxss

mask{  position: fixed;  top: 0;  left: 0;  width:100%;  height: 100%;  background: rgba(0, 0, 0, 05);  z-index: 999;

}actionSheet{  width: 100%;  position: absolute;  top: 100%;  z-index: 1000;  overflow: hidden;

}actionSheet button,actionSheet navigator{  color: #000;  text-align: center;  background: #fff;  border-radius: 0;  line-height: 35;  font-size: 32rpx;  border-bottom: 1rpx solid rgb(236, 236, 236);  opacity: 1;

}actionSheet button:active,actionSheet navigator:active{  color:#000;  background: rgb(236, 236, 236);

}actionSheet button::after,actionSheet navigator::after{  border: none;  border-radius: 0;

}actionSheet close{  border-bottom: none;  border-bottom: 50rpx solid #fff;  border-top: 16rpx solid rgb(236, 236, 236);

}animated {  animation-timing-function: ease-out;  animation-duration: 02s;  animation-fill-mode: both;

}@keyframes fadeInBottom {from{   transform: translate3d(0, 0, 0);

}  to {    transform: translate3d(0, -100%, 0);

 }

}fadeInBottom {  animation-name: fadeInBottom;

}@keyframes fadeOutBottom {from{   transform: translate3d(0, -100%, 0);

}  to {    transform: translate3d(0, 0, 0);

 }

}fadeOutBottom {  animation-name: fadeOutBottom;

}@keyframes fadeIn {from{   opacity: 0;

}  to {     opacity: 1;

 }

}fadeIn {  animation-name: fadeIn;

}@keyframes fadeOut {from{   opacity: 1;

}  to {     opacity: 0;

 }

}fadeOut {  animation-name: fadeOut;

}

indexjs

Component({  properties: {    actionSheetStatus: {      type: Boolean,      value: false,

     observer(newVal) {

       if (newVal) {

         thissetData({            actionSheetStatus: true,            animationMask: 'fadeIn',            animationSheet: 'fadeInBottom'

         })

       } else {          thissetData({            actionSheetStatus: false,            animationMask: 'fadeOut',            animationSheet: 'fadeOutBottom'

         })

       }

     }

   },    closeText: {      type: String,      value: '取消'

   }

 },  data: {    animationMask: 'fadeIn',    animationSheet: 'fadeInBottom'

 },  methods: {

   closeActionSheet() {

     thissetData({        animationMask: 'fadeOut',        animationSheet: 'fadeOutBottom'

     })

     setTimeout(() => {

       thissetData({actionSheetStatus: false})

     }, 300)

   }

 }

})

组件只有两个参数：

actionSheetStatus 指定组件的初始展示状态，默认为false，表示不显示组件。

closeText 指定关闭按钮的名字，默认为 取消。

indexjson

{  "component": true,  "usingComponents": {}

}

接下来在页面中调用组件，在组件中插入了3个 button 组件来实现来获取用户头像：

<action-sheet actionSheetStatus="{{actionSheetStatus}}">

   <button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">使用微信头像</button>

   <button bindtap="pickPic" data-source-type="album">使用本地相册</button>

   <button bindtap="pickPic" data-source-type="camera">拍照</button>

 </action-sheet>

以上我们通过自定义组件 mmp-action-sheet 就解决了原生的 actionsheet 无法指定 button，从而无法获取用户微信头像的问题。

该组件我已经发布到 npm 包，需要用到的同学可以通过 npm 安装，也可以在 github 上查看源码和使用文档。

二、模板

有了原图，接下来我们需要选择模板。如果模板数量不多或者模板变化不频繁，我们可以直接把模板放在本地。鉴于我提供的模板比较多，放在本地会增大小程序源码的大小，我把模板上传到了小程序的云存储中，通过云函数来动态获取模板，方便以后模板扩展。

云函数 tpl 的代码如下：

// 云函数入口文件const cloud = require('wx-server-sdk')

cloudinit()// 云函数入口函数exportsmain = async (event, context) => {  const wxContext = cloudgetWXContext()  // 1 获取数据库引用

 const db = clouddatabase()  const MAX_LIMIT = 100

 // 2 构造查询语句

 const countResult = await dbcollection('template')count()  const total = countResulttotal  // 计算需分几次取

 const batchTimes = Mathceil(total / 100)  const tasks = []  for (let i = 0; i < batchTimes; i++) {    const promise = dbcollection('template')skip(i MAX_LIMIT)limit(MAX_LIMIT)get()

   taskspush(promise)

 }  return (await Promiseall(tasks))reduce((acc, cur) => {    return {

     data: accdataconcat(curdata),

     errMsg: accerrMsg,

   }

 })

}

页面中调用云函数拉取模板：

getTpl() {    const self = this

   // 调用云函数获取模板

   wxcloudcallFunction({

     name: 'tpl'

   })then(res => {

     selfsetData({

       templates: resresultdata

     })

   })

}

三、问题

到这里模板的获取逻辑已经没有问题了，但在开发过程中遇到了一个问题。模板的链接我使用的是云文件ID，当有大量并行加载的时候，只有部分能够显示，我看了一下dom节点其实都已经存在了，image的src的地址也都是正确的。

1、微信官方自230开始已经支持在image中使用云文件ID。云文件ID的格式为： cloud://xxxxxx/templates/01png。

我猜测可能是对微信云存储并发请求过多导致的（有知道的同学可以告知），因为我试了一下将云文件ID换成正常的>

由此可知，可以想到有三种可行的解决方案：

2、将模板存储到外部OSS，使用>

3、使用 wxgetTempFileURL 用云文件 ID 换取真实链接，也就是>

4、控制图的并行加载数量。我的实践是将并行加载数量控制在20，当用户滚动的时候再发起下一次请求。

提起微信文字头像，大家都知道，有人问微信消息头像怎么做，另外，还有人想问怎么把微信的头像变成原始头像，你知道这是怎么回事？其实这个微信字和头像是怎么弄得？下面就一起来看看微信消息头像怎么做，希望能够帮助到大家！

微信文字头像

1、微信文字头像:微信消息头像怎么做

版微信设置头像方法/步骤：旅行者微信头像图。

1：在手机微信。

2：在微信界面右下角点击“我”。

3：出现个人中心界面，点击页面的项，也就是自己的微信名称或者头像。

4：出现个人信息界面，点击文字“头像”进入微信头像设置。

这个微信字和头像是怎么弄得？

5：d出微信头像设置页面，可以选择直接拍一张或者从相册中，找到一张喜欢的直接点击。

6：出现预览界面，可以对进行大小的 *** 作和显示位置的调整。

7：设置完成后，点击右上角的“使用”按钮。

8：接着开始的上传更换，等到上传成功之后，在个人信息头像右侧的就会变成刚才选中的，则个人头像已经成功更换。

2、微信文字头像:怎么把微信的头像变成原始头像

从网上找一张微信原始头像，然后再进行更换微信头像，原始头像如下图：

微信设置头像方法/步骤：微信文字头像 纯文字。

1、在手机微信，在微信界面右下角点击“我”，点击头像区域。好看的抖音头像女背影。

2、出现个人信息界面，点击文字“头像”进入微信头像设置。

3、d出微信头像设置页面，点击右上角，然后选择手机相册，选取以前保存的默认头像。女生头像是背影说明什么。

4、出现预览界面，可以拖动照片来调整位置或者大小，点击完成则表示已经更换好了。

3、微信文字头像:这个微信字和头像是怎么弄得？

一个水印相机就可以了！亲！可以试试

美图秀秀，然后把你要的照片，进美图秀秀编辑，里面就有添加文字的功能，就可以了啊

这是用ps软件处理了的

你知道大中华有个软件叫PS吗~

4、微信文字头像:微信头像带字的是怎么弄

你好，微信头像加字是小程序做的一种个性头像。男生微信头像背影阳光。

如下：

在微信小程序搜[头像小助手]

2进来找到[头像加字]这个功能；情感文字。

3进来以后，系统会自动在你的微信头像右下角加一个字。底部有常用字的模板，如果没有喜欢的，也可以点[自定义图标]自己输入。2021年最火爆的带字头像。

5、微信文字头像:微信朋友圈头像下面的字怎么设置

微信朋友圈头像下面的字设置方法如下：文的微信头像。

打开微信，点击右下角“我”，然后点击自己的个人信息，进入“个人信息”界面：

在“个人信息”界面，点击“更多”，进入“更多信息”界面：

在“更多信息”界面点击“个性签名”，编辑后保存即可。微信头像。

个性签名，是指你在某个（BBS）注册之后，就可以设置自己的签名了，即在你的每个帖子底部显示的文字，有些象便签抬头。由于每个网友所写的文字都不同，有格言、有谚语、有调侃语句等等，也有用、动画作为签名，充满个性，也不同风格。有文化高雅内涵的微信头像。

以上就是与微信消息头像怎么做相关内容，是关于微信消息头像怎么做的分享。看完微信文字头像后，希望这对大家有所帮助！

最近申请小程序商城的越来越多，很多人对于开发也有一定的基础，也想着自己申请属于自己的微信小程序，那么，作为开发者，微信小程序应该如何申请发布呢？废话不多说，直接上干货。

1、接入流程注册：在微信公众平台（mpweixinqqcom）注册小程序。

2、打开之后，在相应位置填写邮箱和密码，并且激活邮箱。请注意，这里填写的邮箱是你未注册过公众平台、开放平台、企业号、未绑定个人号的邮箱。

小程序商城邮箱

3、信息填写完成之后，点击激活链接，继续下一步的注册流程。在这里进行选择主体类型的选择，然后完善主体信息和管理员信息。

小程序商城主体信息

4、再次确认主体信息，该信息一旦确认将不可变更。

5、信息确认之后就可以点击确认完成注册流程了。之后就要选择对公打款的用户，请根据页面提示，向指定的收款帐号汇入指定金额。这里需要注意的是，需要你在10天内完成汇款，否则将注册失败。

6、接下来就需要完善小程序商城的信息了。完成注册后，微信小程序信息完善步骤和开发可同步进行，也就是说，你一边可以找个人完善微信小程序的信息，一边可以自己在那里进行代码的开发。选择对公打款的用户，完成汇款验证后，可以补充小程序名称信息，上传小程序头像，填写小程序介绍并选择服务范围。

7、需要注意的是，微信小程序商城需要用户进行认证来验证主体身份的用户信息，选择通过微信认证验证主体身份的用户，需先完成微信认证后，才可以补充小程序名称信息，上传小程序头像，填写小程序介绍并选择服务范围。

小程序商城

8、接下来将进入正式开发的阶段。开发小程序：登录微信公众平台小程序，进入“用户身份-开发者-新增绑定开发者”。已认证的小程序可以绑定不多于20个开发者，未认证的小程序可以绑定不多于10个开发者。相信这里你只需要绑定自己的微信账号为开发者即可。

9、进入“设置-开发设置”，获取AppID信息。AppID信息是开发小程序必须要用到的一个信息，可以在这里进行获取。

10、等一切开发完毕之后就可以提交审核并发布了。当你完成小程序商城的开发后，就可以将代码提交至微信团队进行审核，审核完后即可发布。一般的审核周期在1-3天内，这要看小程序的信息以及微信官方团队的审核效率来决定，会有波动。

经过上面的一系列的步骤之后，我们的小程序就可以发不完成并且上线了，这时候我们就可以管理并浏览我们的小程序了，当我们把小程序商城的内部进行完善之后，就可以通过微信端各种推广方式进行推广，让更多的用户了解并使用你的小程序。

你可以用wxrequest把头像的url发送到后台服务器，由后台服务器去获取这个。

比如说你的后台程序是php的，可以这样（假定文件名为save_txphp）：

<php

$fn=base_convert(time()mt_rand(0,9),10,36)"jpg";

file_put_contents($fn,file_get_contents($_GET['url']));

echo "头像上传为"$fn;

>

这样在微信小程序中就可以这样（假定用户头像的url已保存到变量txUrl中）：

wxrequest({

url: '服务器域名路径/save_txphpurl=' + encodeURIComponent(txUrl),

success: res => {

wxshowToast({

title: res,

icon: "none"

})

}

})

以上就是关于微信小程序闺蜜花园选不了头像全部的内容，包括:微信小程序闺蜜花园选不了头像、微信小程序授权用户信息时建造的只需要头像和名称的账号怎么登录、用自己的姓氏做头像怎么制作等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！