vue移动端H5调起手机发送短信（兼容ios和android）

我总是词不达意2023-10-12 20:25

移动端h6页面调起手机发送短信功能，ios和android的兼容写法不一样。

android

TypeScript 复制代码

window.location.href = `sms:10086?body=${encodeURIComponent('Hello, 测试短信发送')}`

ios

TypeScript 复制代码

window.location.href = `sms:10086&body=${encodeURIComponent('Hello, 测试短信发送')}`

//或者

window.location.href =`sms:/open?addresses=10086&body=${encodeURIComponent('Hello, 测试短信发送')}`;

html 复制代码

<template>
   <view @click="openNewSmsPage"></view>
</template>

TypeScript 复制代码

<script lang="ts" setup>
//点击唤起短信发送
const openNewSmsPage = () => {
  const phoneNumber = '10086' // 目标手机号码
  const message = 'Hello, 测试短信发送' // 短信内容
  let smsLink = ''
  const u = navigator.userAgent,
    isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1,
    isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
  if (isIOS) {
    // window.location.href = 'sms:10086&body=' + msg
    smsLink = `sms:${phoneNumber}&body=${encodeURIComponent(message)}`
    //或者
    smsLink = `sms:/open?addresses=${phoneNumber}&body=${encodeURIComponent(message)}`;
  } else {
    // sms:后面跟收件人的手机号,body后接短信内容
    smsLink = `sms:${phoneNumber}?body=${encodeURIComponent(message)}`
  }
  window.location.href = smsLink
}
</script>