win10下，webpy+nginx+fastcgi+cesium+python3搭建服务端--静态文件方式

一。

环境win10,webpy, nginx-1.14.0, cesium-1.45，flup,python3.6

安装略。

二。

nginx.conf简单配置如下：

# nginx启动工作进程数，建议等于电脑核数。
worker_processes 8;
# 日志（含错误日志）存放文件。

error_log logs/error.log info;

events {
worker_connections 1024;
}

http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
# 监听端口，即客户端访问的端口。
listen 80;
# 服务器名
server_name localhost;
# root 此项目的根路径。
root D:/rhmap3;
# index 响应哪个网页到客户端。
index D:/rhmap3/templates/index.html D:/rhmap3/templates/index.htm;

# 此设置使nginx和fastcgi相结合。
location / {
#运行命令python test_nginx.py 8008 fastcgi, 以下配置才起作用。
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $fastcgi_script_name;
fastcgi_param PATH_INFO $fastcgi_script_name;
fastcgi_pass 127.0.0.1:8008;
}
# 此设置使客户端可以访问静态文件。
location /static/ {
if (-f $request_filename) {
rewrite ^/static/(.*)$ /static/$1 break;
}
}
# redirect server error pages to the static page /50x.html
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}

}

三。

后端，前端，JS文件如下（其他静态文件略，静态文件的方式）：

后端main_prog2.py：

'''
此代码目的：
测试在使用nginx fastcgi的情况下，在/static/Scene中查询文件，
并以三维地图方式，响应到客户端。

代码发布流程：
１．
nginx用于布署代码到服务器，webpy自身不具备布署功能。
首先配置nginx. root index fastcgi ip:port 静态文件的访问等等。
启动nginx
PS D:\nginx-1.14.0> start nginx
启动之后可以在任务管理器进程中查看，
我猜是一个 master process
8个 worker process

2.启动此代码
python main_prog2.py 8008 fastcgi

在浏览器分别输入测试URL．
测试URL:
http://localhost/Scene/czcity4_cesium.json
http://127.0.0.1/Scene/czcity4_cesium.json
http://127.0.0.1/Scene/Data/Tile_p009_p011/Tile_p009_p011.json
http://127.0.0.1/Scene/Data/Tile_p009_p012/Tile_p009_p012.json
http://127.0.0.1/Scene/Data/Tile_p009_p013/Tile_p009_p013.json
查看到相应的三维地图就算成功。
'''
import web
render = web.template.render('templates/')

urls = (
'/Scene/(.*)', 'scene',
)

class scene:
def GET(self, file):
# print(file)
# print(type(file))
# print()
return render.index(file)

if __name__ == "__main__":
app = web.application(urls, globals())

app.run()

前端index.html：

$def with (file)
<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>czcity4_cesium - Cesium 3D Tiles generated from Bentley ContextCapture</title>
<link href="/favicon.ico" rel="shortcut icon">
<script src="/static/Cesium/Cesium.js"></script>
<style>
@import url(/static/Cesium/Widgets/widgets.css);
html, body, #cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script src="/static/main.js"></script>
<script>
printaaa();
console.log('$file');
console.log(typeof '$file');
addScene('$file');
</script>
</body>

</html>

JS文件main.js：

}

四。

知识点及注意事项

后端响应到前端的字符串，到了前端它只接收了字符串的内容。
若需把前端的字符串变量，在外部js中引用，还需自己再加一层引号，
在写在html网页中的javascript中，对后端响应到前端的变量添加引号，

直接添加即可，无需像python语言那样再专门写一个添加引号的函数。

这样即可在外部的js文件的函数中引用html中的变量。
或者说，这样就可以在html中引用外部js文件中的函数，并把html中的变量作为参数，
传入该函数。
至此，就实现了外部js文件，引用模板中的变量了。
模板中的变量实质也是后端传参过来的，如此，

后端的参数，通过html网页模板，就可以在外部js文件中引用了，

html模板也可以通过form表单，AJAX等方式，把模板中的数据，传到后端。

js可以操作网页的结构和数据。

至此，后端，前端，外部js文件，可以通过变量等方式，互通有无了。

在webpy框架下，html中对静态文件的引用，有两种情况，
一。
网页标题栏的图标的引用。
该图标建议放在项目的根路径下，如：favicon.ico，
在html中的引用方法，如下：
<link href="/favicon.ico" rel="shortcut icon">
二。
静态文件的引用。
所有的静态文件，除了一，都必须放在static下，
在html中引用时，路径的填写，建议如下方式：
<script src="/static/main.js"></script>
@import url(/static/Cesium/Widgets/widgets.css);
<script src="/static/Cesium/Cesium.js"></script>
否则容易报错。
原理窃以为，就像在浏览器中直接访问该静态文件是一样的。
你这样写，浏览器见到它，就像你在浏览器中直接访问该静态文件一样，

去访问它。这样就把好多功能，聚集到一起实现了。

webpy框架下，html,js等对静态文件的引用是基于static文件夹的，
即引用路径的权威写法是/static/......，暂且称之为“绝对路径”
而不建议基于彼此的相对路径。
也就是说，“绝对路径”写法是最无争议的写法。

在webpy框架下，JS文件中对静态文件的引用，同html中对静态文件的引用相同，
示例如下：
viewer.scene.frameState.creditDisplay.addDefaultCredit(
new Cesium.Credit(
'Cesium 3D Tiles produced by Bentley ContextCapture',
'/static/Resources/logoBentley.png',
'http://www.bentley.com/'
)
);
var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: '/static/Scene/' + file,
maximumScreenSpaceError: 2,
maximumNumberOfLoadedTiles: 1000
}));

五。

特别注意事项。

此服务搭建，有一个文件很重要，是此服务搭建能否成功的重要参考文件，

那就是，日志（含错误日志）存放文件。

error_log logs/error.log info;

每次启动浏览器访问服务器，成功也好，失败更是，要看一看日志文件，到底发生了什么。

是否有error,方便调试改错。

还有一个，就是浏览器下按F12键，方便查看网页的具体情况，是否报错，借此可对网页内容进行调试。

六。

写在最后。

以上是参考前人的文章，及自己经验的总结。

若有可改善之处，还请指出，共同进步。

win10下，webpy+nginx+fastcgi+cesium+python3搭建服务端--静态文件方式

猜你喜欢