作者主页：编程千纸鹤
作者简介：Java、前端、Pythone开发多年，做过高程，项目经理，架构师
主要内容：Java项目开发、毕业设计开发、面试技术整理、最新技术分享
一，项目简介
本设计基于Laravel框架和MySQL数据库开发，Windows作为操作系统实现。本系统在开发设计时首先分析当前国内外电子商务的研究现状，然后对电子产品商城系统进行了可行性分析、需求分析，然后对系统功能进行了详细设计，最终成功开发出电子产品商城系统，并进行了系统测试。学子商城网站整体上分为系统前台商品展示、购买和后台数据管理。学子商城的前台部分，主要进行了数据展示，用户可以分类浏览商品然后进行在线下单、支付，完成完整的前端产品购买流程。商城后台管理中主要涉及到用户数据管理、产品数据管理、分类数据管理、订单数据管理、评价数据管理等模块。
前端页面是产品的重要展示窗口，也是和用户进和交互的主要阵地，前端的页面设计一是要美观大方，二是要功能齐全。现在整个商业形态中都在以用户体验为中心，各家商家为了给用户更好的体验花费不少功夫。本项目的前端用户交互设计以异步请求为主，提高系统的响应时间和用户的体验。在功能设计上主要满足，电子产品分类浏览，添加购物车，产品下单购买，个人订单管理等功能。
后台数据管理功能，主要完成对前端页面所产生的相关业务数据进行管理。比如对注册用户的管理、商品的管理、用户的订单管理、产品分类的管理等等。后台管理可以有效的帮助网站运营者查看相关信息，了解每天的产品销售情况，订单情况，以便于及时的进行销售策略的调整等等，是至关重要的一环
二，环境介绍
语言环境：PHP
数据库：Mysql: mysql5.7
应用服务器：APACHE
开发工具：IDEA或eclipse
三，系统展示
3.1 前台功能模块实现
通过前台框架的搭建，及后台数据库内容的传输，完善了前台页面的所有功能，前台首页如图5.1所示。
图3.1 前台首页界面图
3.1.1 前台用户注册登录模块的实现
任何用户都可以在学子商城网站，通过注册界面，注册账号密码，然后准确输入系统提供的验证码后，提交到系统，系统会验证用户输入信息的有效性，是否符合系统注册规则，验证无误后系统会将注册信息存入数据库，用户便完成了注册。用户完成注册并且登录后就可以在电商平台上完成相关的商品搜索浏览、订单和购买等业务操作。用户注册界面图如图5.2所示。用户登录界面图如图5.3所示。
图3.2 前台用户注册界面图
图3.3 前台用户登录界面图
用户在注册时，输入要注册的用户名和登录密码，并且成功验证由Session服务器技术等技术生成的验证码后才能成功注册。系统将用户注册的信息上传到数据库，用户登录时输入自己的账号密码，并且成功验证验证码后，才能登录成功。
3.1.2 前台用户购物车模块的实现
用户在商城看到想要购买的商品时，可以将商品选择加入购物车，加入购物车后，可以点击界面右侧的购物车图标，可以查看购物车中的商品信息，包括商品名称、商品数量、商品价格等信息，如图5.4所示。
图3.4购物车预览界面图
3.1.3 前台用户订单模块的实现
用户购买商品并成功支付后，系统会自动生成订单。用户在用户中心选择“实物订单”选项可以查看当前登录账户的所有订单，选择某一个订单点击“订单详情”按钮系统会跳转到选中订单的详情界面，或者用户输入订单号进行查询，之后用户可以查看所选订单的详细信息，包括购买的商品名称、订单状态、收货地址、订单编号等信息。实物订单界面如图3.6所示，订单详情界面如图5.7所示。
图3.5 用户订单界面图
3.1.3 前台用户订单模块的实现
用户购买商品并成功支付后，系统会自动生成订单。用户在用户中心选择“实物订单”选项可以查看当前登录账户的所有订单，选择某一个订单点击“订单详情”按钮系统会跳转到选中订单的详情界面，或者用户输入订单号进行查询，之后用户可以查看所选订单的详细信息，包括购买的商品名称、订单状态、收货地址、订单编号等信息。实物订单界面如图3.6所示，订单详情界面如图3.7所示。
图3.5 用户订单界面图
3.2 后台功能模块实现
3.2.1 用户管理模块的实现
系统管理员登录系统后台后，选择会员管理模块，可以查看学子商城网站注册用户的个人信息，以及修改用户的个人信息、禁止登录等操作。用户管理界面如图3.8所示。
图3.6 用户管理界面图
3.2.2 商品管理模块的实现
在商品管理模块管理员可以对商品进行管理，包括新增商品信息、编辑已有商品信息、删除商品、查询商品等。商品管理界面如图3.9所示。
图3.7 商品管理界面图
3.2.3 订单管理模块的实现
在订单管理模块管理员可以对实物订单进行管理，在订单管理模块中可以查看不同状态的订单，点击修改按钮，可以修改订单状态信息等，订单列表如图3.10所示界面。
图3.8 订单管理界面图
3.2.4 分类管理模块的实现
在商品分类管理模块中，管理员可以对商品的分类信息进行有效的管理，方便发布商品时指定分类，可以通过前端根据分类信息进行查看。。如图3.12所示。
图3.9 分类管理界面图
3.2.5 导航管理模块的实现
在栏目导航管理模块中，管理员可以对前端的导航信息进行有效的管理，方便用户在前端浏览，管理员在后台可以灵活的对栏目导航进行有效管理。如图3.12所示。
图3.10 栏目导航管理界面图
3.2.6 评价管理模块的实现
在评价管理模块中，管理员可以对前端用户对商品的评价信息进行有效的管理，方便管理一些恶意评价操作，并可以对评价进行相应的回复操作。如图3.11所示。
图3.10 评价管理界面图
3.2.7 帮助栏目管理模块的实现
在帮助栏目管理模块中，下分帮助中心、常见问题、服务支持几个栏目模块，管理员可以在后台对其进行分类管理，并可对各模块添加相应的帮助内容信息，前端用户在前台页面可以根据自己的需要分类进行信息的查看操作。如图3.11所示。
图3.11 帮助栏目管理界面图
四，核心代码展示
<?php
return [
/*
|--------------------------------------------------------------------------
| Application Debug Mode
|--------------------------------------------------------------------------
|
| When your application is in debug mode, detailed error messages with
| stack traces will be shown on every error that occurs within your
| application. If disabled, a simple generic error page is shown.
|
*/
'debug' => env('APP_DEBUG', false),
/*
|--------------------------------------------------------------------------
| Application URL
|--------------------------------------------------------------------------
|
| This URL is used by the console to properly generate URLs when using
| the Artisan command line tool. You should set this to the root of
| your application so that it is used when running Artisan tasks.
|
*/
'url' => 'http://localhost',
/*
|--------------------------------------------------------------------------
| Application Timezone
|--------------------------------------------------------------------------
|
| Here you may specify the default timezone for your application, which
| will be used by the PHP date and date-time functions. We have gone
| ahead and set this to a sensible default for you out of the box.
|
*/
'timezone' => 'UTC',
/*
|--------------------------------------------------------------------------
| Application Locale Configuration
|--------------------------------------------------------------------------
|
| The application locale determines the default locale that will be used
| by the translation service provider. You are free to set this value
| to any of the locales which will be supported by the application.
|
*/
'locale' => 'en',
/*
|--------------------------------------------------------------------------
| Application Fallback Locale
|--------------------------------------------------------------------------
|
| The fallback locale determines the locale to use when the current one
| is not available. You may change the value to correspond to any of
| the language folders that are provided through your application.
|
*/
'fallback_locale' => 'en',
/*
|--------------------------------------------------------------------------
| Encryption Key
|--------------------------------------------------------------------------
|
| This key is used by the Illuminate encrypter service and should be set
| to a random, 32 character string, otherwise these encrypted strings
| will not be safe. Please do this before deploying an application!
|
*/
'key' => env('APP_KEY', 'SomeRandomString'),
'cipher' => 'AES-256-CBC',
/*
|--------------------------------------------------------------------------
| Logging Configuration
|--------------------------------------------------------------------------
|
| Here you may configure the log settings for your application. Out of
| the box, Laravel uses the Monolog PHP logging library. This gives
| you a variety of powerful log handlers / formatters to utilize.
|
| Available Settings: "single", "daily", "syslog", "errorlog"
|
*/
'log' => env('APP_LOG', 'single'),
/*
|--------------------------------------------------------------------------
| Autoloaded Service Providers
|--------------------------------------------------------------------------
|
| The service providers listed here will be automatically loaded on the
| request to your application. Feel free to add your own services to
| this array to grant expanded functionality to your applications.
|
*/
'providers' => [
/*
* Laravel Framework Service Providers...
*/
Illuminate\Foundation\Providers\ArtisanServiceProvider::class,
Illuminate\Auth\AuthServiceProvider::class,
Illuminate\Broadcasting\BroadcastServiceProvider::class,
Illuminate\Bus\BusServiceProvider::class,
Illuminate\Cache\CacheServiceProvider::class,
Illuminate\Foundation\Providers\ConsoleSupportServiceProvider::class,
Illuminate\Routing\ControllerServiceProvider::class,
Illuminate\Cookie\CookieServiceProvider::class,
Illuminate\Database\DatabaseServiceProvider::class,
Illuminate\Encryption\EncryptionServiceProvider::class,
Illuminate\Filesystem\FilesystemServiceProvider::class,
Illuminate\Foundation\Providers\FoundationServiceProvider::class,
Illuminate\Hashing\HashServiceProvider::class,
Illuminate\Mail\MailServiceProvider::class,
Illuminate\Pagination\PaginationServiceProvider::class,
Illuminate\Pipeline\PipelineServiceProvider::class,
Illuminate\Queue\QueueServiceProvider::class,
Illuminate\Redis\RedisServiceProvider::class,
Illuminate\Auth\Passwords\PasswordResetServiceProvider::class,
Illuminate\Session\SessionServiceProvider::class,
Illuminate\Translation\TranslationServiceProvider::class,
Illuminate\Validation\ValidationServiceProvider::class,
Illuminate\View\ViewServiceProvider::class,
/*
* Application Service Providers...
*/
App\Providers\AppServiceProvider::class,
App\Providers\AuthServiceProvider::class,
App\Providers\EventServiceProvider::class,
App\Providers\RouteServiceProvider::class,
],
/*
|--------------------------------------------------------------------------
| Class Aliases
|--------------------------------------------------------------------------
|
| This array of class aliases will be registered when this application
| is started. However, feel free to register as many as you wish as
| the aliases are "lazy" loaded so they don't hinder performance.
|
*/
'aliases' => [
'App' => Illuminate\Support\Facades\App::class,
'Artisan' => Illuminate\Support\Facades\Artisan::class,
'Auth' => Illuminate\Support\Facades\Auth::class,
'Blade' => Illuminate\Support\Facades\Blade::class,
'Bus' => Illuminate\Support\Facades\Bus::class,
'Cache' => Illuminate\Support\Facades\Cache::class,
'Config' => Illuminate\Support\Facades\Config::class,
'Cookie' => Illuminate\Support\Facades\Cookie::class,
'Crypt' => Illuminate\Support\Facades\Crypt::class,
'DB' => Illuminate\Support\Facades\DB::class,
'Eloquent' => Illuminate\Database\Eloquent\Model::class,
'Event' => Illuminate\Support\Facades\Event::class,
'File' => Illuminate\Support\Facades\File::class,
'Gate' => Illuminate\Support\Facades\Gate::class,
'Hash' => Illuminate\Support\Facades\Hash::class,
'Input' => Illuminate\Support\Facades\Input::class,
'Lang' => Illuminate\Support\Facades\Lang::class,
'Log' => Illuminate\Support\Facades\Log::class,
'Mail' => Illuminate\Support\Facades\Mail::class,
'Password' => Illuminate\Support\Facades\Password::class,
'Queue' => Illuminate\Support\Facades\Queue::class,
'Redirect' => Illuminate\Support\Facades\Redirect::class,
'Redis' => Illuminate\Support\Facades\Redis::class,
'Request' => Illuminate\Support\Facades\Request::class,
'Response' => Illuminate\Support\Facades\Response::class,
'Route' => Illuminate\Support\Facades\Route::class,
'Schema' => Illuminate\Support\Facades\Schema::class,
'Session' => Illuminate\Support\Facades\Session::class,
'Storage' => Illuminate\Support\Facades\Storage::class,
'URL' => Illuminate\Support\Facades\URL::class,
'Validator' => Illuminate\Support\Facades\Validator::class,
'View' => Illuminate\Support\Facades\View::class,
],
'upload_image_dir' => './image/upload/',
'APP_NAME' => '小米商城',
];
<?php
return [
/*
|--------------------------------------------------------------------------
| PDO Fetch Style
|--------------------------------------------------------------------------
|
| By default, database results will be returned as instances of the PHP
| stdClass object; however, you may desire to retrieve records in an
| array format for simplicity. Here you can tweak the fetch style.
|
*/
'fetch' => PDO::FETCH_CLASS,
/*
|--------------------------------------------------------------------------
| Default Database Connection Name
|--------------------------------------------------------------------------
|
| Here you may specify which of the database connections below you wish
| to use as your default connection for all database work. Of course
| you may use many connections at once using the Database library.
|
*/
'default' => env('DB_CONNECTION', 'mysql'),
/*
|--------------------------------------------------------------------------
| Database Connections
|--------------------------------------------------------------------------
|
| Here are each of the database connections setup for your application.
| Of course, examples of configuring each database platform that is
| supported by Laravel is shown below to make development simple.
|
|
| All database work in Laravel is done through the PHP PDO facilities
| so make sure you have the driver for your particular database of
| choice installed on your machine before you begin development.
|
*/
'connections' => [
'sqlite' => [
'driver' => 'sqlite',
'database' => database_path('database.sqlite'),
'prefix' => '',
],
'mysql' => [
'driver' => 'mysql',
'host' => env('DB_HOST', 'localhost'),
'database' => env('DB_DATABASE', 'forge'),
'username' => env('DB_USERNAME', 'forge'),
'password' => env('DB_PASSWORD', ''),
'charset' => 'utf8',
'collation' => 'utf8_unicode_ci',
'prefix' => '',
'strict' => false,
],
'pgsql' => [
'driver' => 'pgsql',
'host' => env('DB_HOST', 'localhost'),
'database' => env('DB_DATABASE', 'forge'),
'username' => env('DB_USERNAME', 'forge'),
'password' => env('DB_PASSWORD', ''),
'charset' => 'utf8',
'prefix' => '',
'schema' => 'public',
],
'sqlsrv' => [
'driver' => 'sqlsrv',
'host' => env('DB_HOST', 'localhost'),
'database' => env('DB_DATABASE', 'forge'),
'username' => env('DB_USERNAME', 'forge'),
'password' => env('DB_PASSWORD', ''),
'charset' => 'utf8',
'prefix' => '',
],
],
/*
|--------------------------------------------------------------------------
| Migration Repository Table
|--------------------------------------------------------------------------
|
| This table keeps track of all the migrations that have already run for
| your application. Using this information, we can determine which of
| the migrations on disk haven't actually been run in the database.
|
*/
'migrations' => 'migrations',
/*
|--------------------------------------------------------------------------
| Redis Databases
|--------------------------------------------------------------------------
|
| Redis is an open source, fast, and advanced key-value store that also
| provides a richer set of commands than a typical key-value systems
| such as APC or Memcached. Laravel makes it easy to dig right in.
|
*/
'redis' => [
'cluster' => false,
'default' => [
'host' => env('REDIS_HOST', 'localhost'),
'password' => env('REDIS_PASSWORD', null),
'port' => env('REDIS_PORT', 6379),
'database' => 0,
],
],
];
五，项目总结
本文不但对学子商城网站在建设中的可行性、需要及其总体设计等诸多方面做出了分析，还对所用得到的技术做了深刻地探究与介绍。本文主要研究的内容主要包括以下六个方面：
1.研究并详细介绍了电子商城的背景、国内外现状和发展趋势。
2.对商城的前后台两个子系统的需求进行了详细地分析。
3.合理地分析与设计了商城系统需要用到的数据库表结构。
4.对商城系统的业务逻辑进行了详细阐述，并给出了实现代码。
5.研究如何将Laravel框架应用到商城系统，并在此框架上实现了。
6.编写与执行针对本系统的测试用例。
本文所实现的学子商城系统，本系统的创新点主要是以下两个方面：
1.采用Laravel框架。本系统采用的是当下最流行、应用最广的Laravel 框架搭建的 Web 项目。此框架集成度高，开发速度快。
2.完整地介绍了一个电子商城的开发流程。本文从Web项目开发必备环境及软件介绍，到相关运行环境和技术的要求，详细地介绍了前台、后台和测试的全部工作流程，再到前后台代码的编写，再到测试用例的编写和使用。实现了从用户注册、登录到浏览商品再到自主添加购物车、订单支付等一系列B2C商城系统所应具有的全部的功能，最后加上对用户与网站的不同需求综合分析、数据库架构设计，完整地实现了一个Web 项目从无到有的开发过程。