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

移动端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>
相关推荐
勇敢di牛牛4 分钟前
Vue+mockjs+Axios 案例实践
前端·javascript·vue.js
Sheldon一蓑烟雨任平生14 分钟前
Vue3 Class 与 Style 绑定
vue.js·vue3·class与style绑定·绑定class·绑定style·vue3绑定class·vue3绑定style
詩句☾⋆᭄南笙14 分钟前
HTML列表、表格和表单
服务器·前端·html·表格·列表·表单
IT_陈寒27 分钟前
Python性能翻倍的5个冷门技巧:从GIL逃逸到内存视图的实战优化指南
前端·人工智能·后端
南城巷陌31 分钟前
错误边界:用componentDidCatch筑起React崩溃防火墙
前端·react.js·前端框架
FinClip37 分钟前
OpenAI推出Apps SDK,你的企业App跟上了吗?
前端·app·openai
馨谙42 分钟前
Linux中的管道与重定向:深入理解两者的本质区别
前端·chrome
2501_915921431 小时前
iOS 应用加固与苹果软件混淆全解析 IPA 文件防反编译、混淆加密与无源码加固策略
android·macos·ios·小程序·uni-app·cocoa·iphone
夏天想1 小时前
复制了一个vue的项目然后再这个基础上修改。可是通过npm run dev运行之前的老项目,发现运行的竟然是拷贝后的项目。为什么会这样?
前端·vue.js·npm
@大迁世界1 小时前
这个 CSS 特性,可能终结样式冲突
前端·css