2.3.3 静态页面测试 2.3.3.1页面加载思路
打开课程资料中的“静态页面目录”中的课程详情模板页面，研究页面加载的思路。
模板页面路径如下：
[AppleScript] 纯文本查看 复制代码
?
|
1
|
静态页面目录\static\course\detail\course_main_template.html
|
1、主页面
我们需要在主页面中通过SSI加载：页头、页尾、教育机构、教师信息 2、异步加载课程统计与教育机构统计信息
课程统计信息（json）、教育机构统计信息（json） 3、马上学习按钮事件
用户点击“马上学习”会根据课程收费情况、课程购买情况执行下一步操作。
2.3.3.2 静态资源虚拟主机
1、配置静态资源虚拟主机
静态资源虚拟主机负责处理课程详情、公司信息、老师信息、统计信息等页面的请求：
将课程资料中的“静态页面目录”中的目录拷贝到F:/develop/xuecheng/static下 在nginx中配置静态虚拟主机如下：
[AppleScript] 纯文本查看 复制代码
?
|
1
2
3
4
5
6
7
|
静态页面目录\static\course\detail\course_main_template.html
#学成网静态资源 server { listen
91;
server_name localhost;
#公司信息
location /static/company/ {
alias F:/develop/xuecheng/static/company/;
|
[AppleScript] 纯文本查看 复制代码
?
|
01
02
03
04
05
06
07
08
09
10
11
12
|
#老师信息
location /static/teacher/ {
alias F:/develop/xuecheng/static/teacher/;
}
#统计信息
location /static/stat/ {
alias F:/develop/xuecheng/static/stat/;
}
location /course/detail/ {
alias F:/develop/xuecheng/static/course/detail/;
}
}
|
2、通过www.xuecheng.com虚拟主机转发到静态资源
由于课程页面需要通过SSI加载页头和页尾所以需要通过www.xuecheng.com虚拟主机转发到静态资源 在www.xuecheng.com虚拟主机加入如下配置：
[AppleScript] 纯文本查看 复制代码
?
|
01
02
03
04
05
06
07
08
09
10
11
12
|
location /static/company/ {
proxy_pass http://static_server_pool;
}
location /static/teacher/ {
proxy_pass http://static_server_pool;
}
location /static/stat/ {
proxy_pass http://static_server_pool;
}
location /course/detail/ {
proxy_pass http://static_server_pool;
}
|
配置upstream实现请求转发到资源服务虚拟主机：
[AppleScript] 纯文本查看 复制代码
?
|
1
2
|
#静态资源服务 upstream static_server_pool{ server 127.0.0.1:91 weight=10;
}
|
2.3.3.3 门户静态资源路径
门户中的一些图片、样式等静态资源统一通过/static路径对外提供服务，在www.xuecheng.com虚拟主机中配置如 下：
[AppleScript] 纯文本查看 复制代码
?
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
|
#静态资源，包括系统所需要的图片，js、css等静态资源
location /static/img/ {
alias F:/develop/xc_portal_static/img/;
}
location /static/css/ {
alias F:/develop/xc_portal_static/css/;
}
location /static/js/ {
alias F:/develop/xc_portal_static/js/;
}
location /static/plugins/ {
alias F:/develop/xc_portal_static/plugins/;
add_header Access‐Control‐Allow‐Origin [url]http://ucenter.xuecheng.com[/url];
add_header Access‐Control‐Allow‐Credentials true;
add_header Access‐Control‐Allow‐Methods GET;
}
|
cors跨域参数：
Access-Control-Allow-Origin：允许跨域访问的外域地址
如果允许任何站点跨域访问则设置为*，通常这是不建议的。
Access-Control-Allow-Credentials： 允许客户端携带证书访问
Access-Control-Allow-Methods：允许客户端跨域访问的方法
|
|
标签：学成,Java,xuecheng,虚拟主机,day9,静态,static,location,页面
来源： https://blog.csdn.net/czbkzmj/article/details/89472334