Java的新项目学成在线笔记-day9（九）

2023-07-21 16:37:22

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的新项目学成在线笔记-day9（六）


下一篇：Java的新项目学成在线笔记-day9（一）