Table 1. Structure

tb_content_category ad classification

Field	Types of	length	meaning
id	Bigint		Primary key
name	Varchar	255	Advertising Category Name

tb_content your table

Field	Types of	length	meaning
id	Bigint		Primary key
category_id	Bigint		Classified advertising ID
title	varchar	200	Ad Title
url	varchar	500	Advertising Links
pic	varchar	300	The map's address
status	varchar	1	status
sort_order	int		Sequence

2. Advertising List

2.1 backend

Add code pinyougou-manager-web in reference to the previous way of doing it

2.2 front-end

Reference pinyougou-shop-web of code completion

3. Advertising Management

3.1 Advertising image upload

The pinyougou-shop-web of the copy of the resource to pinyougou-manager-web
(. 1) UploadController.java
(2) uploadService.js
(. 3) the application.properties
(. 4) fdfs_client.conf
springmvc.xml pinyougou-manager-web in the add configuration

	<!-- 配置多媒体解析器 -->
	<bean id="multipartResolver"
		class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
		<property name="defaultEncoding" value="UTF-8"></property>
		<!-- 设定文件上传的最大值 5MB，5*1024*1024 -->
		<property name="maxUploadSize" value="5242880"></property>
	</bean>

UploadService introduced in contentController.js

UploadService.js introduced in content.html

Write code in contentController.js

//上传广告图
$scope.uploadFile=function(){
	uploadService.uploadFile().success(
		function(response){
			if(response.success){
				$scope.entity.pic=response.message;					
			}else{
				alert("上传失败！");
			}
		}
	).error(
		function(){
			alert("上传出错！");
		}
	);		
}

Modify content.html to upload function

<tr>            
<td>图片</td>
    <td>
     <input type="file" id="file">
     <button ng-click="uploadFile()">上传</button>	                             
     <img alt="" src="{{entity.pic}}" height="100px" width="200px">
     </td>
 </tr>

Display picture list

<img alt="" src="{{entity.pic}}" height="50px" width="100px">

3.2 Advertising Category selection

The contentCategoryService contentController introduced
in content.html incorporated contentCategoryService.js
add code in contentController.js

//加载广告分类列表
$scope.findContentCategoryList=function(){
	contentCategoryService.findAll().success(
		function(response){
			$scope.contentCategoryList=response;				
		}
	);
}

This method is called initialization content.html

<body class="hold-transition skin-red sidebar-mini" ng-app="pinyougou" ng-controller="contentController" ng-init="findContentCategoryList()">

The ad classification changed to drop-down list

<select  class="form-control" ng-model="entity.categoryId" ng-options="item.id as item.name  for item in contentCategoryList"></select>

4. Home - impressions

Create a war module pinyougou-portal-web, this project is a portal front desk, reference to other war modules written in the configuration file. No need to add SpringSecurity framework

pom.xml configured to start tomcat 9103 port

And the introduction of plug-in interface prototype

4.1 backend

In pinyougou-content-service engineering ContentServiceImpl increase class method

@Override
	public List<TbContent> findByCategoryId(Long categoryId) {
		//根据广告分类ID查询广告列表		
		TbContentExample contentExample=new TbContentExample();
		Criteria criteria2 = contentExample.createCriteria();
		criteria2.andCategoryIdEqualTo(categoryId);
		criteria2.andStatusEqualTo("1");//开启状态		
		contentExample.setOrderByClause("sort_order");//排序		
		return  contentMapper.selectByExample(contentExample);
	}

Create a controller class ContentController in pinyougou-portal-web

@RestController
@RequestMapping("/content")
public class ContentController {

	@Reference
	private ContentService contentService;
	
	/**
	 * 根据广告分类ID查询广告列表
	 * @param categoryId
	 * @return
	 */
	@RequestMapping("/findByCategoryId")
	public List<TbContent> findByCategoryId(Long categoryId) {
		return contentService.findByCategoryId(categoryId);
	}		
}

4.2 front-end

Creating contentService.js in pinyougou-portal-web project

app.service("contentService",function($http){
	//根据分类ID查询广告列表
	this.findByCategoryId=function(categoryId){
		return $http.get("content/findByCategoryId.do?categoryId="+categoryId);
	}	
});

Creating contentController.js in pinyougou-portal-web

//广告控制层（运营商后台）
app.controller("contentController",function($scope,contentService){	
	$scope.contentList=[];//广告集合	
	$scope.findByCategoryId=function(categoryId){
		contentService.findByCategoryId(categoryId).success(
			function(response){
				$scope.contentList[categoryId]=response;
			}
		);		
	}		
});

