KLiK SocialMediaWebsite ดาวน์โหลด - KLiK SocialMediaWebsite ดาวน์โหลด

KLiK SocialMediaWebsite

ข้อมูลเว็บไซต์

velopment Release

ดาวน์โหลด

Project Abandoned โครงการนี้ถูกทอดทิ้งและอาจล้าสมัยด้วยมาตรฐานปัจจุบันและด้วยความเคารพต่อความปลอดภัยและคุณสมบัติ ฯลฯ ฉันอาจปรับปรุงโครงการนี้ในอนาคต แต่ไม่มีการพัฒนาเพิ่มเติมในขณะนี้

KLIK เป็นระบบสระว่ายน้ำข้อมูลที่ใช้ PHP (หรือเพียงแค่เว็บไซต์โซเชียลมีเดีย) ประกอบด้วยระบบการเข้าสู่ระบบ/ลงทะเบียนที่สมบูรณ์ระบบโปรไฟล์ผู้ใช้ห้องแชทระบบฟอรัมและบล็อก/ระบบการจัดการ/การจัดการเหตุการณ์

สารบัญ

การติดตั้ง
- ความต้องการ
- ขั้นตอนการติดตั้ง
- เริ่มต้น
คุณสมบัติ
ส่วนประกอบ
- ภาษา
- สภาพแวดล้อมการพัฒนา
- ฐานข้อมูล
- DBMS
- API
- เฟรมเวิร์กและห้องสมุด
- เทคนิค
- ปลั๊กอินภายนอก
รายละเอียด
ไฟล์แอปพลิเคชัน
การปรับปรุงในอนาคต
ทีม

การติดตั้ง

ความต้องการ

PHP
เซิร์ฟเวอร์ Apache
ฐานข้อมูล MySQL
SQL
phpmyadmin

ข้อกำหนดทั้งหมดเหล่านี้สามารถทำได้พร้อมกันเพียงแค่ติดตั้งสแต็คเซิร์ฟเวอร์เช่น Wamp หรือ Xampp เป็นต้น

ขั้นตอนการติดตั้ง

นำเข้าไฟล์ klik_database.sql ในโฟลเดอร์ includes ไปยัง phpmyadmin ไม่จำเป็นต้องมีการเปลี่ยนแปลงใด ๆ ในไฟล์. sql สิ่งนี้จะสร้างฐานข้อมูลที่จำเป็นเพื่อให้แอปพลิเคชันเป็นฟังก์ชัน
แก้ไขไฟล์ dbh.inc.php ในโฟลเดอร์ includes เพื่อสร้างการเชื่อมต่อฐานข้อมูล เปลี่ยนรหัสผ่านและชื่อผู้ใช้เป็นชื่อที่ใช้ภายในการติดตั้ง phpMyAdmin ปัจจุบัน ไม่จำเป็นต้องเปลี่ยนแปลงสิ่งอื่นใด

 $ serverName = " localhost " ;
$ dBUsername = " root " ;
$ dBPassword = " examplePassword " ;
$ dBName = " klik_database " ;

$ conn = mysqli_connect ( $ serverName , $ dBUsername , $ dBPassword , $ dBName , 3307 );

if (! $ conn )
{
    die ( " Connection failed: " . mysqli_connect_error ());
}

หมายเลขพอร์ตไม่จำเป็นต้องเปลี่ยนแปลงภายใต้สถานการณ์ปกติ แต่ถ้าคุณกำลังพบปัญหาหรือติดตั้งเซิร์ฟเวอร์สแต็กบนพอร์ตอื่นอย่าลังเลที่จะเปลี่ยน แต่ทำอย่างระมัดระวัง

แก้ไขไฟล์ email-server.php ในโฟลเดอร์ includes และเปลี่ยนตัวแปรตาม:

$SMTPuser : ที่อยู่อีเมลบน gmail
$SMTPpwd : รหัสผ่านที่อยู่อีเมล
SMTPtitle : ชื่อ บริษัท สมมุติ
Domain : โดเมนของเว็บไซต์เช่น localhost บนเซิร์ฟเวอร์ท้องถิ่นหรือถ้าอยู่ในโดเมนสดบางอย่างเช่น www.hypotheticalwebsite.com

 $ SMTPuser = ' [email protected] ' ;   
$ SMTPpwd = ' some-example-password ' ;
$ SMTPtitle = " KLiK inc. " ;
$ Domain = ' localhost ' ;

ขั้นตอนนี้ส่วนใหญ่สำหรับการตั้งค่าบัญชีอีเมลเพื่อเปิดใช้งาน password reset system contact และรหัสผ่านซึ่งทั้งหมดต้องมีการส่งจดหมาย

