最新博文

• uniapp app端调试

  uni-app

  推荐使用mumu模拟器

  1.打开模拟器，初始屏幕手机类型及尺寸；

  2.打开模拟器桌面中的设置（即手机中的设置），将开发者选项中usb调试打开

  3.打开Hbuilder，运行到手机或模拟器，如果看不到mumu模拟器，则将mumu端口设置为7555

  
  

  
  

  
  

  
  

  风口下的猪2020-05-22【uni-app】

  阅读更多

• APP端js类方法及属性间相互调用，this的指向问题

  uni-app

  风口下的猪2020-05-22【uni-app】

  阅读更多

• 关于TP5.1查询条件----两个字段间的大小比较的两种常见方法

  thinkphp

  示例场景：查询customer数据表中，update_time > create_time的数据

  
  

  一.WhereColumn()方法

  第一种方法，使用专门用来进行两个字段比较的查询条件whereColumn方法：

  Db::table('customer')->whereColumn('update_time', '>' ,'create_time')->select();

  生成的SQL语句是：

  SELECT * FROM `customer` WHERE  ( `update_time` > `create_time` );

  
  

  二.exp查询

  第二种方法，使用exp查询，调用raw方法：

  Db::table('customer')->where([['update_time', 'exp', Db::raw('> `create_time`')]])->select();

  生成的SQL语句是：

  SELECT * FROM `customer` WHERE  ( `update_time` > `create_time` );

  
  

  
  

  风口下的猪2020-05-20【thinkphp】

  阅读更多

• 七牛云删除文件时，报Root未定义

  thinkphp

  风口下的猪2020-05-16【thinkphp】

  阅读更多

• vue.js阻止事件冒泡和默认事件

  vue

  vue.js取消事件冒泡
  

  @click.stop="doSomething($event)"

  vue.js阻止默认事件
  

  @click.prevent="doSomething($event)"

  
  

  
  

  风口下的猪2020-05-13【vue】

  阅读更多

