此问题已在此处有答案：
How to make Google Chrome JavaScript console persistent?（7个回答）
5天前关闭。
因此，我使用此文件作为Web应用程序的登录页面。但它似乎没有做任何事情，URL被更改，但没有控制台消息被打印出来，它没有在Web浏览器中显示正确的资源。测试时，我在浏览器中唯一能看到的是一个“200”代码，并返回一个“OK”消息。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Start Page</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
<div class="container">
<h1>Welcome to the Travel Tracker</h1>
<form id="login-form">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<button type="submit">Login</button>
</form>
<p>Don't have an account? <a href="register.html">Register here</a>.</p>
</div>
<script>
// Handle form submission
document.getElementById('login-form').addEventListener('submit', async (event) => {
event.preventDefault();
const username = document.getElementById('username').value;
const password = document.getElementById('password').value;
try {
const response = await axios.post('/api/login', { username, password });
if (response.data.response === "Login successful") {
console.log(`Successful login for user: ${username}`);
// Redirect to the main app page on successful login
//Send user to map.html with username as a query parameter
window.location.replace(`https://localhost/map.html?username=${encodeURIComponent(username)}&t=${Date.now()}`);
} else {
console.log(`Failed login attempt for user: ${username}`);
alert('Invalid login credentials. Please try again.');
}
} catch (error) {
console.error(error);
alert('An error occurred while logging in. Please try again.');
}
});
</script>
</body>
</html>我尝试以应用程序数据库中存在的用户身份登录此页面。我试着写了很多控制台日志，以便能够找到错误，但没有一个被打印出来。
1条答案
按热度按时间c86crjj01#
一旦你重定向到一个新的URL，这个新页面将有一个全新的控制台/devtools示例。基本上转到一个新的URL将清除控制台。
因此，您的消息可能被正确记录，但随后您会立即发送到一个新的URL，并且您再也看不到它。
尝试在devtools中的
console.log行上添加一个断点，这样您就可以看到代码的执行情况。