ในขั้นตอนปัจจุบันของแอปพลิเคชันจะรองรับบัญชี Gmail เท่านั้น

เริ่มต้น

ไฟล์ฐานข้อมูลมีข้อมูลตัวอย่างและผู้ใช้จำนวนมากอยู่แล้ว ผู้ใช้ส่วนใหญ่ในฐานข้อมูลมีรหัสผ่านเดียวกับชื่อผู้ใช้ยกเว้นไม่กี่ชื่อ เป็นไปไม่ได้ที่จะลงทะเบียนเป็นผู้ดูแลระบบผ่านแอปพลิเคชันเนื่องจากเราตัดสินใจว่ามันเป็นจุดอ่อนที่ถูกเอาเปรียบ ดังนั้นคุณจะต้องสร้างบัญชีและไปที่ตาราง users ด้วยตนเองในฐานข้อมูลเพื่อเปลี่ยน userlevel ของบัญชีนั้นเป็น 1 จาก 0

0 ระดับหมายถึงผู้ใช้ปกติและระดับ 1 หมายถึงผู้ดูแลระบบ

วิธีง่ายๆในการเข้าถึงบัญชีตัวอย่างทั้งหมดโดยไม่ต้องลบออกและการสูญเสียข้อมูลตัวอย่างทั้งหมดคือการเปลี่ยน email ของพวกเขาด้วยตนเองจากภายใน phpmyadmin เป็นที่อยู่อีเมลที่ถูกต้อง จากนั้นลองเข้าสู่ระบบด้วยบัญชีนั้นโดยใช้รหัสผ่านที่ไม่ถูกต้องและใช้ forgot password? link เพื่อรีเซ็ตรหัสผ่านบัญชี อีเมลบัญชีสามารถเปลี่ยนแปลงได้อย่างปลอดภัยอีกครั้งเป็นเรื่องเล็กน้อยในภายหลัง

คุณสมบัติ

แดชบอร์ดแอปพลิเคชัน
เข้าสู่ระบบ/ลงทะเบียนและการตรวจสอบผู้ใช้
ระบบโปรไฟล์ผู้ใช้
กล่องจดหมายเข้า/แชท
ระบบฟอรัม
ระบบการจัดการบล็อก
ระบบการจัดการการสำรวจ/การลงคะแนน
ระบบการจัดการเหตุการณ์
ความปลอดภัย

ส่วนประกอบ

ภาษา

 PHP 5.6.40
SQL 14.0
JavaScript ES 6
HTML5
CSS3

สภาพแวดล้อมการพัฒนา

 WampServer Stack 3.0.6
Windows 10

ฐานข้อมูล

 MySQL Database 8.0.13

DBMS

 phpMyAdmin 4.8.3

API

 MySQLi APIs

เฟรมเวิร์กและห้องสมุด

 JQuery v3.3.1
BootStrap v4.2.1

เทคนิค

 AJAX

