A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

【郑州校区】学成在线 第9天 讲义-课程预览 Eureka Feign 八

5.3 CMS添加页面接口
cms服务对外提供添加页面接口,实现:如果不存在页面则添加,否则就更新页面信息。
此接口由课程管理服务在课程预览时调用。
5.3.1 Api接口
[AppleScript] 纯文本查看 复制代码
 @ApiOperation(
"
保存页面
"
)
public CmsPageResult save(CmsPage cmsPage); 

5.3.2 Service
[AppleScript] 纯文本查看 复制代码
 //添加页面,如果已存在则更新页面
public CmsPageResult save(CmsPage cmsPage){
//校验页面是否存在,根据页面名称、站点Id、页面webpath查询
CmsPage cmsPage1 =
cmsPageRepository
.findByPageNameAndSiteIdAndPageWebPath(cmsPage.
getPageName(),
cmsPage.
getSiteId(), cmsPage.
getPageWebPath());
if(cmsPage1 !
=null){
//更新
return this.update(cmsPage1.
getPageId(),cmsPage);
}else{
//添加
return this.add(cmsPage);
}
} 


5.3.3 Controller
[AppleScript] 纯文本查看 复制代码
 @Override
@PostMapping(
"
/save
"
)
public CmsPageResult save(@RequestBody CmsPage cmsPage) {
return pageService.save(cmsPage);
}


5.4 课程预览服务端
5.4.1 Api定义
Api是课程管理前端请求服务端进行课程预览的Api
请求:课程Id
响应:课程预览Url
1、定义响应类型

[AppleScript] 纯文本查看 复制代码
@Data
@ToString
@NoArgsConstructor
public class CoursePublishResult extends ResponseResult {
String previewUrl;
public CoursePublishResult(ResultCode resultCode,String previewUrl) {
super(resultCode);
this.
previewUrl =
previewUrl;
}
}

2、接口定义如下
[AppleScript] 纯文本查看 复制代码
 @ApiOperation(
"
预览课程
"
)
public CoursePublishResult preview(String id); 


5.4.2 创建 Feign Client
在课程管理工程创建CMS服务的Feign Client,通过此Client远程请求cms添加页面。

[AppleScript] 纯文本查看 复制代码
@FeignClient(value
= XcServiceList.XC_SERVICE_MANAGE_CMS)
public interface CmsPageClient{
//保存页面
@PostMapping(
"
/cms/page/save
"
)
public CmsPageResult save(@RequestBody CmsPage cmsPage);
} 

5.4.3 Service
1、配置添加页面参数信息
application.yml中配置:

[AppleScript] 纯文本查看 复制代码
course
‐
publish:
siteId: 5b30cba5f58b4411fc6cb1e5
templateId: 5b345a6b94db44269cb2bfec
previewUrl: [url]http://www.xuecheng[/url]
.com/cms/preview/
pageWebPath: /course/detail/
pagePhysicalPath: /course/detail/
dataUrlPre: http://localhost:31200/course/courseview/ 

2、代码如下:
[AppleScript] 纯文本查看 复制代码
 @Value(
"
${course
‐
publish.dataUrlPre}
"
)
private String publish_dataUrlPre;
@Value(
"
${course
‐
publish.
pagePhysicalPath}
"
)
private String publish_page_physicalpath;
@Value(
"
${course
‐
publish.
pageWebPath}
"
)
private String publish_page_webpath;
@Value(
"
${course
‐
publish.siteId}
"
)
private String publish_siteId;
@Value(
"
${course
‐
publish.templateId}
"
)
private String publish_templateId;
@Value(
"
${course
‐
publish.
previewUrl}
"
)
private String previewUrl;
//根据id查询课程基本信息
public CourseBase findCourseBaseById(String courseId){
Optional<CourseBase> baseOptional =
courseBaseRepository
.findById(courseId);
if(baseOptional.isPresent()){
CourseBase courseBase
=
baseOptional.
get();
return courseBase;
}
ExceptionCast.cast(CourseCode.COURSE_GET_NOTEXISTS);
return null;
}
//课程预览
public CoursePublishResult preview(String courseId){
CourseBase one
=
this.findCourseBaseById(courseId);
//发布课程预览页面
CmsPage cmsPage
= new CmsPage();
//站点
cmsPage.setSiteId(publish_siteId);//课程预览站点
//模板
cmsPage.setTemplateId(publish_templateId);
//页面名称
cmsPage.setPageName(courseId+
"
.html
"
);
//页面别名
cmsPage.setPageAliase(one.
getName());
//页面访问路径
cmsPage.setPageWebPath(publish_page_webpath);
//页面存储路径
cmsPage.setPagePhysicalPath(publish_page_physicalpath);
//数据url
cmsPage.setDataUrl(publish_dataUrlPre+courseId);
//远程请求cms保存页面信息
CmsPageResult cmsPageResult
=
cmsPageClient.save(cmsPage);
if(!cmsPageResult.isSuccess()){
return new CoursePublishResult(CommonCode.FAIL,null);
}
//页面id
String pageId
=
cmsPageResult.
getCmsPage()
.
getPageId();
//页面url
String pageUrl =
previewUrl+pageId;
return new CoursePublishResult(CommonCode.SUCCESS,pageUrl);
} 


5.4.4 Controller
[AppleScript] 纯文本查看 复制代码
 @Override
@PostMapping(
"
/preview/{id}
"
)
public CoursePublishResult preview(@PathVariable(
"
id
"
) String id) {
return courseService.
preview(id);
}


5.5 前端开发

5.5.1 api方法
[AppleScript] 纯文本查看 复制代码
 /
*
预览课程
*
/
export const preview = id
=
> {
return http
.requestPost(apiUrl+
'
/course/preview/
'
+id);
}


5.5.2 页面
创建 course_pub.vue

[AppleScript] 纯文本查看 复制代码
<template>
<div>
<el
‐
card class
=
"
box
‐
card
"
>
<div slot
=
"
header
"
class
=
"
clearfix
"
>
<span>课程预览</span>
</div>
<div class
=
"
text item
"
>
<el
‐
button type
=
"
primary
"
@click.native
=
"
preview
"
>课程预览</el
‐
button>
<br/><br/>
<span v
‐
if=
"
previewurl && previewurl!
=
''"
><a :href=
"
previewurl
"
target
=
"
_blank
"
>点我查看课
程预览页面 </a> </span>
</div>
</el
‐
card>
</div>
</template> 

数据对象:
[AppleScript] 纯文本查看 复制代码
data() {
return {
dotype:
''
,
courseid:
''
,
course: {
"
id
"
:
""
,
"
name
"
:
""
,
"
status
"
:
""
},
previewurl:
''
} 


方法 :
[AppleScript] 纯文本查看 复制代码
//预览[/size][/font]
[font=微软雅黑][size=3]preview(){
courseApi.
preview(this.courseid)
.then((res)
=
> {
if(res.success){
this.
$message.error(
'
预览页面生成成功,请点击下方预览链接
'
);[/size][/font]
 if(res.url){
//预览url
this.
previewurl = res.url
}
}else{
this.
$message.error(res.message);
}
});
}


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马