[bug集合]若依接口报401、传参问题与总结

2024年7月初遇到的一堆bug，做个总结。主要包括：

（1）ruoyi接口权限访问受阻，报401：添加header

（2）vue组件传参问题

1、若依后端接口报401

（1）问题描述：

项目本地运行时，接口测试正常，在将项目部署到服务器上时，端口访问均被禁止，返回401。

（2）问题排除：

          服务器端口：已开。

          匿名访问设置：SecurityConfig与controller文件皆配置。

               

（3）最终解决：

为访问添加header，即：Authorization属性

在登录若依前端页面后，F12打开开发者工具，可以找到当前登录的Authorization属性，复制到接口请求的请求头中。

格式如下：

export function listChapter(query) {
   //listChapter为你的函数名
  return request({
    url: '/xxx/name/list',
    //url:指定你的api路径
    method: 'get',
	header: {
		"Authorization": "你的Authorization"
	},
    params: query
  })
}

（4）局限性：

很明显，这样做必须一定时间内更新一次Authorization，比较麻烦。不过解决燃眉之急，倒是可以……

2、页面传参bug：

在这个页面传参遇见了挺多的bug：

【bug1】组件传参报错

①描述：

主要是因为在WXML中使用了不合法的字符或不支持的属性。组件内的showTag没有被识别

②方法：

通过 data-* 属性来传递值：

【bug2】SyntaxError: Unexpected end of JSON input at JSON.parse 

        这个大概就是传参的时候props参数类型设置错误，修改一下就行

3、 传参总结：

（1）携带动态参数

//在起始页面跳转到test.vue页面并传递参数
let uniapp = {
    uniappItem: 0,
};
//当传递的参数是对象时，必须先转化为JSON格式
uni.navigateTo({
url: 'test?id=1&name=' + JSON.stringify(uniapp),
});
 
//那么获取的时候，需要用JSON.parse()的转换转换一下：
//比如：
Promise.all(JSON.parse(self.joinOrgMemids).map(i => getUser_info(i))).then(res => {
 
self.joinOrgMems = res.map(j => j.data);
 
})

 多个参数用："&"连接，并用 + 来衔接

url: "/pages/index/video?title=" + Title + "&url=" + URL

 ​​​​​​补充：页面渲染数据获取后的，参数传递：

比如我要传递这个actId，是在后端获取的，actParList中循环元素item的属性。要求点击后编辑的为对应选中的活动。

需要写成=>形式的函数，不然会报：TypeError: Cannot read property 'actParList' of undefined的错误。

 （2）接收：

①在onLoad内：

// 在test.vue页面接受参数
export default {
    onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
    console.log(option.id); //打印出上个页面传递的参数。
    console.log(option.name); //打印出上个页面传递的参数。
}
}

 ② 采用props：

// 在渲染前使用：直接定义到props内
props:{
    actId:{
    type:Number,
    required: true ,
}
},