nginx是什麼?
nginx是一個開源的,支持高性能,高併發的www服務和代理服務軟件。它是一個俄羅斯人lgor sysoev開發的,做者將源代碼開源出來供全球使用。
nginx比它大哥apache性能改進許多,nginx佔用的系統資源更少,支持更高的併發鏈接,有更高的訪問效率。
nginx不可是一個優秀的web服務軟件,還能夠做爲反向代理,負載均衡,以及緩存服務使用。
安裝更爲簡單,方便,靈活。
nginx的優勢: 支持高併發,能支持幾萬併發鏈接 資源消耗少,在3萬併發鏈接下開啓10個nginx線程消耗的內存不到200M 能夠作http反向代理和負載均衡 支持異步網絡i/o事件模型epoll
(1)解決nginx所需的依賴包(在opt目錄下) yum install gcc patch libffi-devel python-devel zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gdbm-devel db4-devel libpcap-devel xz-devel openssl openssl-devel -y (2)下載源碼包 wget -c https://nginx.org/download/nginx-1.12.0.tar.gz (3)解壓縮源碼 tar -zxvf nginx-1.12.0.tar.gz (4)配置,編譯安裝 ,開啓nginx狀態監測功能(先進入到nginx-1.12.0文件夾) ./configure --prefix=/opt/nginx1-12/ (5)make && make install
查看nginx的工做目錄css
conf nginx的配置文件目錄
html 網頁根目錄
logs 日誌
sbin 存放nginx可執行命令
進入nginx112目錄下的html文件夾,在文件夾中找到index.html文件
找到像替換的網頁的源代碼,替換該文件
隨意找的源代碼html
<style> @import url('https://fonts.googleapis.com/css?family=Press+Start+2P'); body { margin: 0; font-family: 'Press Start 2P', cursive; font-size: 2em; color: white; } button { outline: none; cursor: pointer; } #counter { position: absolute; top: 20px; right: 20px; } #end { position: absolute; min-width: 100%; min-height: 100%; display: flex; align-items: center; justify-content: center; visibility: hidden; } #end button { background-color: red; padding: 20px 50px 20px 50px; font-family: inherit; font-size: inherit; } #controlls { position: absolute; min-width: 100%; min-height: 100%; display: flex; align-items: flex-end; justify-content: center; } #controlls div { margin-bottom: 20px; font-size: 0; max-width: 180px; } #controlls button { width: 50px; font-family: inherit; font-size: 30px; border: 3px solid white; color: white; background-color: transparent; margin: 5px; } #controlls button:first-of-type { width: 170px; } </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/99/three.min.js"></script> <a style="color:red";href="https://www.cnblogs.com/pyyu/">博客園地址:https://www.cnblogs.com/pyyu/ 點我呀 老弟</a> <div id="counter">0</div> <div id="controlls"> <div> <button id="forward" style="color:black">↑向前</button> <button id="left" style="color:black">←向左</button> <button id="backward" style="color:black">↓向下</button> <button id="right" style="color:black">→向右</button> </div> </div> <div id="end"> <button id="retry">Retry</button> </div> <script> const counterDOM = document.getElementById('counter'); const endDOM = document.getElementById('end'); const scene = new THREE.Scene(); const distance = 500; const camera = new THREE.OrthographicCamera( window.innerWidth/-2, window.innerWidth/2, window.innerHeight / 2, window.innerHeight / -2, 0.1, 10000 ); camera.rotation.x = 50*Math.PI/180; camera.rotation.y = 20*Math.PI/180; camera.rotation.z = 10*Math.PI/180; const initialCameraPositionY = -Math.tan(camera.rotation.x)*distance; const initialCameraPositionX = Math.tan(camera.rotation.y)*Math.sqrt(distance**2 + initialCameraPositionY**2); camera.position.y = initialCameraPositionY; camera.position.x = initialCameraPositionX; camera.position.z = distance; const zoom = 2; const chickenSize = 15; const positionWidth = 42; const columns = 17; const boardWidth = positionWidth*columns; const stepTime = 200; // Miliseconds it takes for the chicken to take a step forward, backward, left or right let lanes; let currentLane; let currentColumn; let previousTimestamp; let startMoving; let moves; let stepStartTimestamp; const carFrontTexture = new Texture(40,80,[{x: 0, y: 10, w: 30, h: 60 }]); const carBackTexture = new Texture(40,80,[{x: 10, y: 10, w: 30, h: 60 }]); const carRightSideTexture = new Texture(110,40,[{x: 10, y: 0, w: 50, h: 30 }, {x: 70, y: 0, w: 30, h: 30 }]); const carLeftSideTexture = new Texture(110,40,[{x: 10, y: 10, w: 50, h: 30 }, {x: 70, y: 10, w: 30, h: 30 }]); const truckFrontTexture = new Texture(30,30,[{x: 15, y: 0, w: 10, h: 30 }]); const truckRightSideTexture = new Texture(25,30,[{x: 0, y: 15, w: 10, h: 10 }]); const truckLeftSideTexture = new Texture(25,30,[{x: 0, y: 5, w: 10, h: 10 }]); const generateLanes = () => [-9,-8,-7,-6,-5,-4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9].map((index) => { const lane = new Lane(index); lane.mesh.position.y = index*positionWidth*zoom; scene.add( lane.mesh ); return lane; }).filter((lane) => lane.index >= 0); const addLane = () => { const index = lanes.length; const lane = new Lane(index); lane.mesh.position.y = index*positionWidth*zoom; scene.add(lane.mesh); lanes.push(lane); } const chicken = new Chicken(); scene.add( chicken ); const laneTypes = ['car', 'truck', 'forest']; const laneSpeeds = [2, 2.5, 3]; const vechicleColors = [0xa52523, 0xbdb638, 0x78b14b]; const threeHeights = [20,45,60]; const initaliseValues = () => { lanes = generateLanes() currentLane = 0; currentColumn = Math.floor(columns/2); previousTimestamp = null; startMoving = false; moves = []; stepStartTimestamp; chicken.position.x = 0; chicken.position.y = 0; camera.position.y = initialCameraPositionY; camera.position.x = initialCameraPositionX; } initaliseValues(); const renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true }); renderer.shadowMap.enabled = true; renderer.shadowMap.type = THREE.PCFSoftShadowMap; renderer.setSize( window.innerWidth, window.innerHeight ); document.body.appendChild( renderer.domElement ); hemiLight = new THREE.HemisphereLight(0xffffff, 0xffffff, 0.6); scene.add(hemiLight) dirLight = new THREE.DirectionalLight(0xffffff, 0.6); dirLight.position.set(-100, -100, 200); dirLight.castShadow = true; scene.add(dirLight); dirLight.shadow.mapSize.width = 2048; dirLight.shadow.mapSize.height = 2048; var d = 500; dirLight.shadow.camera.left = - d; dirLight.shadow.camera.right = d; dirLight.shadow.camera.top = d; dirLight.shadow.camera.bottom = - d; // var helper = new THREE.CameraHelper( dirLight.shadow.camera ); // var helper = new THREE.CameraHelper( camera ); // scene.add(helper) backLight = new THREE.DirectionalLight(0x000000, .4); backLight.position.set(200, 200, 50); backLight.castShadow = true; scene.add(backLight) function Texture(width, height, rects) { const canvas = document.createElement( "canvas" ); canvas.width = width; canvas.height = height; const context = canvas.getContext( "2d" ); context.fillStyle = "#ffffff"; context.fillRect( 0, 0, width, height ); context.fillStyle = "rgba(0,0,0,0.6)"; rects.forEach(rect => { context.fillRect(rect.x, rect.y, rect.w, rect.h); }); return new THREE.CanvasTexture(canvas); } function Wheel() { const wheel = new THREE.Mesh( new THREE.BoxBufferGeometry( 12*zoom, 33*zoom, 12*zoom ), new THREE.MeshLambertMaterial( { color: 0x333333, flatShading: true } ) ); wheel.position.z = 6*zoom; return wheel; } function Car() { const car = new THREE.Group(); const color = vechicleColors[Math.floor(Math.random() * vechicleColors.length)]; const main = new THREE.Mesh( new THREE.BoxBufferGeometry( 60*zoom, 30*zoom, 15*zoom ), new THREE.MeshPhongMaterial( { color, flatShading: true } ) ); main.position.z = 12*zoom; main.castShadow = true; main.receiveShadow = true; car.add(main) const cabin = new THREE.Mesh( new THREE.BoxBufferGeometry( 33*zoom, 24*zoom, 12*zoom ), [ new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true, map: carBackTexture } ), new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true, map: carFrontTexture } ), new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true, map: carRightSideTexture } ), new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true, map: carLeftSideTexture } ), new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true } ), // top new THREE.MeshPhongMaterial( { color: 0xcccccc, flatShading: true } ) // bottom ] ); cabin.position.x = 6*zoom; cabin.position.z = 25.5*zoom; cabin.castShadow = true; cabin.receiveShadow = true; car.add( cabin ); const frontWheel = new Wheel(); frontWheel.position.x = -18*zoom; car.add( frontWheel ); const backWheel = new Wheel(); backWheel.position.x = 18*zoom; car.add( backWheel ); car.castShadow = true; car.receiveShadow = false; return car; } function Truck() { const truck = new THREE.Group(); const color = vechicleColors[Math.floor(Math.random() * vechicleColors.length)]; const base = new THREE.Mesh( new THREE.BoxBufferGeometry( 100*zoom, 25*zoom, 5*zoom ), new THREE.MeshLambertMaterial( { color: 0xb4c6fc, flatShading: true } ) ); base.position.z = 10*zoom; truck.add(base) const cargo = new THREE.Mesh( new THREE.BoxBufferGeometry( 75*zoom, 35*zoom, 40*zoom ), new THREE.MeshPhongMaterial( { color: 0xb4c6fc, flatShading: true } ) ); cargo.position.x = 15*zoom; cargo.position.z = 30*zoom; cargo.castShadow = true; cargo.receiveShadow = true; truck.add(cargo) const cabin = new THREE.Mesh( new THREE.BoxBufferGeometry( 25*zoom, 30*zoom, 30*zoom ), [ new THREE.MeshPhongMaterial( { color, flatShading: true } ), // back new THREE.MeshPhongMaterial( { color, flatShading: true, map: truckFrontTexture } ), new THREE.MeshPhongMaterial( { color, flatShading: true, map: truckRightSideTexture } ), new THREE.MeshPhongMaterial( { color, flatShading: true, map: truckLeftSideTexture } ), new THREE.MeshPhongMaterial( { color, flatShading: true } ), // top new THREE.MeshPhongMaterial( { color, flatShading: true } ) // bottom ] ); cabin.position.x = -40*zoom; cabin.position.z = 20*zoom; cabin.castShadow = true; cabin.receiveShadow = true; truck.add( cabin ); const frontWheel = new Wheel(); frontWheel.position.x = -38*zoom; truck.add( frontWheel ); const middleWheel = new Wheel(); middleWheel.position.x = -10*zoom; truck.add( middleWheel ); const backWheel = new Wheel(); backWheel.position.x = 30*zoom; truck.add( backWheel ); return truck; } function Three() { const three = new THREE.Group(); const trunk = new THREE.Mesh( new THREE.BoxBufferGeometry( 15*zoom, 15*zoom, 20*zoom ), new THREE.MeshPhongMaterial( { color: 0x4d2926, flatShading: true } ) ); trunk.position.z = 10*zoom; trunk.castShadow = true; trunk.receiveShadow = true; three.add(trunk); height = threeHeights[Math.floor(Math.random()*threeHeights.length)]; const crown = new THREE.Mesh( new THREE.BoxBufferGeometry( 30*zoom, 30*zoom, height*zoom ), new THREE.MeshLambertMaterial( { color: 0x7aa21d, flatShading: true } ) ); crown.position.z = (height/2+20)*zoom; crown.castShadow = true; crown.receiveShadow = false; three.add(crown); return three; } function Chicken() { const chicken = new THREE.Group(); const body = new THREE.Mesh( new THREE.BoxBufferGeometry( chickenSize*zoom, chickenSize*zoom, 20*zoom ), new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true } ) ); body.position.z = 10*zoom; body.castShadow = true; body.receiveShadow = true; chicken.add(body); const rowel = new THREE.Mesh( new THREE.BoxBufferGeometry( 2*zoom, 4*zoom, 2*zoom ), new THREE.MeshLambertMaterial( { color: 0xF0619A, flatShading: true } ) ); rowel.position.z = 21*zoom; rowel.castShadow = true; rowel.receiveShadow = false; chicken.add(rowel); return chicken; } function Road() { const road = new THREE.Group(); const createSection = color => new THREE.Mesh( new THREE.PlaneBufferGeometry( boardWidth*zoom, positionWidth*zoom ), new THREE.MeshPhongMaterial( { color } ) ); const middle = createSection(0x454A59); middle.receiveShadow = true; road.add(middle); const left = createSection(0x393D49); left.position.x = - boardWidth*zoom; road.add(left); const right = createSection(0x393D49); right.position.x = boardWidth*zoom; road.add(right); return road; } function Grass() { const grass = new THREE.Group(); const createSection = color => new THREE.Mesh( new THREE.BoxBufferGeometry( boardWidth*zoom, positionWidth*zoom, 3*zoom ), new THREE.MeshPhongMaterial( { color } ) ); const middle = createSection(0xbaf455); middle.receiveShadow = true; grass.add(middle); const left = createSection(0x99C846); left.position.x = - boardWidth*zoom; grass.add(left); const right = createSection(0x99C846); right.position.x = boardWidth*zoom; grass.add(right); grass.position.z = 1.5*zoom; return grass; } function Lane(index) { this.index = index; this.type = index <= 0 ? 'field' : laneTypes[Math.floor(Math.random()*laneTypes.length)]; switch(this.type) { case 'field': { this.type = 'field'; this.mesh = new Grass(); break; } case 'forest': { this.mesh = new Grass(); this.occupiedPositions = new Set(); this.threes = [1,2,3,4].map(() => { const three = new Three(); let position; do { position = Math.floor(Math.random()*columns); }while(this.occupiedPositions.has(position)) this.occupiedPositions.add(position); three.position.x = (position*positionWidth+positionWidth/2)*zoom-boardWidth*zoom/2; this.mesh.add( three ); return three; }) break; } case 'car' : { this.mesh = new Road(); this.direction = Math.random() >= 0.5; const occupiedPositions = new Set(); this.vechicles = [1,2,3].map(() => { const vechicle = new Car(); let position; do { position = Math.floor(Math.random()*columns/2); }while(occupiedPositions.has(position)) occupiedPositions.add(position); vechicle.position.x = (position*positionWidth*2+positionWidth/2)*zoom-boardWidth*zoom/2; if(!this.direction) vechicle.rotation.z = Math.PI; this.mesh.add( vechicle ); return vechicle; }) this.speed = laneSpeeds[Math.floor(Math.random()*laneSpeeds.length)]; break; } case 'truck' : { this.mesh = new Road(); this.direction = Math.random() >= 0.5; const occupiedPositions = new Set(); this.vechicles = [1,2].map(() => { const vechicle = new Truck(); let position; do { position = Math.floor(Math.random()*columns/3); }while(occupiedPositions.has(position)) occupiedPositions.add(position); vechicle.position.x = (position*positionWidth*3+positionWidth/2)*zoom-boardWidth*zoom/2; if(!this.direction) vechicle.rotation.z = Math.PI; this.mesh.add( vechicle ); return vechicle; }) this.speed = laneSpeeds[Math.floor(Math.random()*laneSpeeds.length)]; break; } } } document.querySelector("#retry").addEventListener("click", () => { lanes.forEach(lane => scene.remove( lane.mesh )); initaliseValues(); endDOM.style.visibility = 'hidden'; }); document.getElementById('forward').addEventListener("click", () => move('forward')); document.getElementById('backward').addEventListener("click", () => move('backward')); document.getElementById('left').addEventListener("click", () => move('left')); document.getElementById('right').addEventListener("click", () => move('right')); window.addEventListener("keydown", event => { if (event.keyCode == '38') { // up arrow move('forward'); } else if (event.keyCode == '40') { // down arrow move('backward'); } else if (event.keyCode == '37') { // left arrow move('left'); } else if (event.keyCode == '39') { // right arrow move('right'); } }); function move(direction) { const finalPositions = moves.reduce((position,move) => { if(move === 'forward') return {lane: position.lane+1, column: position.column}; if(move === 'backward') return {lane: position.lane-1, column: position.column}; if(move === 'left') return {lane: position.lane, column: position.column-1}; if(move === 'right') return {lane: position.lane, column: position.column+1}; }, {lane: currentLane, column: currentColumn}) if (direction === 'forward') { if(lanes[finalPositions.lane+1].type === 'forest' && lanes[finalPositions.lane+1].occupiedPositions.has(finalPositions.column)) return; if(!stepStartTimestamp) startMoving = true; addLane(); } else if (direction === 'backward') { if(finalPositions.lane === 0) return; if(lanes[finalPositions.lane-1].type === 'forest' && lanes[finalPositions.lane-1].occupiedPositions.has(finalPositions.column)) return; if(!stepStartTimestamp) startMoving = true; } else if (direction === 'left') { if(finalPositions.column === 0) return; if(lanes[finalPositions.lane].type === 'forest' && lanes[finalPositions.lane].occupiedPositions.has(finalPositions.column-1)) return; if(!stepStartTimestamp) startMoving = true; } else if (direction === 'right') { if(finalPositions.column === columns - 1 ) return; if(lanes[finalPositions.lane].type === 'forest' && lanes[finalPositions.lane].occupiedPositions.has(finalPositions.column+1)) return; if(!stepStartTimestamp) startMoving = true; } moves.push(direction); } function animate(timestamp) { requestAnimationFrame( animate ); if(!previousTimestamp) previousTimestamp = timestamp; const delta = timestamp - previousTimestamp; previousTimestamp = timestamp; // Animate cars and trucks moving on the lane lanes.forEach(lane => { if(lane.type === 'car' || lane.type === 'truck') { const aBitBeforeTheBeginingOfLane = -boardWidth*zoom/2 - positionWidth*2*zoom; const aBitAfterTheEndOFLane = boardWidth*zoom/2 + positionWidth*2*zoom; lane.vechicles.forEach(vechicle => { if(lane.direction) { vechicle.position.x = vechicle.position.x < aBitBeforeTheBeginingOfLane ? aBitAfterTheEndOFLane : vechicle.position.x -= lane.speed/16*delta; }else{ vechicle.position.x = vechicle.position.x > aBitAfterTheEndOFLane ? aBitBeforeTheBeginingOfLane : vechicle.position.x += lane.speed/16*delta; } }); } }); if(startMoving) { stepStartTimestamp = timestamp; startMoving = false; } if(stepStartTimestamp) { const moveDeltaTime = timestamp - stepStartTimestamp; const moveDeltaDistance = Math.min(moveDeltaTime/stepTime,1)*positionWidth*zoom; const jumpDeltaDistance = Math.sin(Math.min(moveDeltaTime/stepTime,1)*Math.PI)*8*zoom; switch(moves[0]) { case 'forward': { camera.position.y = initialCameraPositionY + currentLane*positionWidth*zoom + moveDeltaDistance; chicken.position.y = currentLane*positionWidth*zoom + moveDeltaDistance; // initial chicken position is 0 chicken.position.z = jumpDeltaDistance; break; } case 'backward': { camera.position.y = initialCameraPositionY + currentLane*positionWidth*zoom - moveDeltaDistance; chicken.position.y = currentLane*positionWidth*zoom - moveDeltaDistance; chicken.position.z = jumpDeltaDistance; break; } case 'left': { camera.position.x = initialCameraPositionX + (currentColumn*positionWidth+positionWidth/2)*zoom -boardWidth*zoom/2 - moveDeltaDistance; chicken.position.x = (currentColumn*positionWidth+positionWidth/2)*zoom -boardWidth*zoom/2 - moveDeltaDistance; // initial chicken position is 0 chicken.position.z = jumpDeltaDistance; break; } case 'right': { camera.position.x = initialCameraPositionX + (currentColumn*positionWidth+positionWidth/2)*zoom -boardWidth*zoom/2 + moveDeltaDistance; chicken.position.x = (currentColumn*positionWidth+positionWidth/2)*zoom -boardWidth*zoom/2 + moveDeltaDistance; chicken.position.z = jumpDeltaDistance; break; } } // Once a step has ended if(moveDeltaTime > stepTime) { switch(moves[0]) { case 'forward': { currentLane++; counterDOM.innerHTML = currentLane; break; } case 'backward': { currentLane--; counterDOM.innerHTML = currentLane; break; } case 'left': { currentColumn--; break; } case 'right': { currentColumn++; break; } } moves.shift(); // If more steps are to be taken then restart counter otherwise stop stepping stepStartTimestamp = moves.length === 0 ? null : timestamp; } } // Hit test if(lanes[currentLane].type === 'car' || lanes[currentLane].type === 'truck') { const chickenMinX = chicken.position.x - chickenSize*zoom/2; const chickenMaxX = chicken.position.x + chickenSize*zoom/2; const vechicleLength = { car: 60, truck: 105}[lanes[currentLane].type]; lanes[currentLane].vechicles.forEach(vechicle => { const carMinX = vechicle.position.x - vechicleLength*zoom/2; const carMaxX = vechicle.position.x + vechicleLength*zoom/2; if(chickenMaxX > carMinX && chickenMinX < carMaxX) { endDOM.style.visibility = 'visible'; } }); } renderer.render( scene, camera ); } requestAnimationFrame( animate ); </script>
worker_processes 4; nginx工做進程數,根據cpu的核數定義 events { worker_connections 1024; #鏈接數 } #http區域塊,定義nginx的核心web功能 http { include(關鍵字) mime.types(可修改的值); default_type application/octet-stream; #定義日誌格式 log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; #開啓訪問日誌功能的參數 access_log logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; #保持長鏈接 keepalive_timeout 65; #支持圖片 gif等等壓縮,減小網絡 gzip on; #這個server標籤 控制着nginx的虛擬主機(web站點) server { # 定義nginx的入口端口是80端口 listen 80; # 填寫域名,沒有域名就寫ip地址 server_name www.s15rihan.com; # 定義編碼 charset utf-8; # location定義網頁的訪問url #就表明 用戶的請求 是 192.168.13.79/ location / { #root參數定義網頁根目錄 root html; #定義網頁的首頁文件,的名字的 index index.html index.htm; } #定義錯誤頁面,客戶端的錯誤,就會返回40x系列錯誤碼 error_page 404 403 401 400 /404.html; #500系列錯誤表明後端代碼出錯 error_page 500 502 503 504 /50x.html; } #在另外一個server{}的外面,寫入新的虛擬主機2 server{ listen 80; server_name www.s15oumei.com; location / { root /opt/myserver/oumei; #定義虛擬主機的網頁根目錄 index index.html; } } }
在nginx.conf配置文件中python
worker_processes 4; nginx工做進程數,根據cpu的核數定義 events { worker_connections 1024; #鏈接數 } #http區域塊,定義nginx的核心web功能 http { include(關鍵字) mime.types(可修改的值); default_type application/octet-stream; #定義日誌格式 log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; #開啓訪問日誌功能的參數 access_log logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; #保持長鏈接 keepalive_timeout 65; #支持圖片 gif等等壓縮,減小網絡 gzip on; #這個server標籤 控制着nginx的虛擬主機(web站點) server { # 定義nginx的入口端口是80端口 listen 80; # 填寫域名,沒有域名就寫ip地址 server_name www.s15rihan.com; # 定義編碼 charset utf-8; # location定義網頁的訪問url #就表明 用戶的請求 是 192.168.13.79/ location / { #root參數定義網頁根目錄 root html; #定義網頁的首頁文件,的名字的 index index.html index.htm; } #定義錯誤頁面,客戶端的錯誤,就會返回40x系列錯誤碼 error_page 404 403 401 400 /404.html; #500系列錯誤表明後端代碼出錯 error_page 500 502 503 504 /50x.html; } #在另外一個server{}的外面,寫入新的虛擬主機2 server{ listen 80; server_name www.s15oumei.com; location / { root /opt/myserver/oumei; #定義虛擬主機的網頁根目錄 index index.html; } } }
準備兩個虛擬主機的網頁根目錄內容nginx
[root@localhost myserver]# tree /opt/myserver/ /opt/myserver/ ├── oumei │ └── index.html 寫入本身的內容 └── rihan └── index.html 寫入本身的內容
修改windows本地的測試域名 C:\Windows\System32\drivers\etc\hosts文件web
寫入以下內容 192.168.177.130 www.s15rihan.com 192.168.177.130 www.s15oumei.com 由於咱們沒有www.s15oumei.com 也沒有 www.s15rihan.com ,所以要在本地搞一個測試域名, 不想改dns的話,就去阿里雲去買一個域名~~~~~~~~~~~~~~~~~~~~~~
1.開啓nginx.conf中的日誌參數ajax
log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; #開啓訪問日誌功能的參數 access_log logs/access.log main;
2.檢查access.log的日誌信息算法
tail -f access.log
在nginx.conf中,添加參數sql
在server{}虛擬主機標籤中,找到location 而後添加參數 #當有人訪問 192.168.13.79/ 的時候 location / { #拒絕參數是 deny #deny 寫你想拒絕的IP地址 #deny還支持拒絕一整個網站 deny 192.168.13.33; root /opt/myserver/rihan; index index.html; }
1.修改nginx.conf 中的配置參數
這個s1540x.html存在 虛擬主機定義的網頁根目錄下
error_page 404 /s1540x.html;
正向代理相似一個跳板機,代理訪問外部資源。apache
舉個例子:canvas
我是一個用戶,我訪問不了某網站,可是我能訪問一個代理服務器,這個代理服務器呢,他能訪問那個我不能訪問的網站,因而我先連上代理服務器,告訴他我須要那個沒法訪問網站的內容,代理服務器去取回來,而後返回給我。從網站的角度,只在代理服務器來取內容的時候有一次記錄,有時候並不知道是用戶的請求,也隱藏了用戶的資料,這取決於代理告不告訴網站。
正向代理的用途:
(1)訪問原來沒法訪問的資源,如google (2) 能夠作緩存,加速訪問資源 (3)對客戶端訪問受權,上網進行認證 (4)代理能夠記錄用戶訪問記錄(上網行爲管理),對外隱藏用戶信息
反向代理(Reverse Proxy)實際運行方式是指以代理服務器來接受internet上的鏈接請求,而後將請求轉發給內部網絡上的服務器,並將從服務器上獲得的結果返回給internet上請求鏈接的客戶端,此時代理服務器對外就表現爲一個服務器。
反向代理的做用:
(1)保證內網的安全,能夠使用反向代理提供WAF功能,阻止web攻擊
大型網站,一般將反向代理做爲公網訪問地址,Web服務器是內網。
(2)負載均衡,經過反向代理服務器來優化網站的負載
兩者區別
在gninx.conf文件中添加配置
location / {
proxy_pass http://www.baidu.com;
#root html;
#index index.html index.htm;
}
瀏覽器 訪問 192.168.177.130時 跳轉到百度頁面
1.實驗準備 準備三臺計算機 nginx1 192.168.13.121 做爲nginx負載均衡器 只要我訪問這個負載均衡器,查看頁面的結果,究竟是來自於 nginx2 192.168.13.24 web服務,提供一個頁面 nginx3 192.168.13.79 web服務,提供一個頁面 2.先配置兩個nginx web頁面 192.168.13.24 準備一個 index.html 寫入 你好,我是192.168.13.24機器 192.168.13.79 準備一個 index.html 寫入 老了老弟,我是192.168.13.79 而後啓動兩個nginx web 服務 3.準備一個nginx負載均衡器 192.168.13.121機器上,修改nginx.conf 寫入以下內容 定義一個負載均衡池,負載均衡的算法有 調度算法 概述 輪詢 按時間順序逐一分配到不一樣的後端服務器(默認) weight 加權輪詢,weight值越大,分配到的訪問概率越高 ip_hash 每一個請求按訪問IP的hash結果分配,這樣來自同一IP的固定訪問一個後端服務器 url_hash 按照訪問URL的hash結果來分配請求,是每一個URL定向到同一個後端服務器 least_conn 最少連接數,那個機器連接數少就分發 1.輪詢(不作配置,默認輪詢) 2.weight權重(優先級) 3.ip_hash配置,根據客戶端ip哈希分配,不能和weight一塊兒用 upstream s15webserver { ip_hash; server 192.168.13.79 ; server 192.168.13.24 ; } 而後在虛擬主機中添加 反向代理配置,將用戶的請求,直接轉發給 負載均衡池中的服務器 server { listen 80; #當個人請求來自於 192.168.13.121時,走這>個虛擬主機 server_name 192.168.13.121; #charset koi8-r; #access_log logs/host.access.log main; location / { proxy_pass http://s15webserver; #root html; #index index.html index.htm; } } 4.啓動負載均衡器的 nginx服務 5.在客戶端windows中測試訪問,負載均衡器 192.168.13.121 ,查看請求分發的結果