• uni-app导航栏和状态栏配置

  uni-app

  1. 原生导航栏-通用配置

  (1) 原生导航优点

  • 原生导航的体验更好，渲染新页面时，原生导航栏的渲染无需等待新页面dom加载，可以在新页面进入动画开始时就渲染。
  • 原生导航还可以避免滚动条通顶，并方便的控制原生下拉刷新。通过pages.json的配置，可以简单的、跨端的、高性能的开发业务。

  (2) 原生导航缺点

  • 原生导航栏的扩展能力有限的。尤其是微信下，没有提供太多导航栏的配置。

  (3) 原生导航栏的通用配置： uni-app 自带原生导航栏，在pages.json里配置。

  • 全局导航栏样式设置： 在pages.json的globalStyle里进行各个参数配置

  "globalStyle": {
      "navigationBarTextStyle": "black",
      "navigationBarTitleText": "Hello uniapp",
      "navigationBarBackgroundColor": "#F8F8F8",
      "backgroundColor": "#F8F8F8",
      "backgroundColorTop": "#F4F5F6",
      "backgroundColorBottom": "#F4F5F6",
      "mp-alipay": {
          "titleBarColor": "#FFFFFF"
      }
  },
  

  • 单页面导航栏样式设置：每个page下面的style配置中的navigationBar各个参数配置，即为通用配置，小程序、app、h5均生效。参考style设置每个页面的状态栏、导航条、标题、窗口背景色等

  {
      "path": "pages/index/index",
      "style": {
          "navigationBarTitleText": "主页",  
      }
  },
  

  备注：单页面style中配置项会覆盖 globalStyle 中相同的配置项。

  2. 全局取消原生导航栏

  备注：一般App里不会使用这个参数配置。建议个别页面单独设置不使用原生导航。
  (1) 在pages.json的globalStyle里有个navigationStyle设置，默认是default，即带有原生导航栏。
  (2) navigationStyle设置为custom后，所有页面都没有原生导航。
  说明：但在微信小程序里，右上角始终都有一个胶囊按钮。很多微信小游戏界面上也没原生导航栏，但有胶囊按钮。

  "globalStyle": {
      "navigationStyle": "custom",
  },
  

  3. 单页面去除原生导航栏

  说明：自微信客户端 7.0.0 起、App端HBuilderX 2.0.3起，支持通过如下方法取消单独一个页面的原生导航栏。但小程序右上角胶囊按钮仍然去不掉。页面配置 navigationStyle 为 custom：

  {  
      "path" : "pages/index/index",  
      "style" : {  
          "navigationStyle":"custom"  
      }  
  }  
  

  4. 原生导航栏在App侧的扩展

  • 微信小程序的设计里，没有给原生导航提供太多自定义能力。在开发App时是不够用的。
  • 在App下，每个page下面的style下面还有一个子扩展节点：app-plus（这个节点定义了在5+App环境下，也即iOS、Android环境下，增强的配置）。app-plus下可以设置titleNView等更多参数，可以得到比微信小程序更丰富的扩展性。另外，开发者也可以在必要时取消原生导航栏，使用view自行绘制导航栏。

  4.1 App单独去除原生导航栏(pages.json)

  {
      "path": "pages/index/index",
      "style": {
          "navigationBarTitleText": "主页",  
           // "navigationStyle":"custom",
          "app-plus":{
              "titleView":false  //不启用系统导航
          }
       }
  }
  

  备注：在App去除原生导航栏后，小程序端侧仍保有原生导航栏。
  问题：HBuilderX创建的应用默认使用沉浸式状态栏样式，去除导航栏后，页面顶部会直通到状态栏的区域。

  • 最简单的解决方式就是配置mainfest.json来关闭沉浸式。即通过打开应用的manifest.json文件，切换到代码视图，在app-plus -> statusbar 下添加immersed节点并设置值为false。

  "app-plus" : {
      "statusbar": {  
          "immersed": false  
      },
  }
  

  • 其次可通过顶部状态栏占位的方式来解决页面顶部直通状态栏区域的问题。参考4.2的设置css变量后解决页面顶部会直通到状态栏的区域的问题。

  4.2 App去除导航栏后改变状态栏样式

  App因为默认为沉浸式，去除导航栏后，页面顶部会直通到状态栏的区域，可能出现如下需求：

  • 改变状态栏文字颜色：设置该页面的 navigationBarTextStyle 属性，可取值为 black/white。如果想单独设置颜色，App端可使用plus.navigator.setStatusBarStyle设置。部分低端Android手机（4.4）自身不支持设置状态栏前景色。
  • 改变状态栏背景颜色：通过绘制一个占位的view固定放在状态栏位置，设置此view的背景颜色，即可达到想要的效果，uni-app提供了一个状态栏高度的css变量，具体参考：uni-app内置的CSS变量。

  <template>
      <view>
          <!-- #ifdef APP-PLUS -->  
          <view class="status_bar">  
              <view class="top_view"></view>  
          </view>  
          <!-- #endif --> 
          <view>  
              
          </view> 
      </view>
  </template>
  
  <script>
  export default {
      data() {
          return {
              
          }
      },
      methods: {
          
      }
  }
  </script>
  
  <style>
  .status_bar {  
      height: var(--status-bar-height);  
      width: 100%;  
      background-color: #F8F8F8;  
  }  
  .top_view {  
      height: var(--status-bar-height);  
      width: 100%;  
      position: fixed;  
      background-color: #F8F8F8;  
      top: 0;  
      z-index: 999;  
  } 
  </style>
  
  

  • var(--status-bar-height) 此变量在微信小程序环境为固定 25px，在 5+App 里为手机实际状态栏高度。
  • 当设置 "navigationStyle":"custom" 取消原生导航栏后，由于窗体为沉浸式，占据了状态栏位置。此时可以使用一个高度为 var(--status-bar-height) 的 view 放在页面顶部，避免页面内容出现在状态栏。（实战过程中此方案仍不能解决页面内容出现在状态栏的问题）

  设置css变量后解决页面顶部会直通到状态栏的区域的问题：设置了css变量后，手机顶部状态栏区域还是会被页面内容覆盖，可使用plus.navigator.getStatusbarHeight()来动态计算系统状态栏的高度barHeight，然后设置页面主view的样式:style="{'margin-top':barHeight+'px'}"，来解决。

  <template>
      <view class="uni-flex uni-column" style="height: 100%;">
          <!-- #ifdef APP-PLUS -->  
          <view class="status_bar">  
              <view class="top_view"></view> 
          </view>  
          <!-- #endif --> 
          
          <view class="uni-flex uni-row jk-bg-blue uni-center" style="height: 12%;" :style="{'margin-top':barHeight+'px'}">
              <view class="flex-sub jk-header uni-flex uni-column justify-start" @tap="test1">
                  <text class="text-white cuIcon-scan"></text>
                  <text>扫码</text>
              </view>
              <view class="flex-treble jk-header uni-flex uni-column justify-center" @tap="test2">
                  <text class="text-white cuIcon-rank"></text>
                  <text>统计</text>
              </view>
              <view class="flex-sub jk-header uni-flex uni-column justify-end" @click="test3">
                  <text class="text-white cuIcon-exit"></text>
                  <text>退出</text>
              </view>
          </view>
          
          <view class="uni-flex align-center uni-row margin-xs" style="height: 78%;">
      
          </view>
  
          <view class="uni-flex uni-row uni-center" style="height: 10%;color: #000000;background-color: F8F8F8;border-top: 3px solid #eee;">
  
          </view>
                  
      </view>
  </template>
  
  <script>
  var _self;
  export default {
      components: {
          uniPopup,
      },
      data() {
          return {
              barHeight:25,
          }
      },
      methods: {
          //获取系统状态栏高度
          getSystemStatusBarHeight:function(){
              // #ifdef APP-PLUS
              var height = plus.navigator.getStatusbarHeight();
              _self.barHeight = height;
              // #endif
              // #ifdef H5
              _self.barHeight = 0;
              // #endif
          },
      },
      onLoad:function(){
          _self = this;
          _self.getSystemStatusBarHeight();
          
      }
  }
  </script>
  <style> 
  
  </style>
  
  

  备注：此种方式经测试，有时页面打开后页面主视图和状态栏区域会留白(留白的高度其实是状态栏高度)。
  

  

  
  
  作者：瑟闻风倾
  链接：https://www.jianshu.com/p/7344c4066e82
  来源：简书
  著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

  
  

  
  

  
  

  风口下的猪2020-05-01【uni-app】

  阅读更多

