是的,可以通过以下步骤将参数从Angular登录页面发送到Kibana的iframe仪表板:
以下是一个示例代码:
在Angular登录页面的组件中:
import { HttpClient } from '@angular/common/http';
export class LoginComponent {
constructor(private http: HttpClient) {}
onSubmit(username: string, password: string) {
const params = { username, password };
this.http.post('/api/login', params).subscribe(response => {
// 登录成功后,将参数传递给Kibana仪表板
const kibanaUrl = `https://your-kibana-url.com/dashboard?${new URLSearchParams(params)}`;
// 将kibanaUrl赋值给iframe的src属性
});
}
}
在后端服务器中,使用Node.js和Express框架处理登录请求:
const express = require('express');
const app = express();
app.post('/api/login', (req, res) => {
const { username, password } = req.body;
// 处理登录逻辑
res.sendStatus(200);
});
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
在Kibana仪表板的HTML文件中,使用JavaScript生成包含参数的URL并将其赋值给iframe的src属性:
<iframe id="kibana-iframe" src=""></iframe>
<script>
const params = new URLSearchParams(window.location.search);
const kibanaUrl = `https://your-kibana-url.com/dashboard?${params}`;
document.getElementById('kibana-iframe').src = kibanaUrl;
</script>
请注意,以上示例代码仅为演示目的,实际情况中需要根据具体需求进行适当的修改和安全性考虑。另外,关于Kibana的更多信息和腾讯云相关产品,请参考腾讯云官方文档和产品介绍页面。
领取专属 10元无门槛券
手把手带您无忧上云