企业网站建设

建站知识

今日已发布信息: 323076
累计注册用户: 102815576

Web前端学习①Web基础知识

前端工程师 服务器访问 打开文件

概述: 有时候会出现莫名其妙的问题。一般直接安装在C盘下C:Apache 2.2 安装好后,要准备就绪。(3)启动Httpd服务器:两种途径:①服务控制程序(可以看见的)②操作系统的服务控制台【鼠标操作(计算机--右键--管理--服务)或快捷键windows+r--services.msc】③直接CMD命令启动:net start Apache2.2(直接安装在C盘是有原因的,简化命令行)

<1>Web前端Web基础知识

一、前端工程师的角色

一个网站的建设需要以下角色:

①策划人员:方案

②美工/UI设计师:设计图 (.psd  .rp)

③前端工程师:静态网页

④后端工程师:获取数据 ( Java   PHP  .NET)

二、Web的基础知识

1、Web(万维网)与Internet(因特网)

①Internet简介:定义、主要服务、基本实现技术

②Web与Internet关系

Web是Internet提供的服务。

③Web简介:万维网

2、Web的工作原理

①Web的工作原理

②Web的组成部分

  1)Web服务器:监听客户端连接请求、接收请求,返回响应内容。

产品:TOMCAT;IIS;APACHE

Apache Httpd市场占有率最高(>60%) ,开源免费 。

一般称的Apache服务器默认指Apache Httpd服务器。

 

  2)Web客户端:(目前)浏览器和移动设备的APP(数据传输,HTML5是趋势)

五个常用浏览器:IEtester(可以运行各种IE浏览器),Google Chrome(近Safari),(Firefox)火狐,(Opera)欧朋,Safari 。

国产的浏览器没有自己的内核。

  3)HTTP协议:定义Web服务器和客户端的通讯细节

3、Web的相关技术

①常见的服务器端技术(运行在服务器上):

JSP (Java)/PHP/ASPX

②常见的客户端技术(运行在浏览器):

HTML/ CSS /JavaScript/SWF 前端学的主要是客户端技术。

☆补充一:怎么安装和使用Apache服务器。

TIPS:命令行程序窗口内按键盘的“上键”可以再调出来一遍命令。

到一定层次很多软件都是英文的。

(1)下载:http://httpd.apache.org

(2)安装:

①必须填写Network Domain(域名);Server Name(服务器名字)和 管理员邮箱地址  

②端口号默认80 ---服务器服务进程的地址。Http服务器端口(port)号为80.

 

  高州快速建站  高速公路护栏板   今日推荐免费建站   分类信息   兴宁网站建设公司

 

③一般选典型安装

④服务器安装路径:不要有中文和空格,有时候会出现莫名其妙的问题。一般直接安装在C盘下C:Apache 2.2 

安装好后,要准备就绪。

(3)启动Httpd服务器:

两种途径:

①服务控制程序(可以看见的)

②操作系统的服务控制台【鼠标操作(计算机--右键--管理--服务)或快捷键windows+r--services.msc】

③直接CMD命令启动:net start Apache2.2(直接安装在C盘是有原因的,简化命令行)

【停止:net stop Apache2.2 重启:net restart Apache 2.2】

如何确定服务器真正开启?

因为服务器是后台程序,运行在操作系统底层的,用户看不见。

服务器开启且占用了其端口号,才真正开启。

可以查看系统打开的端口号,确认Httpd是否已经启动。

netstat -anb 确认80端口是Httpd服务器进程占用,迅雷等端口可能会占用。如被占用则关掉其他程序(进程)。才能真正启用服务器。

(4)访问服务器

<1>访问服务器的两种途径:

①通过Windows IP配置的 IP可以访问任何人(包括自己)的服务器(联网的情况下);

②127.0.0.1当前计算机(本机)的IP地址,仅限访问自己的本地服务器。

两者区别:

127.0.0.1仅在当前计算机使用,一般是一直可以用的。任何时候联网或断网都可以访问自己的服务器;但是常规 Windows IP配置的 IP则仅限在联网的情况下访问自己或别人的服务器。

<2>访问服务器下的网页

①访问方式:路径直接127.0.0.1或IP则显示默认网页index.html

(只有访问index.html文档不用写文件名,其他在IP地址后必须写文件名。)

②服务器下的网页不能随便放在任何路径下;网页必须放在Apache Httpd服务器能够识别的路径下。

网页文档存储在htdocs文件夹里才能访问到(C→Apache2.2 →htdocs)

☆补充二:浏览器控制台。

前端工程师必须要熟练使用浏览器控制台!

试一下标签:<marquee>hello world!</marquee>---跑马灯的效果

****右键单击----审查元素----浏览器控制台---纠错调错用的。

 

 

 

 

 

 

(1)浏览器控制台---主界面菜单和Elements (元素)界面(见图1): 

Elements 元素【文档内容、样式css、盒子模型解决纠错】

Network 网络

Sources  源代码

Console 控制台

Timeline 时间线

Profiles 归档

Resources 资源

Security 安全

Audits 审计

(2)浏览器控制台学习---Network(网络)界面(见图2) 

Method 方法  GET 方法(此图没有)

Status 状态  304响应

Type 文档类型

Initiator 发起者

Size 大小;尺寸

Time 时间(延时)

Timeline 时间线【请求发送、等待、内容下载】

Timeline是做web页面的前端优化必须懂的!我们的网页发送了多少个请求和哪个请求最耗时使我们的症结所在。我们对Web页面进行了前端优化的目的就是,缩短请求时间,使Web网页打开时间变短。

(3)浏览器操作台-network-点击网页名(见图3)

Headers  标题

Preview 预览

Response 响应

Timeing 计时 

☆补充三:直接本地打开文件html文件和通过IP地址访问服务器打开html文件的区别。

(1)首先路径显示有区别

(2)是否符合Web模型的区别。

通过IP地址访问服务器查看页面:通过HTTP协议,网络浏览器发送一个请求,得到服务器的响应页面是这样的。包含了web的三要素。

直接本地双击打开文件html文档查看页面:没有经过服务器,没有遵循http协议,不符合web模型。虽然简单页面两者效果一样,但是复杂页面就不一样了。这样的访问没有经过页服务器,服务器端会对文档加以处理,少了处理访问的效果就有可能与用户不一样,所以访问时尽量的架服务器,把网页放在htdocs。

 

 

 

 

 

 

 

 

 


 

http://gaozhou.kvov.com.cn/jzxx41402.html