• unipush 多手机厂商离线推送服务端集成

  消息推送

  多厂商离线推送服务端集成，仍然走个推的SDK。

  //厂商推送模板

      function ChangPush(){

          $payload = '{"title":"测试标题","content":"测试内容","sound":"default","payload":"test"}';  

          $intent = 'intent:#Intent;action=android.intent.action.oppopush;launchFlags=0x14000000;component=io.dcloud.omger/io.dcloud.PandoraEntry;S.UP-OL-SU=true;S.title=测试标题;S.content=测试内容;S.payload=test;end';  

          $template =  new \IGtTransmissionTemplate();//使用透传消息模板  

          $template->set_appId($this->appid);//应用appid  

          $template->set_appkey($this->appkey);//应用appkey  

          $template->set_transmissionType(2);//透传消息类型  

          $template->set_transmissionContent($payload);//消息内容  

          $notify = new \IGtNotify();  

          $notify->set_title('测试标题');  

          $notify->set_content('测试内容');  

          $notify->set_intent($intent);  

          $notify->set_type((new \NotifyInfo_type)::_intent);  

          $template->set3rdNotifyInfo($notify);

          return $template;

      }

      //厂商单推执行

      function ChangToSingle($cid){

          $igt = new \IGeTui($this->host,$this->appkey,$this->mastersecret);

          $template = $this->ChangPush();

          $message = new \IGtSingleMessage();

          $message->set_isOffline(true);//是否离线

          $message->set_offlineExpireTime(3600*12*1000);//离线时间

          $message->set_data($template);//设置推送消息类型

          $target = new \IGtTarget();

          $target->set_appId($this->appid);

          $target->set_clientId($cid);

          try {

              $rep = $igt->pushMessageToSingle($message, $target);

              var_dump($rep);

          }catch(RequestException $e){

              $requstId =e.getRequestId();

              $rep = $igt->pushMessageToSingle($message, $target,$requstId);

              var_dump($rep);

          }

      }

  
  

  
  

  // 厂商单推接口
  

  public function ChangToSingle(){

          $getui = new \getui\GeTui();

          $cid='xxxxxx';

          $getui->ChangToSingle($cid);

  }

  
  

  
  

  
  

  
  

  风口下的猪2020-04-29【消息推送】

  阅读更多

