目次
PHP+jQuery+Ajax は、jqueryajax を実装します。いくつかのプロジェクトでは、ログインに Ajax を使用する必要があります。ログインに成功した後は、ページの一部のみが表示されます。が更新されるため、ユーザー エクスペリエンスが向上します。この記事では、PHP と jQuery を使用してログイン機能とログアウト機能を実装します。
ホームページ バックエンド開発 PHPチュートリアル PHP+jQuery+Ajax によるユーザーのログインとログアウトの実装、jqueryajax_PHP チュートリアル

PHP+jQuery+Ajax によるユーザーのログインとログアウトの実装、jqueryajax_PHP チュートリアル

Jul 13, 2016 am 09:56 AM
ajax jquery php ログイン やめる

PHP+jQuery+Ajax は、jqueryajax を実装します。いくつかのプロジェクトでは、ログインに Ajax を使用する必要があります。ログインに成功した後は、ページの一部のみが表示されます。が更新されるため、ユーザー エクスペリエンスが向上します。この記事では、PHP と jQuery を使用してログイン機能とログアウト機能を実装します。

データベースを準備する


この例では、Mysql データベースを使用して、次のテーブル構造を持つユーザー テーブルを作成します:

リーリー

次に、ユーザー情報データの一部を user テーブルに挿入します。

リーリー


index.php


ユーザーがユーザー名とパスワードを入力すると、正常にログインするように求められ、「終了」をクリックすると、ユーザーのログイン インターフェイスが終了します。
「index.php」と入力します。ユーザーがログインしている場合は、ログイン情報が表示されます。ユーザーがログインしていない場合は、ログインを求めるログインボックスが表示されます。

リーリー
index.php ファイルのヘッダーに次のステートメントを追加する必要があることに注意してください: session_start; 同時に、ヘッド部分に jquery ライブラリを導入し、ログイン ボックスの美しい CSS スタイルを記述することもできます。もちろん、この例にはすでに少しシンプルなスタイルが記述されています。ソース コードを参照してください。

リーリー


global.js


global.js ファイルには、実装される jquery コードが含まれています。最初に行うことは、Baidu や Google のように、入力ボックスを開くとすぐにマウス カーソルが入力ボックス内にあるようにすることです。使用コードは次のとおりです:

リーリー

次に行うことは、入力ボックスがフォーカスを取得したときと失ったときに異なるスタイルを表示することです。たとえば、この例では、異なる境界線の色が使用されています。

リーリー

ユーザー ログイン: ユーザーがログイン ボタンをクリックした後、まずユーザーの入力を空にできないことを確認してから、Ajax リクエストをバックグラウンドの login.php に送信します。バックグラウンド検証ログインが成功すると、ログインしたユーザーの情報が返されます。ログインに失敗した場合は、ユーザーのログイン数や最終ログイン時刻などの情報が返されます。

リーリー

Ajax リクエストを行うとき、データ送信形式は json であり、返されるデータも JS を使用して json データを解析してログイン後のユーザー情報を取得し、それを #login 要素に追加します。ログイン操作を完了します。
ユーザー終了: [終了] をクリックすると、Ajax リクエストがlogin.php に送信され、すべてのセッションがバックグラウンドでログアウトされ、ページはログイン インターフェイスに戻ります。

リーリー

login.php

フロントからのリクエストに従い、ログイン時にユーザーが入力したユーザー名とパスワードを取得し、データベース内の対応するユーザー名とパスワードと比較し、成功した場合にユーザーのログイン情報を取得します。を新たに更新し、jsonデータをまとめてフロントに渡します。

リーリー

フロントエンドリクエストが終了したら、セッションからログアウトし、処理のためにフロントエンドJSに1を返します。上記のコードの get_client_ip() はクライアント IP を取得する関数であるため、ソース コードをダウンロードして参照することはできません。

さて、ユーザーのログインとログアウトの手順が完了しました。避けられない欠点がありますので、ご批判や修正を歓迎します。

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。

http://www.bkjia.com/PHPjc/990541.html

www.bkjia.comtru​​ehttp://www.bkjia.com/PHPjc/990541.html技術記事 PHP+jQuery+Ajax はユーザー ログインとログアウトを実装します。jqueryajax のユーザー ログインとログアウト関数は多くの場所で使用されており、ログインするには Ajax を使用する必要があります。
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

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

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

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

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

CakePHP プロジェクトの構成 CakePHP プロジェクトの構成 Sep 10, 2024 pm 05:25 PM

この章では、CakePHP の環境変数、一般設定、データベース設定、電子メール設定について理解します。

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

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

CakePHP データベースの操作 CakePHP データベースの操作 Sep 10, 2024 pm 05:25 PM

CakePHP でデータベースを操作するのは非常に簡単です。この章では、CRUD (作成、読み取り、更新、削除) 操作について理解します。

CakePHP の日付と時刻 CakePHP の日付と時刻 Sep 10, 2024 pm 05:27 PM

Cakephp4 で日付と時刻を操作するには、利用可能な FrozenTime クラスを利用します。

CakePHP ファイルのアップロード CakePHP ファイルのアップロード Sep 10, 2024 pm 05:27 PM

ファイルのアップロードを行うには、フォーム ヘルパーを使用します。ここではファイルアップロードの例を示します。

CakePHP ルーティング CakePHP ルーティング Sep 10, 2024 pm 05:25 PM

この章では、ルーティングに関連する次のトピックを学習します。

CakePHP について話し合う CakePHP について話し合う Sep 10, 2024 pm 05:28 PM

CakePHP は、PHP 用のオープンソース フレームワークです。これは、アプリケーションの開発、展開、保守をより簡単にすることを目的としています。 CakePHP は、強力かつ理解しやすい MVC のようなアーキテクチャに基づいています。モデル、ビュー、コントローラー

CakePHP バリデータの作成 CakePHP バリデータの作成 Sep 10, 2024 pm 05:26 PM

Validator は、コントローラーに次の 2 行を追加することで作成できます。

See all articles