版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领
文档简介
广东东软学院本科生毕业设计（论文）基于HTML5的生活分享平台开发与实现DevelopmentandImplementationofaLife SharingPlatformBasedonHTML5内容摘要本项目是基于web端的一个生活分享平台。生活分享是社交中的一种方式，随着生活水平的逐渐提高，有许多用户通过发表文字、图片、视频等来记录自己在生活中的一点一滴及美好瞬间，在网络平台中通过这些方式去释放自己的心情，并结识更多志同道合的网友，互相交流、了解对方。希望能通过本系统的开发使用户更便捷地记录发表自己生活中美好的瞬间。网站前端基于HTML5进行设计，而后端则结合PHP技术加MYSQL数据库进行开发，便于记录管理用户信息。用户能够基于web端进行信息的记录，提高了现代网络社交的便捷水平。而系统本身应该具有实用性，可靠性，安全性；系统后台选择了MYSQL数据库作为系统的数据库记录信息，管理者可以对用户、用户动态及用户的评论进行管理。本文主要描述了该社交网站的开发过程包括网页设计、功能实现以及功能测试等等。本项目为这些热爱记录的用户提供记录的机会，还可以通过平台中的话题促进用户与用户之间进一步的交流。根据美学设计理念，网站呈现简约但不简单的效果，页面整体和谐。网站中各种功能界面更贴近现代社交平台设计，便于用户学习使用，简易上手。希望能通过该网站平台使用户获得在网络社交方面的便利。关键词：HTML5；网页开发；PHP技术；MYSQL数据库AbstractThisprojectisalifesharingplatformbasedontheweb.Lifesharingisawayofsocializing.Withthegradualimprovementoflivingstandards,manyusersrecordtheirbitbybitandbeautifulmomentsinlifebypostingtext,pictures,videos,etc.Waystoreleaseyourmoodandmeetmorelike-mindednetizenstocommunicatewitheachotherandunderstandeachother.Ihopethatthroughthedevelopmentofthissystem,userscanmoreconvenientlyrecordandpublishthebeautifulmomentsintheirlives.ThefrontendofthewebsiteisdesignedbasedonHTML5,andthebackendisdevelopedincombinationwithPHPtechnologyandMYSQLdatabase,whichisconvenientforrecordingandmanaginguserinformation.Userscanrecordinformationbasedontheweb,whichimprovestheconvenienceofmodernsocialnetworking.Thesystemitselfshouldhavepracticability,reliability,andsecurity;thesystembackgroundhasselectedtheMYSQLdatabaseasthesystem'sdatabaserecordinformation,andtheadministratorcanmanageusers,userdynamics,andusercomments.Thisarticlemainlydescribesthedevelopmentprocessofthesocialnetworkingsite,includingwebdesign,functionalimplementation,andfunctionaltesting.Thisprojectprovidestheopportunityfortheseuserswholovetorecord,andcanalsopromotefurthercommunicationbetweenusersthroughthetopicsintheplatform.Accordingtotheaestheticdesignconcept,thewebsitepresentsasimplebutnotsimpleeffect,andtheoverallpageisharmonious.Thevariousfunctionalinterfacesonthewebsiteareclosertothedesignofmodernsocialplatforms,makingiteasierforuserstolearnanduseandeasytouse.Itishopedthatthewebsiteplatformwillenableuserstogainconvenienceinsocialnetworking.Keywords：HTML5;WebDevelopment;PHPtechnology;MYSQLdatabase目录TOC\o"1-3"\h\u第一章绪论 绪论选题的目的和意义随着互联网的发展，各种各样的网络社交平台应运而生。它作为分享平台，为大众提供了记录生活方式的机会，人们通过各种图片文字来表达自己的想法，这对于记录者来说记录的是自己的故事，而对于观看者来说这又是另一种体验。因此，通过HTML5设计开发一个分享平台也是为大众开拓了又一个便利的记录平台。随着社交平台不断发展，越来越多的平台出现了。通过宣传运营，不少社交平台早已成为大众日常生活中重要的工具。生活水平的提高促使人们更多地通过电脑，手机等发表记录生活瞬间，记录心情，因此此类社交生活记录平台才得以发展，更多不同设计不同种类不同动能的平台被开发出来。而本次开发的主打生活方式分享网站，它的前端基于HTML5，后端基于PHP及数据库，以此实现用户在网上进行社交的系统。该网站的开发也将贴合大众使用社交网络分享平台的实际，能开阔社交范围，提高人们社交效率，为人们的社交提供便利。国内外研究现状HTML5在当代大放异彩与其一步步发展离不开关系。回首HTML5的发展历程，在1999年W3C发布HTML4以后，网络世界的发展速度开始加快，其进步性与发展性一度使人们认为HTML4已经是HTML中发展的最高标准。而正当人们在自我满足时，W3C开始了发展HTML5的步伐，随着年代科技的发展，用户的需求在不断的更新，在技术的推动以及商业的投资的基础上，HTML5得到了不断地完善与更新，而随着其功能不断地开发与完善，网络世界的新兴行业也不断兴起，HTML5的发展推动了这些行业的发展，用户的需求得以满足。而随着科技的发展，我们相信，用户的需求将会继续更新，HTML也将会推出更多种多样的新兴版本。我国拥有十分庞大的互联网群体，据统计，2019年中国就有超过8亿的互联网使用用户，可以说，市场需求十分庞大。游戏、生活、才艺类等直播行业的兴起也与HTML5强大的兼容性息息相关，因为HTML5提供了前所未有的新颖的方式，即数据与应用可以接入开放的接口，使外部硬件应用等可以直接与浏览器内部的数据直接相连，如视频影音等可以直接与麦克风和摄像头相关联，而将内容传送到前端，用户即可以作为观众与主播进行互动等。而HTML5突出的特点就是强化了网页的表现性，追加了本地数据库，可以用作离线应用的开发，离线应用就是把需要的资源先缓存到本地，下次再查看时无需联网。HTML5还有更多的功能特点，其开发与发展对互联网发展的促进作用无可比拟。所以我国在HTML5开发方面的人才需求也是十分庞大的，我国作为HTML5的后起之国，其发展程度与完善程度还达不到国外HTML5发展的高度，毕竟国外作为HTML5的发源国家，其HTML在历史上通过一步步不断开发与完善，甚至拥有了自己的多年以来的经验体系，是我国目前还不能达到的。课题研究内容本次课题是基于HTML5的社交网站平台，结合PHP技术和MYSQL数据库等技术开发出由用户自身管理个人专属社交平台的信息以及推出对应的管理员管理端，用于管理全部用户信息。正文开头阐述了基于HTML5社交网站的功能特点及开发需要的相关技术知识。结合开发的功能特性，首先是基于HTML5结合CSS的网站前端设计，通过Bootstrap框架等辅助排版设计装饰社交网站，使其能呈现更美观的页面效果与更简约的用户交互界面，结合市场上众多社交类平台的平面设计，设计出贴合社交用户使用习惯直接简约方便上手的社交记录平台，同时又应该保持自身网站的设计风格，设计出使用户耳目一新的交互界面。其次是结合PHP技术和MYSQL数据库，实现网站实时记录用户信息、用户动态、用户评论等功能，并将这些信息上传至管理员管理端，管理员能实时发现删除修改用户不文明动态信息，做到保持文明美好的社交平台环境。基于HTML5结合PHP技术+MYSQL数据库开发出贴合用户的功能性社交网站。系统开发环境2.1HTML概述HTML作为一种优秀的超文本标记语言，它在页面内可以包含包括文字、图片、链接、视频、音乐及程序等元素，实现在页面与页面之间跳转。其中，HTML结构包括头部分（<head></head>）、和主体部分（<body></body>）。其中头部<head>定义了网页的头部份，而在头部中也包含了一些元素供开发者使用。例如可以在头部中通过<link>引入想要用到的文件，以此定义HTML文档与引入的外部资源关系。也可以通过<title>定义网页的标题，通过<base>去定义页面的链接标签的链接地址，通过<meta>去定义HTML文档中的数据，通过<script>去定义页面的脚本，还可以通过<style>去定义HTML文档中的样式，如改变颜色、字体样式、超链接样式等网页中众多的样式的设置。而主体部分<body>则提供了网页的具体内容，呈现由开发者编译的内容，是网页实际展现的内容部分。在<body></body>中通过不同的元素编写网页，如<b>元素则是代表加粗，<p>元素则是代表换行等等，而元素中又有不同的属性如<pstyle=“”>中的“style”则是元素<p>的属性，<ahref=“”>中的“href”则是元素<a>的属性，<p>元素所没有的属性。在元素与元素期间也可以层层嵌套，如<p><h1>标题</h1><p>，而“标题”则可以实现两个元素的效果。元素虽然可以层层嵌套，但是在结束标签时需要注意要分清结束标签的先后，做到先开头后结束，层层对映的原则。而HTML的标签则是由一对尖括号及标签名组成，分为起始标签和结束标签，如<h5></h5>。HTML实际上只是文本，它还需要通过浏览器来解释展现文本中编译的内容。首先，可以通过最简单的文档编辑软件编辑，如使用微软电脑中自带的记事本即可实现，编写结束时将文档保存.html为拓展名则可以通过浏览器执行。其次可以通过半所见即得软件如SublimeText代码编辑器等在线网页编辑器。最后，还可以通过所见即得软件如AdobeDreamweaver、WebStorm等专业网页编辑器编辑，这些软件上手更快，对于初学者来学习更适合。相对于SublimeText代码编辑器等在线网页编辑器它只需要刷新即可显示修改过任何一小块地方代码的网页，实时显示错误的地方提示，且用其开发网页的效率更高，不论是在文件中编辑的代码还是在网页中展示其直观表现性更强。
编写网页时可根据开发者自己的情况去选择适合自己，更方便简易的编辑方式。2.2CSS概述CSS，又称为层叠样式表，对网页的页面设计效果、排版效果及最后在网页中展示的页面效果起到了无可比拟的作用。2001年W3C完成推出了CSS3的工作草案，为网站开发的页面效果设计贡献了巨大作用。在网页中，若想要实现一个旋转移动效果，可能需要在JavaScript中编写大量代码来实现，而正因为有了CSS，只需要几行代码即可实现这个效果，这为网站开发者带来了巨大便利。在CSS中，可以直接通过background-image设置网页背景图片，并且通过background-position、background-repeat等属性直接调整背景图片，直接避免因为页面多层次的问题而要反复设计协同布局。还可以通过CSS文本对网页中的文字效果进行设计，如通过line-height设置文字行高，还可以通过文本阴影text-shadow为文字加上阴影效果。而在CSS3版本中，更添加了box-shadow为盒子添加阴影。在CSS中还可以设置链接在不同状态如link、visted、hover、active时的效果，大大节省了在JavaScript中编写代码实现效果的时间，而对于超链接有下划线的效果，更可以通过一句简单的text-decoration：none;去掉，这些效果的实现都是十分便捷的。CSS列表与表格中的多个属性更使原本在网页中输出的僵硬表格更生动，视觉效果更好。在浏览图片网页时，可以发现图片都呈瀑布流布局排列，这也是CSS的作用之一，在CSS中可以通过几句简单的代码实现图片瀑布流效果布局，整个页面就能让人看起来更舒适，更整洁，在淘宝京东等购物网站中，都可以发现这种瀑布流的效果布局十分实用。而在CSS中极具亮点之一的便是其转换过渡与动画效果，通过位移函数translate()、缩放函数scale()、旋转函数rotate()、倾斜函数skew()四个函数实现页面中某些元素从静到动的变化效果，更可以通过过渡效果，在元素从这到那变化过程中添加过渡的视觉效果，更能抓住用户的眼球。同样的，CSS中的动画也是如此。通过CSS，开发者不用借助Adobe中的Flash、Photoshop等软件实现复杂的页面效果，也不需要冗长的JavaScript代码实现一些交互效果。但CSS在兼容性问题上仍存在一些问题，实现某一些效果时我们需要针对不用的浏览器输入不同的前缀如Chrome：-webkit-、Firefox：-moz-linear-gradient再加上想要实现的动画效果，但这仅仅是针对CSS中动画、瀑布流效果、过渡效果等，大部分CSS中的样式仍正常受用，且仅仅面对兼容性问题仅仅是多加一句前缀，这对于网站开发者来说都是正常可以接受范围内的。毕竟CSS所实现的页面效果是无可比拟的。2.3Bootstrap概述Bootstrap作为前端开发框架，是由美国Twitter公司的设计师MarkOtto和JacobThornton合作开发的。Bootstrap包含了基本结构、CSS、组件及部分JavaScript插件以及定制功能。通过CSS网站开发者可以轻易设计不同的页面效果，但有一些效果是不同网站开发者普遍共同需要的，例如导航栏、页面分块、下拉菜单等，这些效果对于不同网站的开发者是重复的编写，因此，Bootstrap就出现了。通过下载安装包引入css、js文件，开发者在文本中通过在<divclass=“”>中的class属性即可以标识这个<div>在bootstrap中定义好的css部分，通过两句简单的代码即可在里面开始编写导航栏的内容，所展现的导航栏页面效果基本是当代众多网站的大体导航栏布局，正因为引入了bootstrap，前端开发者不用自己再一次又一次编写重复的CSS代码，只需要简单的代码即可获得想要的效果。在bootstrap官网中，官方给出了许多例子有关前端页面排版等效果，这些都是十分实用的。还包含了一些在网页中十分实用的图标，如聊天闹钟箭头图片等，这些图标在前端的引用中既简洁又是用户生活中所熟悉的。引用时十分方便，还可以根据自己的喜好设置其大小。最贴心的是，在bootstrap中还有定制功能。通过改变代码前端开发者可以控制bootstrap生成自己想要的呈现的页面效果，定制的功能细致到可以整体改变文字颜色甚至按钮的颜色样式等再生成压缩包下载引用，开发效率更高，且前端开发者还能定制出属于自己构思独一无二的页面效果，布局统一和谐。2.4B/S结构随着HTML的发展，Web技术发展也在不断地完善。相对于C/S架构（客户机/网络/服务器）如腾讯QQ等，B/S架构（浏览器/\t"/item/BS%E6%9E%B6%E6%9E%84/_blank"服务器）模式有更强地适应范围。其建立在广域网之上，用户只需要下载一个浏览器如\t"/item/BS%E6%9E%B6%E6%9E%84/_blank"InternetExplorer、firefox等，服务器安装了\t"/item/BS%E6%9E%B6%E6%9E%84/_blank"SQLServer等数据库就可以通过访问web服务器实现数据交互，不需要像QQ、微信等C/S架构安装特定的软件才能进行访问。这样做大大简化了用户在使用客户端时的过程，也降低了开发成本，节约资源。2.5PHP简介PHP作为一种开源的脚本语言,在Web开发领域中扮演了至关重要的角色，其混合了C、Perl、Java和PHP本身自创的语法，有利于开发者的学习，在Web开发领域中使用十分广泛，更是众多实现动态网站开发中的首选。PHP技术加数据库的结合是众多初学者在开发动态网站的选择。在Web开发中，PHP相对于其他脚本语言更具这几点好处，首先，它作为一种开源的语言加上它的免费性，这更有利于激励更多想要学习的开发者去学习去使用，是一种非常容易学习并且上手的语言，而我国市场在这部分的需求也不断地吸引激励人才发展PHP技术，不断去更新去完善；其次，PHP还可以直接通过代码地编写实现与数据库相连接，如MySQL、Oracle等主流数据库，使开发者可以通过代码的编写对数据库中存储的数据直接处理并输出在网页前端，处理效率更高，更简化了处理步骤，执行效率高。正如进入网站时的登录注册步骤，通过PHP将用户注册的账号与设定的密码传到数据库中保存，在登录的时候再通过调用数据库中已注册的数据对比用户输入的账号密码是否正确而允许用户访问进入网站；最后，开发者在使用PHP语言时，可以同时将其面向过程及面向对象，将二者一起混合使用，这也是PHP相较于其它一些编程语言的一个重要特点。它可植入性强，在拓展性方面也相对完善。2.6MYSQL数据库MYSQL作为当代数据库管理系统主流之一，在存储管理数据上受到了绝大多数开发者的青睐，它是开放源代码的类型，方便任何开发者下载编写，更方便初学者学习理解使用，简易上手。它处理数据效率高，同时存放的信息可以很好归类整理，可以根据存放数据的不同类型不同使用人群建立不同的数据库，库内又可以建立不同的表格，表格中插入不同的标志信息，这样在存放数据时就能做到井然有序，而在查询时又可以更根据关键字进行查询并且输出结果，即使是面对大量数据储存都可以轻易通过SQL语言进行“增删改查”，是数据的“文件柜”。PHP技术加上MYSQL数据库的组合是绝大多数前端开发者的选择，特别是作为前端开发初学者，其免费性与开源兼容性都对开发者很友好，且处理数据高，节省了不必要的过程，节约成本，开发效率高等优点。通过这两个组合，为开发者营造了很好的开发环境。2.7总结综上所述，网站以B/S为架构，前端基于HTML5，加入了CSS样式及框架的使用，后端则采用PHP技术结合MYSQL数据库完成。系统分析3.1可行性分析本次开发的网站是基于HTML5的社交类网站，首先可以先通过现代各大社交类网站功能特性，结合用户沟通调查而分析出的目标需求初步确定本次网站开发的目标及所要实现的用户需求。通过上面两步确立目标后，接下来开始讨论开发网站的可行性。3.1.1技术可行性本次开发的网站主要前端由HTML5加上后端由PHP技术+MYSQL数据库实现，网站基于B/S架构，即浏览器/服务器模式开发。开发中，在前端页面部分借助HTML5结合CSS中的样式进行网站布局，还将引用Bootstrap框架利用它们结合设计出简约美观的用户界面，并将PHP嵌入基于HTML5的前端开发中，实现简单的动态交互网页。后端通过PHP技术+MYSQL实现用户管理员管理数据功能，能完整存储所有数据并能对数据进行操作。这几者的结合，完全可以保证及实现本次网站开发的目标，是本次网站开发不可或缺的。综上所述，本次网页的开发具备了技术的可行性。3.1.2操作可行性本次开发的网站基于B/S架构前端由HTML5加上后端由PHP技术+MYSQL数据库能基本实现网站的完整开发。而用户在运用该网站时不需要专业的代码知识，只需要使用电脑进行访问即可快速上手。与用户使用现代大多社交网站一样，通过简单的注册登录即可访问页面，浏览发布自己所想要发布的内容。对于管理员来说，则需要熟悉社交网站用户基本准则，对部分发布敏感言论的用户进行言论管理及注销用户。本次开发的网站十分便于用户及管理员操作，无需学习额外更多的操作知识，易于使用与管理。综上所述，本次网页的开发具备了操作的可行性。3.1.3经济可行性在本次开发的网站中，基于HTML5、PHP、MYSQL数据库技术支持的开源性及免费性，及开发所需要的设备软件都是开发者日常生活中具备的，因此开发成本较低，综上所述，本次网页的开发具备了经济的可行性。3.1.4法律可行性在本次开发的网站中，基于HTML5、PHP、MYSQL数据库技术支持都是开源性的，代码可以供网站开发者随意参考学习改写使用，没有触犯任何法律，且网站思想内容健康向上，网站皆由开发者构思布局，不存在触及法律等非法问题，综上所述，本次网页的开发具备了法律的可行性。3.2系统设计流程分析3.2.1系统开发流程分析本次开发的网站是基于HTML5的社交类网站，首先通过现代各大社交类网站功能特性，结合用户沟通调查而分析出的目标需求初步确定本次网站开发的目标及所要实现的用户需求，进行开发最后开发者进行网站测试，网站开发流程分析如图所示：图3-1系统开发流程分析图3.2.2系统操作流程分析首先进入网站时有登录注册步骤，网站通过PHP技术将用户注册的账号与设定的密码传到数据库中保存，在登录的时候再通过调用数据库中已注册的数据对比用户输入的账号密码是否正确而允许用户访问进入网站，操作流程如图所示：图3-2系统操作流程分析图3.2.3系统用户登录流程分析在用户进入网站时首先要先登录注册步骤，用户将自己注册的账号，账号则是用户的用户名，用户在正确输入对应注册的账号密码时则可以访问进入网站，系统用户登录流程分析如图所示：图3-3系统用户登录流程分析图3.3系统用例分析用户进入网站后，可以看到社交网站的首页、公告、广告、话题等内容，还可以编辑删除发布动态记录，编辑发表删除评论，用户用例分析如图所示：图3-4系统用户用例分析图系统设计4.1系统概述本次开发的社交网站以B/S为架构，所以用户只需要下载Chrome、Firefox等其中一个浏览器，通过在服务器上配置数据库连接，即可与网站进行数据交互。系统的工作原理如图：图4-1系统工作原理图4.2系统结构设计在系统的设计开发中，首先针对了当代众多社交类网站的功能模块对比，再根据调查的用户需求，网站分为了首页、话题两大板块，而网站的总体构成又是由每一个小用户块通过使用他们作为用户具有的特定功能以及用户与用户之间的交互、用户与话题之间的互动构成。所以在系统结构设计中，用户与用户模块、用户与话题模块、用户自身模块之间具有一定的联系，这便将被保存在网站的数据库中，并能实时进行数据交换。在设计开发时，应该先捋清这几大板块及它们之间的联系，初步提出半完整的整体系统结构设计，在后续的网站开发中能逐步完善整体结构设计，使其能顺利地进行数据信息交互，信息的管理上也能细致化，高效率化，构思出理想的系统构造设计。基于HTML5社交网站系统架构设计如图所示：图4-2系统结构设计图4.3数据库结构设计数据库的开发首先需要分析用户对系统的需求，然后根据用户的需求对数据库结构进行设计，最后运行和管理数据库[武法提，基于WEB的学习环境设计[J].电化教育研究，2000(4):33-38.黄华，网页设计与制作[J].电脑编程技巧与维护，2009(10):101-102.温谦.HTML+CSS网页设计与布局从入门到精通[M].人民邮电出版社，2008.武法提，基于WEB的学习环境设计[J].电化教育研究，2000(4):33-38.黄华，网页设计与制作[J].电脑编程技巧与维护，2009(10):101-102.温谦.HTML+CSS网页设计与布局从入门到精通[M].人民邮电出版社，2008.马强.Dreamweaver网页设计课程教学方法探讨[J].福建电脑，2008,24(4):208--208.[5]杨洁.数据库技术在湖北省局在线暂态稳定控制系统中的应用研究[D].华中科技大学,2006.[]赵扬名.基于JavaEE的烟草质量管理平台的设计与实现[D].武汉科技大学,2013.数据库作为存储网站交互数据的重要工具之一，所以在网站开发过程中需要先分清不同的人群使用的数据库。这要求了网站在开发中不仅要有用户自身使用对自己动态评论话题探讨的数据库，还要有管理员对管理网站中所有用户动态评论话题探讨的数据库，用户自身是没有权利使用管理员的数据库的，而管理员则可以管理用户的数据库，在用户没有违反网络文明言论等原则下可以不插手用户的数据库。这样的结构设计，既可以让用户有自身管理的自由，提高自身自觉意识，充分为用户营造了自己的“小天地”，也让管理员有管理的权利，充分保证了社交网站的美好环境。4.3.1数据库设计原则在设计数据库的过程中，通常使用自上而下、自下而上、逐步扩展、混合策略这四种方法[[]尹辉.基于PDM的发动机连杆产品结构和配置管理系统研究[D].昆明理工大学,2012.][]尹辉.基于PDM的发动机连杆产品结构和配置管理系统研究[D].昆明理工大学,2012.在物理结构设计阶段，分两步进行：确定物理结构和评估物理结构[[][]符石.毕业设计管理系统研究与开发[D].中山大学,2014.4.3.2数据库概念模型在设计数据库的过程中，先分清不同的人群使用的数据库，按照目前的开发学习，可以分为用户块及管理员块。其次，整理网站所需要存储实现交互的数据，将其根据共同特点分出大类小类。例如，在用户的数据库中建立一个评论模块的表，在这部分则需要用到的字段是用户的ID、评论的内容及评论的时间，这些之间都是存在一定的联系的。所以，通过对开发的网站的分析，我们可以绘制其概念数据模型以最大化地直观地展现，更有利于开发时操作。动态评论信息E-R图参考分析图：图4-3动态评论信息E-R图话题评论信息E-R图参考分析图：图4-4话题评论信息E-R图4.3.3数据库表设计在设计数据库阶段，通常使用现有的数据库管理系统作为数据库设计的基础[[]王一锋.基于B/S模式的网上书店交易平台系统的设计[D].山东大学，2009.[]王一锋.基于B/S模式的网上书店交易平台系统的设计[D].山东大学，2009.表4-1comment评论信息表列名数据类型长度主键允许空说明idint11否否编号user_idint11否否用户编号contentvarchar255否否评论内容create_timetimestamp否否评论时间表4-2topic话题评论信息表列名数据类型长度主键允许空说明idint11否否编号user_idint11否否用户编号contentvarchar255否否话题内容create_timetimestamp否否发表时间表4-3weibo用户动态信息表列名数据类型长度主键允许空说明idint11否否编号user_idint11否否用户编号contentvarchar200否否动态内容create_timetimestamp否否发表时间表4-4users用户动态信息表列名数据类型长度主键允许空说明idint11否否编号usernamevarchar255否否用户名passwordvarchar255否否密码系统实现本章系统实现内容主要分为前端界面功能的展示模块、后台数据库管理端界面模块及系统中一些核心代码的实现模块。5.1用户首页界面用户输入自己正确的账号密码后登录访问网页，其界面如图所示：图5-1网站首页界面5.1.1用户注册界面若用户没有自己的账号登录访问网页则先应该进行注册，系统将录入用户注册的信息传送至数据库保存，其界面如图所示：图5-2网站注册界面5.1.2用户登录界面在用户开始访问网站时首先进入的是登录界面,登录个人账号以进入网站，系统将对比用户信息是否正确允许其进入网站，其界面如图所示：图5-3网站登录界面5.1.3用户发表动态界面通过发表用户可以发布自己想要发布的内容，也可以删除自己不想要的动态，其界面如图所示：图5-4用户发表动态界面5.1.4用户评论动态界面通过评论功能用户可以评论别人的动态，其界面如图所示： 图5-5用户发表评论界面5.1.5话题界面网站还引入了有关话题的讨论，其界面如图所示：图5-6话题首页界面5.1.6用户话题评论界面用户可以利用评论功能参与话题讨论，其界面如图所示：图5-7话题讨论界面5.1.7系统公告内容界面系统中还放置了固定的公告，提醒用户文明上网，其界面如图所示：图5-8公告内容界面5.2系统后台实现用户在网站中即可以自己管理自己的数据信息等，而这些信息都会被存放在数据库中由管理员来把控，可以对用户的数据信息进行删除，修改等操作，营造一个良好的网络环境。5.2.1数据库实现系统管理者可进入数据库管理用户数据信息。其界面如图所示：图5-9数据库界面5.2.2后台管理中心界面管理者还可通过网站后台管理中心，管理用户数据信息。其界面如图所示：图5-10后台管理中心界面5.3核心代码实现核心代码的实现主要包括注册登录方面、发表评论动态方面、删除动态评论方面。5.3.1注册登录实现注册功能：1、首先确认注册网页成功连接数据库。2、判断是否是post请求以及是否都填入了用户名和密码，否则报错。3、符合要求则将注册的资料传入数据库保存。<?php
require
'conn.php';
if
('POST'
==
$_SERVER['REQUEST_METHOD'])
{
if
(!isset($_POST['username'])
||
''
==
$_POST['username'])
{
exit('账号不能为空');
}
if
(!isset($_POST['password'])
||
''
==
$_POST['password'])
{
exit('密码不能为空');
}
if
(!isset($_POST['confirm'])
||
$_POST['password']
!=
$_POST['confirm'])
{
exit('两次输入的密码不一致');
}
$result
=
$conn->query("SELECT
*
FROM
`users`
WHERE
`username`
=
'{$_POST['username']}'
LIMIT
1");
if
($result->num_rows)
{
exit('该账号已存在');
}
$conn->query("INSERT
INTO
`users`(`username`,
`password`)
VALUES
('{$_POST['username']}','{$_POST['password']}')");
exit('<script>alert("注册成功");location.href
=
login.php;</script>');
}
else
{
require
'../html/register.html';
}
登录功能：1、首先确认登录网页成功连接数据库。2、判断是否是post请求以及输入的账号密码是否与数据库中存入的数据相 同，不同则报错。3、符合要求登录成功跳转至网站首页。<?php
require
'conn.php';
if
('POST'
==
$_SERVER['REQUEST_METHOD'])
{
$result
=
$conn->query("SELECT
*
FROM
`users`
WHERE
`username`
=
'{$_POST['username']}'
AND
`password`
=
'{$_POST['password']}'
LIMIT
1");
if
(!$result->num_rows)
{
exit('账号不存在或密码错误');
}
setcookie('username',
$_POST['username']);
setcookie('password',
$_POST['password']);
header('location:
homepage.php');
}
else
{
require
'../html/login.html';
}
5.3.2评论动态发表删除实现发表动态功能：1、判断文本框中是否输入发布的内容。2、将发布的内容存入数据库中。3、调出数据库中保存的发布内容显示在网页中。
$user
=
$result->fetch_assoc();
if
(!isset($_POST['content'])
||
''
==
$_POST['content'])
{
exit('请输入要发布的内容');
}
$conn->query("INSERT
INTO
`weibo`(`user_id`,
`content`)
VALUES
('{$user['id']}','{$_POST['content']}')");
exit('<script>alert("发布成功");location.href
=
document.referrer;</script>');
}
else
{
header('location:
login.php');
}
$user
=
$result->fetch_assoc();
$result
=
$conn->query("SELECT
`weibo`.*,`users`.`username`
FROM
`weibo`
LEFT
JOIN
`users`
ON
`weibo`.`user_id`
=
`users`.`id`
WHERE
`weibo`.`user_id`
=
'{$user['id']}'
ORDER
BY
`create_time`
DESC");
=
array();
while
($res
=
$result->fetch_assoc())
{
$rows
=
$conn->query($sql
=
"SELECT
`comment`.*,`users`.`username`
FROM
`comment`
LEFT
JOIN
`users`
ON
`comment`.`user_id`
=
`users`.`id`
WHERE
`weibo_id`
=
'{$res['id']}'
ORDER
BY
`create_time`
DESC");
$comment
=
array();
while
($row
=
$rows->fetch_assoc())
{
$comment[]
=
$row;
}
$res['comment']
=
$comment;
$weibo[]
=
$res;
}
<?php
foreach($weibo
as
$wb)
{
?>
<div
class="media"
style="margin-top:20px;">
<a
class="media-left"
href="#">
<img
src="../images/u16.jpg"
height="62"
width="62"
class="img-circle"
alt=""/>
</a>
<div
class="media-body">
<h5
class="media-heading">
<b><?=$wb['username']?></b>
</h5>
<p
style="color:#999;font-size:12px;"><?=$wb['create_time']?></p>
<p><?=$wb['content']?>
删除动态功能：1、判断是否点击删除按钮。2、删除数据库中对应删除的内容。3、删除显示在网页中对应删除的内容。if
(isset($_COOKIE['username'],
$_COOKIE['password']))
{
$result
=
$conn->query("SELECT
*
FROM
`users`
WHERE
`username`
=
'{$_COOKIE['username']}'
AND
`password`
=
'{$_COOKIE['password']}'
LIMIT
1");
if
(!$result->num_rows)
{
header('location:
login.php');
}
$user
=
$result->fetch_assoc();
$conn->query("DELETE
FROM
`weibo`
WHERE
`id`
=
'{$_GET['id']}'");
exit('<script>alert("删除成功");location.href
=
document.referrer;</script>');
发表评论功能：1、判断是否输入评论内容及点击评论按钮。2、将评论内容存入数据库中。3、评论内容显示在网页用户动态下方。if
(!isset($_POST['content'])
||
''
==
$_POST['content'])
{
exit('<script>alert("请输入要评论的内容");history.back();</script>');
}
$conn->query("INSERT
INTO
`comment`(`user_id`,
`weibo_id`,
`content`)
VALUES
('{$user['id']}','{$_POST['weibo_id']}','{$_POST['content']}')");
exit('<script>alert("评论成功");location.href
=
document.referrer;</script>');
<form
action="comment.php"
method="post">
<input
type="hidden"
name="weibo_id"
value="<?=$wb['id']?>">
<div
class="input-group">
<input
type="text"
name="content"
class="form-control"
placeholder="请输入评论内容">
<span
class="input-group-btn"><button
class="btn
btn-default"
type="submit"
style="margin-right:
15px;">评论</button></span>
</div><!--
/input-group
-->
</form>
<div
class="list-group">
<?php
foreach($wb['comment']
as
$comment)
{
?>
<div
class="list-group-item"
style="margin-right:
15px;">
<h4
class="list-group-item-heading">
<?=$comment['username']?>
<small
class="text-muted"><?=$comment['create_time']?></small>
</h4>
<p
class="list-group-item-text"><?=$comment['content']?>
<a
href="comment-delete.php?id=<?=$comment['id']?>"
class="btn
btn-xs
btn-danger">删除</a></p>
</div>
<?php
}
?>
删除评论功能：1、判断是否点击删除按钮。2、将对应的评论内容从数据库中删除。3、删除显示在网页用户动态下方的对应评论。if
(!isset($_GET['id'])
||
''
==
$_GET['id'])
{
exit('<script>alert("请选择要删除的评论");history.back();</script>');
}
$conn->query("DELETE
FROM
`comment`
WHERE
`id`
=
'{$_GET['id']}'");
温馨提示
- 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 环保无害油菜籽订购合同
- 2024的区域代理合同范文
- 工厂房屋租赁合同谈判技巧
- 基金交易服务协议书模板
- 城市婚姻登记处离婚协议样本
- 机动车维修技术培训协议
- 个人承包水利工程协议
- 货车租赁协议书
- 2024广告公司工程合同范本
- 2024深圳市工程施工合同
- 议论文写作技巧
- 教科版五年级科学上册(风的作用) 教学课件
- 二年级下册语文试题 -“诗词大会”题库二 （word版有答案） 人教部编版
- GB/T 7702.20-2008煤质颗粒活性炭试验方法孔容积和比表面积的测定
- 新历史主义文艺思潮
- GB/T 40120-2021农业灌溉设备灌溉用热塑性可折叠软管技术规范和试验方法
- GB/T 3903.2-1994鞋类通用检验方法耐磨试验方法
- GB/T 10801.2-2018绝热用挤塑聚苯乙烯泡沫塑料(XPS)
- 12J5-1 平屋面建筑标准设计图
- 中印边境争端
- 《墨梅》课件(省一等奖)
评论
0/150
提交评论