• unipush 多手机厂商离线推送

  消息推送

  一.多厂商推送接入流程
  

  1、开通UniPush推送服务：参考《UniPush使用指南》；

  2、厂商推送申请：按照《厂商推送应用创建配置流程》文档，在各厂商平台申请推送参数，并填写配置到DCloud开发者中心特殊机型里面；

  3、客户端集成：在HBuilderX中提交云端打包，下载apk安装测试；

  4、服务端推送：平台推送按照UniPush使用指南设置即可；服务端API接口使用透传升级模板，按照 《多厂商推送透传消息带通知使用文档》文档，添加配置厂商推送代码；

  5、离线推送测试：正常收到厂商通知和传递参数即可。

  
  

  二.Android多厂商推送接入注意事项及常见问题

  详细参考Unipush常见问题

  1、多厂商推送接入注意事项

  • Dcloud平台正常填写保存各厂商渠道推送参数；
    

    

  • Dcloud平台、应用、厂商平台的应用包名和参数保持一致；

  • 服务端推送是否使用透传模板，并参照文档设置了正确的intent参数。

  2、Unipush平台特殊机型参数保存失败

  • 魅族：参数获取有误，登录http://push.meizu.com-应用列表-打开应用-配置管理-应用配置，找到参数填写上；

  • 小米：小米平台-应用列表-启用状态是否开启；

  • oppo：1、oppo平台：确认消息推送状态是否开启；2、若开启，一般是鉴权失败，没有推送权限。

  3、离线收不到厂商通知消息

  （1）设备不符合推送条件:

  • 华为：华为rom且华为rom版本大于等于 emui4.1；
  • 小米：小米rom且服务框架（包名:com.xiaomi.xmsf）版本号大于等于105；
  • 魅族：魅族rom且魅族rom版本大于等于5.x
  • oppo：oppo colorOS rom且版本号大于等于3.1；
  • vivo：具体请参考vivo推送常见问题汇总；

  （2）手机本身或者厂商特殊原因：

  • 检查下应用通知权限是否开启；
  • 检查应用通知管理权限页面，系统推荐按设置为重要通知（一般是小米和魅族机子，有不重要通知功能）；
  • 手机系统时间是否正常的（一般影响的是oppo）；
  • vivo要求：通知文案中不能带 “包含测试、test字符”、“纯数字”、“纯表情”、“符号”或者“符号+数字”、“表情+数字”、“表情＋符号” 。
  • 华为平台创建PUSH权益的时候，sha256指纹证书需要填写上，并且华为推送测试需要使用自有证书打包；（华为渠道有sha256指纹证书检验）。
    华为平台sha256指纹证书填写如图：

  
  

  
  

  应用云端打包设置证书如图：

  
  

  （3）apk没用更新（unipush增加或者修改了厂商数据，但apk安装包没用重新打包）

  （4）服务端集成出现错误：

  • 没用透传：走厂商通道必须使用透传；
  • intent格式错误：我当时就是直接把component参数整体改为包名出了错；intent数据格式参考
  • 接口推送消息体没用做到消息模板、消息属性、接收方保持一致

  4、点击厂商通知跳转异常

  排查步骤如下：

  • intent设置的参数是否有特殊字符，比如Scheme链接有#符号，如有，可以urlencode编码处理，参数在经过Android系统接收后，会自动进行解码处理，可以实测验证（一般影响小米、华为等手机）；
  • 检查设备是否有禁止后台弹出界面，路径>>设置-应用管理-测试应用-权限管理-后台弹出界面，（一般是小米、oppo、vivo设备）；

  5、为什么intent客户端接收到参数乱码？

  • intent参数里面有 % 符号，客户端接收会乱码；

  • intent参数里面有 # 和 ; 符号，会影响跳转；

  • urlencode编码处理后正常，urlencode(%)=%25，urlencode(#)=%23，urlencode(;)=%3b 。

  

  6、哪些厂商支持角标显示？

  华为角标只有个推原生的sdk支持，其它插件不支持，小米的默认显示角标，其它厂商没有提供角标接口。

  7、ClientID在哪些情况下会改变？

  • 用户超过三个月未登录，之后再登录会重新生成一个CID；
  • 卸载应用，且再次调用个推初始化时无外部存储读写权限；
  • 应用的包名修改。

  8、如何修改推送图标、应用图标？

  • 通知图标：Unipush页面中的展示样式选择个推默认，然后展开高级设置，可在高级设置中替换通知图标 ；
  • 应用图标：5+应用版-换量设置页面中可修改应用图标。

  
  

  
  

  风口下的猪2020-04-29【消息推送】

  阅读更多

• 个推（5）推送通道选择逻辑

  消息推送

  推送通道选择逻辑

  • Android平台
    APP在线（个推推送通道可用）
    推送通知和透传消息都使用个推的推送通道下发推送消息。
    APP离线（个推推送通道不可用）
    推送通知，使用个推离线推送通道，离线消息会存储在消息离线库，离线时间内APP在线后下发推送消息。
    透传消息，如果符合厂商推送的厂商手机（配置了手机厂商推送参数并且在对应厂商的手机上），则使用厂商推送通道下发推送消息；否则使用个推的离线推送通道，离线消息会存储在消息离线库，离线时间内APP在线后下发推送消息。

  • iOS平台
    推送通知，uniPush后台管理界面中不支持下发此类型，个推提供的服务端API支持下发推送通知（设置APN参数则通过苹果的APNS通道，否则使用个推通道）。
    透传消息，设置APN参数则通过苹果的APNS通道下发推送消息，没有设置APN参数则使用个推的推送通道下发。

  风口下的猪2020-04-28【消息推送】

  阅读更多

• Failed to start mariadb.service: Unit not found

  Linux

  风口下的猪2020-04-25【Linux】

  阅读更多

• CentOS 7+ 偏好mariadb

  Linux

  CentOS 7+ 版本将MySQL数据库软件从默认的程序列表中移除，用mariadb代替了，entos7配置教程上，大多都是安装mariadb，因为centos7默认将mariadb视作mysql。

  因为mysql被oracle收购后，原作者担心mysql闭源，所以又写了一个mariadb，这个数据库可以理解为mysql的分支。如果需要安装mariadb，只需通过yum就可。

  
  

  风口下的猪2020-04-25【Linux】

  阅读更多