百度小程序动态参数
URL传参
// 跳转时传参
swan.navigateTo({
url: '/pages/detail/detail?id=123&name=test'
})
// 接收参数
Page({
onLoad(options) {
console.log(options.id) // 123
console.log(options.name) // test
}
})
全局参数管理
// app.js 中设置全局参数
App({
globalData: {
userInfo: null,
token: ''
}
})
// 页面中使用
const app = getApp()
Page({
onLoad() {
console.log(app.globalData.token)
}
})
百度统计(百度推广)参数
UTM参数追踪
原始链接:https://example.com/product
带参链接:https://example.com/product?utm_source=baidu&utm_medium=cpc&utm_campaign=summer_sale
自动标记参数
// 百度统计自动获取URL参数 var _hmt = _hmt || []; _hmt.push(['_setAutoPageview', false]); _hmt.push(['_trackPageview', location.pathname + location.search]);
百度API参数处理
动态请求参数
// 百度地图API
const map = new BMap.Map("container");
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
// 根据动态参数搜索
const local = new BMap.LocalSearch(map, {
onSearchComplete: (results) => {
// 处理结果
}
});
local.search(keyword);
百度翻译API
// 动态参数示例
const appid = 'your_appid';
const q = encodeURIComponent(dynamicText);
const salt = new Date().getTime();
const sign = MD5(appid + q + salt + key);
fetch(`https://fanyi-api.baidu.com/api/trans/vip/translate?q=${q}&from=auto&to=en&appid=${appid}&salt=${salt}&sign=${sign}`)
URL参数处理工具函数
获取URL参数
function getUrlParams(url) {
const params = {};
const queryString = url.split('?')[1];
if (queryString) {
queryString.split('&').forEach(pair => {
const [key, value] = pair.split('=');
params[decodeURIComponent(key)] = decodeURIComponent(value || '');
});
}
return params;
}
// 使用
const params = getUrlParams(window.location.href);
console.log(params.id);
构建带参URL
function buildUrl(baseUrl, params) {
const url = new URL(baseUrl);
Object.keys(params).forEach(key => {
url.searchParams.append(key, params[key]);
});
return url.toString();
}
安全注意事项
参数校验
function validateParams(params) {
// 类型检查
if (typeof params.id !== 'string') {
throw new Error('Invalid parameter type');
}
// 长度限制
if (params.name && params.name.length > 100) {
throw new Error('Name too long');
}
// 防止XSS
const sanitized = {};
Object.keys(params).forEach(key => {
sanitized[key] = escapeHtml(params[key]);
});
return sanitized;
}
敏感参数加密
// 对敏感参数进行加密传输
function encryptParams(params, secretKey) {
const str = JSON.stringify(params);
const encrypted = CryptoJS.AES.encrypt(str, secretKey).toString();
return encodeURIComponent(encrypted);
}
常见场景示例
搜索页面参数处理
// 处理搜索条件
function handleSearchParams(params) {
const defaultParams = {
page: 1,
pageSize: 20,
sort: 'default'
};
return {
...defaultParams,
...params,
timestamp: Date.now() // 防止缓存
};
}
分页参数处理
// 分页参数构建
function buildPaginationParams(currentPage, pageSize, filters) {
return {
page: Math.max(1, parseInt(currentPage) || 1),
limit: Math.min(100, Math.max(1, parseInt(pageSize) || 20)),
...filters
};
}
最佳实践建议:
- 参数编码:始终对URL参数进行encodeURIComponent处理
- 类型转换:显式转换参数类型,避免意外错误
- 默认值:为可选参数提供合理的默认值
- 参数验证:在服务端和客户端都进行参数验证
- 文档化:清晰记录每个参数的用途和格式要求
- 版本控制:API参数考虑版本兼容性
具体实现方式需要根据使用的百度具体产品(小程序、API、统计等)和业务需求进行调整。

版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。