Interface header file into the instruction Add

Modify Home Carousel Figure

<!--banner轮播-->
<div id="myCarousel" data-ride="carousel" data-interval="4000" class="sui-carousel slide">
	 <ol class="carousel-indicators">
		 <li data-target="#myCarousel" data-slide-to="{{$index}}" class="{{$index==0?'active':''}}" ng-repeat="item in contentList[1]" ></li>
	 </ol>
	 <div class="carousel-inner">
 <div class="{{$index==0?'active':''}} item" ng-repeat="item in contentList[1]">
			 <a href="{{item.url}}">
					<img src="{{item.pic}}"  />
			 </a>
	  </div>
</div>
<a href="#myCarousel" data-slide="prev" class="carousel-control left">
‹</a><a href="#myCarousel" data-slide="next" class="carousel-control right">›</a>
</div>

test:

The ad cache processing

Now we are reading every page of advertising from the database, so that when site traffic reached peak hours, great pressure on the database, and affect the efficiency. We need this part of the advertising data is cached

5.1 Read Cache

Because the cache for our entire system is common functions. Advertising needed, other data may also be used, so we will be configured in a public assembly layer (pinyougou-common) the more reasonable

1) introducing dependent

 <!-- 缓存 -->
	<dependency> 
		  <groupId>redis.clients</groupId> 
		  <artifactId>jedis</artifactId> 
	</dependency> 
	<dependency> 
		  <groupId>org.springframework.data</groupId> 
		  <artifactId>spring-data-redis</artifactId> 
	</dependency>

2) Profile

3) pinyougou-content-service dependent pinyougou-common

3) Modify pinyougou-content-service of ContentServiceImpl

/* 根据分类ID查询广告
 */
@Override
public List<TbContent> findByCategoryId(Long categoryId) {
	
	List<TbContent> list = null;
	
	try {
		list = (List<TbContent>) redisTemplate.boundHashOps("content").get(categoryId);
	} catch (Exception e) {
		// TODO Auto-generated catch block
		e.printStackTrace();
	}
	
	if(null == list){
		TbContentExample example = new TbContentExample();
		Criteria createCriteria = example.createCriteria();
		createCriteria.andCategoryIdEqualTo(categoryId);
		// 设置排序字段
		example.setOrderByClause("sort_order");
		list = contentMapper.selectByExample(example );
		
		try {
			// 将查询的数据存入缓存中
			redisTemplate.boundHashOps("content").put(categoryId, list);
		} catch (Exception e) {
			e.printStackTrace();
		}
		
		System.out.println("数据来自数据库");
	} else {
		System.out.println("数据来自缓存。。。");
	}
	
	return list;
}

5.2 Update Cache

When the advertisement data is changed, the cached data needs to be cleared so that the query again to obtain the latest data

5.3.1 New ads Clear Cache

Modify the add method pinyougou-content-service engineering ContentServiceImpl.java of

	/**
	 * 增加
	 */
	@Override
	public void add(TbContent content) {
		contentMapper.insert(content);	
		try {
			redisTemplate.boundHashOps("content").delete(content.getCategoryId());
		} catch (Exception e) {
			System.out.println("redis出错了！");
		}
	}

5.3.2 modify the ad to clear the cache

Taking into account the user may modify classified ads, so the need to cache the original classification and the classification of new caches are cleared.

	
	/**
	 * 修改
	 */
	@Override
	public void update(TbContent content){
		try {
			// 删除之前的分类缓存
			TbContent selectByPrimaryKey = contentMapper.selectByPrimaryKey(content.getId());
			redisTemplate.boundHashOps("content").delete(selectByPrimaryKey.getCategoryId());
		} catch (Exception e) {
			System.out.println("redis出错了！");
		}
		
		contentMapper.updateByPrimaryKey(content);
		
		try {
			redisTemplate.boundHashOps("content").delete(content.getCategoryId());
		} catch (Exception e) {
			System.out.println("redis出错了！");
		}
	}

5.3.3 remove ads Clear Cache

	/**
	 * 批量删除
	 */
	@Override
	public void delete(Long[] ids) {
		for(Long id:ids){
			try {
				TbContent content = contentMapper.selectByPrimaryKey(id);
				redisTemplate.boundHashOps("content").delete(content.getCategoryId());
			} catch (Exception e) {
				System.out.println("redis出错了！");
			}
			// 删除广告
			contentMapper.deleteByPrimaryKey(id);
		}		
	}

武汉小喽啰

发布了205 篇原创文章 · 获赞 9 · 访问量 7924

私信关注

Superior products purchased 07-- advertising management