浏览器工具

获取浏览器默认语言

getBrowserLang() 函数可以帮助您获取当前浏览器的默认语言设置，并将其转换为标准化的语言代码。

用法

import { getBrowserLang } from '@pt/utils/modules/browser';

// 获取浏览器语言
const lang = getBrowserLang();
console.log(lang); // 'zh' 或 'en'

返回值

• 'zh'：当浏览器语言设置为中文（'cn'、'zh' 或 'zh-cn'）
• 'en'：其他所有语言设置

应用场景

• 网站国际化时自动检测用户语言
• 根据用户浏览器语言设置默认显示语言

获取CSS自定义属性值

getCssVarValue(varname) 函数用于获取文档根元素上定义的CSS自定义属性（CSS变量）的值。

用法

import { getCssVarValue } from '@pt/utils/modules/browser';

// 获取CSS变量值
const primaryColor = getCssVarValue('--primary-color');
console.log(primaryColor); // 例如：'#1890ff'

参数

• varname (String)：CSS自定义属性名称，例如 '--primary-color'

返回值

返回指定CSS变量的计算值（字符串）

应用场景

• 在JavaScript中获取主题颜色
• 动态读取CSS变量用于计算或条件判断
• 在Canvas或SVG绘图中使用与CSS一致的颜色值

检测WebAssembly支持

isWebAssemblySupported() 函数用于检测当前浏览器是否支持WebAssembly技术。

用法

import { isWebAssemblySupported } from '@pt/utils/modules/browser';

// 检查WebAssembly支持情况
if (isWebAssemblySupported()) {
  // 加载WebAssembly模块
  loadWasmModule();
} else {
  // 使用备选方案
  useFallbackSolution();
}

返回值

• true：当前浏览器支持WebAssembly
• false：当前浏览器不支持WebAssembly

应用场景

• 在加载高性能WebAssembly模块前进行环境检测
• 为不支持WebAssembly的浏览器提供备选方案
• 在使用需要WebAssembly的功能前进行兼容性检查

注意事项

• 这些函数都依赖于浏览器环境，不适用于服务器端渲染(SSR)的初始渲染阶段
• 在SSR应用中，请确保这些函数仅在客户端执行阶段调用
• 对于需要在服务器端和客户端都能运行的代码，请使用条件检查：

if (typeof window !== 'undefined') {
  // 调用浏览器相关函数
}