ปลั๊กอินภายนอก

 [PHPMailer 6.0.6](https://github.com/PHPMailer/PHPMailer)

สิ่งนี้ใช้สำหรับการสร้าง mail server บน Windows localhost เนื่องจากไม่เหมือนใน Linux จึงไม่มีการติดตั้งหนึ่งใน Windows แล้ว ปลั๊กอินนี้ใช้สำหรับการส่งและรับอีเมลใน LocalHost และไม่จำเป็นในโดเมนสด

รายละเอียด

รายละเอียดของคุณสมบัติที่สำคัญของแอปพลิเคชัน

แดชบอร์ดแอปพลิเคชัน

แดชบอร์ดจัดเตรียมอินเทอร์เฟซส่วนกลางให้กับคุณสมบัติส่วนใหญ่ของแอปพลิเคชัน User profile card ที่มุมซ้ายบนของหน้าจอให้สรุปโปรไฟล์รวมถึงลิงก์ไปยังโปรไฟล์และหน้าการแก้ไขโปรไฟล์ ปุ่มผู้สร้างที่มุมขวาบนให้ลิงก์ที่โดดเด่นไปยังหน้าทีมซึ่งแสดง KLiK Creators

อินเตอร์เฟสแท็บ 4 ตัวในศูนย์ให้การเข้าถึง Forums Blogs Polls และ Events ล่าสุดที่สร้างขึ้น latest หรือล่าสุด ส่วนประกอบแสดงลักษณะเฉพาะขององค์ประกอบที่เกี่ยวข้องเช่น upvotes ทั้งหมดสำหรับฟอรัม likes บล็อก votes สำหรับการสำรวจและ days remaining สำหรับเหตุการณ์ มีปุ่มอีก 2 ปุ่มซึ่งไปที่ KLiK Forums (อินเทอร์เฟซกลางสำหรับฟอรัม) และ KLiK Hub (อินเทอร์เฟซกลางสำหรับบล็อกโพลและระบบการจัดการเหตุการณ์)

ระบบการจัดการ

Forum System :
- การสร้างฟอรัม
- การตอบกลับ / โพสต์ข้อความในฟอรัม
- หมวดหมู่ฟอรัม
- ความสามารถของผู้ดูแลระบบในการสร้างหมวดหมู่ฟอรัม
- ระบบ upvote/ downvote ในการตอบกลับฟอรัม (ไม่มีการทำซ้ำการลงคะแนน ฯลฯ เป็นไปได้)
- ความสามารถในการลบการตอบกลับฟอรัมของคุณเอง (ผู้ดูแลระบบสามารถลบได้)
Blog Management System :
- การสร้างบล็อก
- การเลือกภาพปกบล็อกเสริม (มีภาพเริ่มต้น)
- Like ระบบในบล็อก (ผู้ใช้สามารถชอบบล็อกหรือลบสิ่งที่ชอบ)
- การลบบล็อกของตัวเอง (ผู้ดูแลระบบสามารถลบได้)
Event Management System :
- ระบบการสร้างเหตุการณ์
- การเลือกภาพปกเหตุการณ์เพิ่มเติม (มีภาพเริ่มต้น)
- พาดหัว
- ข้อมูลเหตุการณ์ (ไม่บังคับ)
- กำหนดวันที่จัดกิจกรรม
- การนับถอยหลังแบบเรียลไทม์ในหน้ากิจกรรม
- การทำเครื่องหมายอัตโนมัติเสร็จสมบูรณ์ในวันที่ผ่านเหตุการณ์
Poll Management System :
- การสร้างแบบสำรวจ
- การลงคะแนนในการสำรวจความคิดเห็น
- การเปลี่ยนแปลง / ดูการโหวตปัจจุบัน
- ล็อค / เปิดโพล (การโหวตไม่สามารถเปลี่ยนแปลงในการสำรวจล็อคได้)
- การดูผลลัพธ์ [การลงคะแนนผู้ใช้ทั้งหมด ผู้ใช้โหวตสำหรับแต่ละตัวเลือก]
- แยกหน้าเพื่อดูตัวเลือกการสำรวจความคิดเห็นแต่ละตัวพร้อมกับผู้ใช้แต่ละคนที่ลงคะแนนเสียง

เข้าสู่ระบบ/ลงทะเบียนและการตรวจสอบผู้ใช้

KLIK รองรับระบบการลงทะเบียน/ลงทะเบียนและโปรไฟล์ผู้ใช้ที่สมบูรณ์ เมื่อเริ่มต้นแอปพลิเคชันจะแสดงตัวเลือกสำหรับการเข้าสู่ระบบลงทะเบียนหรือติดต่อผู้ดูแลระบบเว็บไซต์ทางอีเมล ผู้ใช้แต่ละคนสามารถสร้างชื่อผู้ใช้ที่ไม่ซ้ำกันซึ่งไม่สามารถเปลี่ยนแปลงได้ในภายหลัง passwords ผู้ใช้จะถูก hashed ก่อนที่จะจัดเก็บในฐานข้อมูลดังนั้นผู้ดูแลระบบก็ไม่สามารถเข้าถึงรหัสผ่านเดิมได้เช่นกัน ข้อมูลผู้ใช้เพิ่มเติมรวมถึง Full Name , email , Profile Image , Profile Headline , Gender และ Bio

นอกจากนี้ยังมี Password Recovery System ที่ปลอดภัยซึ่งช่วยให้ผู้ใช้สามารถรีเซ็ตรหัสผ่านได้อย่างปลอดภัย แอพสร้างการเชื่อมโยงโทเค็นที่เข้ารหัสชั่วคราวด้วยเวลาหมดอายุซึ่งเมื่อใช้โดยผู้ใช้จะแจ้งให้เปลี่ยนรหัสผ่าน เนื่องจากต้องใช้รหัสผ่านปัจจุบันกระบวนการจึงปลอดภัยและมีโอกาสเกิดการแสวงหาผลประโยชน์น้อยลง

แอพใช้วิธีการตรวจสอบความถูกต้องหลายวิธีสำหรับการลงทะเบียนและเข้าสู่ระบบตรวจสอบ empty fields wrong username wrong password SQL errors server errors และในกรณีที่ลงทะเบียน corrupted image หรือ wrong image type

ระบบโปรไฟล์ผู้ใช้

Klik มี User profile system ที่สมบูรณ์ ผู้ใช้แต่ละคนจะได้รับการกำหนดโปรไฟล์เมื่อลงทะเบียนซึ่งผู้ใช้สามารถสร้างฟอรัมบล็อกกิจกรรม ฯลฯ และโต้ตอบกับคุณสมบัติของแอป ชื่อเต็มของผู้ใช้พาดหัวและชีวภาพรวมถึงภาพโปรไฟล์เป็นทางเลือกซึ่งหมายความว่าทุกคนสามารถลงทะเบียนได้โดยไม่ต้องตั้งค่าเหล่านั้น ในกรณีนั้นผู้ใช้จะได้รับการกำหนดรูปภาพผู้ใช้เริ่มต้นและพาดหัวไบโอและชื่อเต็มจะว่างเปล่า

user profile สามารถเข้าถึงได้ผ่านตัวเลือกในเมนูการตั้งค่าบนแถบการนำทางหรือมากกว่านั้นโดยคลิกที่ภาพผู้ใช้บนการ์ดโปรไฟล์ผู้ใช้ซึ่งมีอยู่ที่มุมซ้ายบนของหน้าจอแอพในหน้าส่วนใหญ่ หน้าโปรไฟล์แสดงข้อมูลผู้ใช้พื้นฐานเช่นชื่อผู้ใช้ชื่อเต็มเพศพาดหัวและชีวภาพ นอกเหนือจากนั้นมันยังแสดงให้เห็นถึง Forums และ Blogs ที่แตกต่างกันที่ผู้ใช้ได้สร้างขึ้นพร้อมกับ Polls ที่เขา/เธอเข้าร่วมถ้าในกรณีที่ผู้ใช้ไม่ได้ทำสิ่งใดหรือเป็นใหม่หน้าแสดงแมวบองโกตัวน้อยน่ารักที่มีคำบรรยายใต้ภาพ 'ที่ว่างเปล่า'

นอกจากนี้ยังมี Profile Editing System ที่อนุญาตให้ผู้ใช้แก้ไขข้อมูลโปรไฟล์ของเขา สามารถเข้าถึงได้ผ่านตัวเลือกที่เกี่ยวข้องในเมนูการตั้งค่าในแถบการนำทางหรือเพียงแค่คลิกที่ไอคอนดินสอถัดจากภาพโปรไฟล์ผู้ใช้บนการ์ดโปรไฟล์ ระบบอนุญาตให้ผู้ใช้เปลี่ยนข้อมูลส่วนใหญ่ของเขายกเว้นชื่อผู้ใช้ซึ่งไม่สามารถเปลี่ยนแปลงได้ ฟิลด์ทั้งหมดมีข้อมูลปัจจุบันอยู่แล้วดังนั้นผู้ใช้ไม่จำเป็นต้องพิมพ์ทุกอย่างทั้งหมดอีกครั้งหากเขาต้องการแก้ไขข้อมูลปัจจุบันเล็กน้อยเท่านั้น อย่างไรก็ตามรหัสผ่านยังสามารถเปลี่ยนแปลงได้โดยการให้รหัสผ่านปัจจุบันเพื่อรักษาอินเทอร์เฟซที่ปลอดภัยยิ่งขึ้น

ห้องแชท / กล่องจดหมาย

Klik ยังมีแชทบ็อกซ์ซึ่งใช้ PHP & AJAX สำหรับการแชทแบบเรียลไทม์กับผู้ใช้รายอื่น ส่วนทางด้านซ้ายเป็นรายการของผู้ใช้ทั้งหมดที่อยู่ในเว็บไซต์ในขณะที่หน้าจอแชทที่ถูกต้องสำหรับการแสดงข้อความ ingoing และขาออก ผู้ใช้สามารถเข้าถึงการแชทกับผู้ใช้บางรายได้โดยคลิกที่เขา/เธอในรายชื่อผู้ใช้ซึ่งจะดึงข้อความแชททั้งหมดจากฐานข้อมูล ข้อความ ingoing และขาออกมีสไตล์แตกต่างกันเพื่อรักษาความสามารถในการอ่าน การแชทจะทำแบบเรียลไทม์โดยไม่จำเป็นต้องรีเฟรชหน้าอย่างต่อเนื่อง

การปรับปรุงที่เป็นไปได้ :

optimization : ข้อความทั้งหมดของการแชทจะถูกเรียกคืนในครั้งเดียวและสิ่งนี้อาจทำให้เกิดความล่าช้าหากการแชทใหญ่ สิ่งนี้สามารถแก้ไขได้โดยใช้การโหลดข้อความที่เพิ่มขึ้นเพื่อโหลดเฉพาะข้อความที่แสดงบนหน้าจอ
user search : คุณลักษณะการค้นหาสามารถนำไปใช้ในรายการผู้ใช้เพื่อค้นหาผู้ใช้โดยตรงโดยตรงดังนั้นจึงประหยัดเวลา

ความปลอดภัย

Password hashing ก่อนจัดเก็บในฐานข้อมูล
การรีเซ็ตรหัสผ่านเสร็จสิ้นผ่าน encrypted tokens ที่สร้างขึ้นเป็นรายบุคคลที่ส่งผ่านอีเมลเป็นรูปแบบของลิงค์ โทเค็นมีวันหมดอายุที่แน่นอนหลังจากนั้นไม่สามารถใช้งานได้
การกรองข้อมูลที่ได้รับจาก $_GET และ $_POST วิธีการเพื่อป้องกัน header injection
การใช้ MySQLi Prepared Statements สำหรับความปลอดภัยฐานข้อมูล ขั้นสูง
ตัวอย่าง:

 $ sql = " select uidUsers from users where uidUsers=?; " ;
        $ stmt = mysqli_stmt_init ( $ conn );
        if (! mysqli_stmt_prepare ( $ stmt , $ sql ))
        {
            header ( " Location: ../signup.php?error=sqlerror " );
            exit ();
        }
        else
        {
            mysqli_stmt_bind_param ( $ stmt , " s " , $ userName );
            mysqli_stmt_execute ( $ stmt );
            mysqli_stmt_store_result ( $ stmt );
       }

ไฟล์แอปพลิเคชัน

รายการคุณสมบัติแอปพลิเคชันหลักทั้งหมดและไฟล์ front-end และ back-end ที่เกี่ยวข้อง

คุณสมบัติ	ไฟล์ส่วนหน้า	ไฟล์แบ็กเอนด์
แผงหน้าปัด	`index.php (Main Dashboard)` , `Forum.php` , `Hub.php`	N/A
ระบบฟอรัม	`categories.php` , `create-category` , `topics.php` , `create-topic.php` , `posts.php`	`create-category.inc.php` , `create-topic.inc.php` , `delete-category.php` , `delete-forum.php` , `delete-post.php`
ระบบบล็อก	`blog-page.php` , `blogs.php` , `create-blog`	`blog-vote.inc.php` , `create-blog.inc.php`
ระบบเหตุการณ์	`event-page.php` , `events.php` , `create-event.php`	`create-event.inc.php`
ระบบสำรวจความคิดเห็น	`poll.php` , `polls.php` , `poll-voters.php`	`create-poll.inc.php` , `delete-poll.inc.php` , `poll.class.php` , `post-vote.inc.php`
ห้องสนทนา	`message.php`	`post_message_ajax.php` , `get_message_ajax.php` , `script.js`
การลงชื่อเข้าใช้/ เข้าสู่ระบบ	`signup.php` , `login.php`	`signup.inc.php` , `login.inc.php` , `logout.inc.php`
ระบบโปรไฟล์	`profile.php` , `edit-profile.php`	`profileUpdate.inc.php`
รีเซ็ตรหัสผ่าน	`reset-pwd.php` , `create-new-pwd.php`	`reset-request.inc.php`
อัพโหลดรูปภาพ	N/A	`upload.inc.php`
ผู้สร้าง Showcase	`team.php` , `KLiK_anas-imran.php` , `KLiK_anas-kamal.php` , `KLiK_saad.php` , `KLiK_ubaid.php`	N/A
ค้นหาผู้ใช้	`users-view.php`	N/A

หมายเหตุ: ไฟล์ GUI อยู่ใน root directory และ backend files มีอยู่ในโฟลเดอร์ includes ในทำนองเดียวกันไฟล์ CSS และ JS ทั้งหมดมีอยู่ในไดเรกทอรี css & js ที่แสดง เฉพาะไฟล์ผู้สร้างใน _KLiK Creators folder เท่านั้นที่มีไฟล์ CSS ของตัวเอง ไฟล์โครงสร้าง HTML หลักคือ HTML-head.php และ HTML-footer.php ซึ่งอยู่ในโฟลเดอร์รวม