php+AJax+jsonを使用してログイン検証を実装する方法-PHPの問題-php.cn

ホームページ

バックエンド開発

PHPの問題

php+AJax+jsonを使用してログイン検証を実装する方法

PHPz

Mar 17, 2023 pm 08:35 PM

php json ajax

WEB2.0 と AJAX の発展に伴い、AJAX テクノロジを使用して一部のページを非同期的に読み込むサイトが増えています。人気のある Web 開発言語である PHP を AJAX と組み合わせると、優れた効果を実現できます。この記事では、AJAX と JSON を使用して基本的なログイン検証機能を実装する方法を紹介します。

まず、index.html、login.php、user.json のファイルを準備する必要があります。このうち、index.html は Web サイトのホームページ、login.php はログイン要求の処理に使用され、user.json はユーザー情報の保存に使用されます。

1.index.htmlのデザイン

index.htmlでは、ユーザー名とパスワードの2つのフィールドで構成されるログインフォームをデザインする必要があります。 AJAX 呼び出しを容易にするために、フォームに id 属性を追加できます。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
    <form id="login-form">
        <label>用户名：</label><input type="text" name="username"><br>
        <label>密   码：</label><input type="password" name="password"><br>
        <button type="button" id="login-btn">登录</button>
    </form>
    <div id="msg"></div>
    <script src="js/login.js"></script>
</body>
</html>

ログイン後にコピー

2.login.php

login.php の記述は、主にログイン要求を処理するために使用されます。ログインリクエストでは、ユーザー名とパスワードが正しいかどうかを判断する必要があります。正しい場合は、ログイン成功を示す JSON 形式の文字列が返されます。そうでない場合は、ログイン失敗メッセージが返されます。

<?php
header(&#39;Content-Type: application/json&#39;);
$data = json_decode(file_get_contents(&#39;../data/user.json&#39;), true);
$username = $_POST[&#39;username&#39;];
$password = $_POST[&#39;password&#39;];
if ($username === $data[&#39;username&#39;] && $password === $data[&#39;password&#39;]) {
    $result = array(&#39;status&#39; => 1, 'msg' => '登录成功');
} else {
    $result = array('status' => 0, 'msg' => '用户名或密码错误');
}
echo json_encode($result);

ログイン後にコピー

3. user.jsonの記述

user.jsonにはユーザー名とパスワードの情報が格納されます。このファイルは、手動で作成したり、データベースからエクスポートしたりするなど、さまざまな方法で生成できます。

{
    "username": "admin",
    "password": "123456"
}

ログイン後にコピー

4.login.js

$(function(){
    $('#login-btn').click(function(){
        $.ajax({
            type: 'POST',
            url: 'login.php',
            data: $('#login-form').serialize(),
            dataType: 'json',
            success: function (data) {
                if (data.status === 1) {
                    $('#msg').html(data.msg).css('color', 'green');
                } else {
                    $('#msg').html(data.msg).css('color', 'red');
                }
            }
        });
    });
});

ログイン後にコピー

上記のコードでは、まず jQuery セレクターを通じてログインボタンの ID を取得し、次にクリックイベントで AJAX メソッドを呼び出します。 AJAX メソッドでは、リクエストのタイプとアドレス、login.php に送信するデータを定義し、データ型を JSON として指定します。

コールバック関数では、返されたデータに基づいて論理演算を実行します。ログインが成功すると成功メッセージが表示され、ログインが成功しない場合は失敗メッセージが表示されます。

この時点で、基本的なログイン検証機能が実装されました。 AJAX と JSON の連携により、より効率的な Web 開発モデルを実現でき、ユーザーエクスペリエンスがよりスムーズになり、開発者の効率が向上します。

以上がphp+AJax+jsonを使用してログイン検証を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

ホットトピック

Gmailメールのログイン入り口はどこですか？

7484

CakePHP チュートリアル

1377

Steamのアカウント名の形式は何ですか

Win11 Activation Key Permanent

NYTの接続はヒントと回答です

Related knowledge

Ubuntu および Debian 用の PHP 8.4 インストールおよびアップグレードガイド Dec 24, 2024 pm 04:42 PM

PHP 8.4 では、いくつかの新機能、セキュリティの改善、パフォーマンスの改善が行われ、かなりの量の機能の非推奨と削除が行われています。このガイドでは、Ubuntu、Debian、またはその派生版に PHP 8.4 をインストールする方法、または PHP 8.4 にアップグレードする方法について説明します。