ログインページにジャンプしてphp+jsで更新する方法
- PHPzオリジナル
- 2023-03-29 10:09:30492ブラウズ
Web アプリケーションを開発していると、JS でログイン ページにジャンプして更新する必要がある状況によく遭遇します。この記事では、PHP と JS を使用してこれを実現する方法について説明します。
1. ログインページを作成する
まず、ユーザーがユーザー名とパスワードを入力するためのログイン ページを作成する必要があります。このページには、ユーザー名とパスワードを入力するためのテキスト ボックスと送信ボタンを備えた HTML フォームが含まれている必要があります。
PHP では、「セッション」を使用して、他のページにアクセスするためのユーザー情報を保存できます。したがって、ユーザーが正常にログインした後、ユーザー名を「セッション」に保存する必要があります。 PHP では、次のコードを使用できます:
``` session_start(); // Start the session $_SESSION['username'] = $username; // Store the username in the session ```
2. ユーザーがログインしているかどうかを確認します。
JS をログイン ページにジャンプさせる前に、ユーザーがログインしているかどうかを確認する必要があります。ここでは、PHP 関数 `isset()` を使用して、`session` 変数内のユーザー名が存在するかどうかを確認できます。ユーザー名が存在する場合、そのユーザーはログインしていることを意味します。存在しない場合は、ユーザーをログイン ページにリダイレクトする必要があります。
ユーザーがログインしているかどうかを確認するサンプル コード:
```
session_start(); // Start the session
if(!isset($_SESSION['username'])) {
header("Location: login.php"); // Redirect to login page
exit();
}
```3. JS でログイン ページにジャンプし、更新します。 ユーザーがログインしているかどうかを確認したので、次のステップでは、JS をログイン ページにジャンプさせて更新します。 JS の `window.location.href` メソッドを使用して、ターゲット URL にジャンプできます。
この例では、「login.php」ページにジャンプする必要があります。コードは次のようになります。
``` window.location.href = "login.php"; ```
ジャンプが完了したら、ページを更新して開始する必要があります。 `session `更新されたユーザー情報を取得します。 `location.reload()` メソッドを使用して現在のページを更新できます。
完全な JS コードは次のとおりです:
```
if(!isset($_SESSION['username'])) {
window.location.href = "login.php";
location.reload();
exit();
}
```4. 完全なコード
以下は、ログイン ページにジャンプして更新する機能を実装するための完全な PHP コードと JS コードです。index.php:
```php
<?php
session_start(); // Start the session
if(!isset($_SESSION['username'])) {
header("Location: login.php"); // Redirect to login page
exit();
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
<script type="text/javascript">
if(!sessionStorage.getItem('loggedIn')) {
window.location.href = "login.php";
location.reload();
exit();
}
</script>
</head>
<body>
<h1>Welcome, <?php echo $_SESSION['username']; ?></h1>
<p>Thank you for logging in.</p>
</body>
</html>
```
login.php:
```php
<?php
session_start(); // Start the session
if(isset($_POST['submit'])) {
$username = $_POST['username'];
$password = $_POST['password'];
// Check if username and password are correct
if($username == "admin" && $password == "password") {
$_SESSION['username'] = $username; // Store the username in the session
header("Location: index.php"); // Redirect to index page
exit();
} else {
$errorMessage = "Invalid username or password";
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Login</title>
</head>
<body>
<h1>Login</h1>
<?php if(isset($errorMessage)) { ?>
<p><?php echo $errorMessage; ?></p>
<?php } ?>
<form method="post">
<p>
<label for="username">Username:</label><br>
<input type="text" name="username" id="username">
</p>
<p>
<label for="password">Password:</label><br>
<input type="password" name="password" id="password">
</p>
<p>
<input type="submit" name="submit" value="Login">
</p>
</form>
</body>
</html>
```この例では、チェックに `sessionStorage` を使用していることに注意してください。ユーザーがログインしている場合。これは「セッション」と同様にデータを保存するための JavaScript API です。
次のコードを使用して、ユーザー名を `sessionStorage` に保存できます:
``` sessionStorage.setItem('loggedIn', 'true'); ```
5. 概要
この記事では、PHP と JS を使用しました。ログインページにジャンプして更新する例を実装しました。まず、ユーザーがログインしているかどうかを確認し、次に JS を使用してログイン ページにジャンプし、更新して「セッション」から更新されたユーザー情報を取得する必要があります。この機能は、権限のないユーザーを適切に処理できるため、Web アプリケーションのセキュリティを確保するために非常に重要です。
以上がログインページにジャンプしてphp+jsで更新する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。