问题：
- 前后端分离
- 前端在编写阶段（机器IP:192.168.1.11），后端已经部署好，数据通过REST API提供（机器IP:192.168.1.33:8000/api/）
- 跨域问题，就算是端口不一样也会出现。
解决跨域问题有多种，这里选择nginx代理。
####nginx配置
nginx默认监听80端口，由于是编码阶段，我们不改动。
新建一个server监听8080，并且将http://localhost:8080/api全部转发到http://192.168.1.33:8000/api
1
2
3
4
5
6
7
8
9
10
11
12
| server {
listen 8080;
server_name localhost:8080;
location / {
root F:/html/myHtmlTest;
index index.html index.htm;
}
location /api {
proxy_pass http://192.168.1.33:8000/api;
}
}
|
或者
1
2
3
4
5
6
7
8
9
10
11
12
| server {
listen 8080;
server_name localhost:8080;
location / {
root F:/html/myHtmlTest;
index index.html index.htm;
}
location /api/ {
proxy_pass http://192.168.1.33:8000;
}
}
|
两种写法效果一样，区别在于
1
2
3
4
5
6
7
8
9
10
| location /api {
proxy_pass http://192.168.1.33:8000/api;
}
#这样写`proxy_pass`不会带上`location`的“/api ”,所以改成这样
location /test{
proxy_pass http://192.168.1.33:8000/api;
}
#目标访问地址也是不变的
#但是我们访问就应该是 http://192.168.1.11:8080/test
#转发到 http://192.168.1.33:8000/api
|
1
2
3
4
5
6
| location /api/ {
proxy_pass http://192.168.1.33:8000;
}
#这种写法的`proxy_pass`会把`location`的“/api/ ”带上
#当访问 http://192.168.1.11:8080/api/
#就会转发为 http://192.168.1.33:8000/api/
|
前端html文件（如test.html）放在location /.root的目录下（如F:/html/myHtmlTest）
通过http://localhost:8080/test.html 访问html文件
ajax访问资源 var url = “http://localhost:8080/api/v1/hello/“;
nginx会将api转发到http://192.168.1.33:8000/api;
Linux下的配置文件include了其他默认的配置，可以在里面配置server，如果不需要可以注释掉。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| include /etc/nginx/conf.d/*.conf;
include /etc/nginx/sites-enabled/*;
/etc/nginx/sites-enabled/default文件就是设置默认的端口和目录，内容如：
# Default server configuration
#
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/html;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ =404;
}
}
|
nginx配置文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
|
#user nobody;
worker_processes 1;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
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;
#gzip on;
server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index index.html index.htm;
}
#location /api {
# proxy_pass http://192.168.1.150:8000/api;
#}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}
# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}
server {
listen 8080;
server_name localhost:8080;
location / {
root F:/html/myHtmlTest;
index index.html index.htm;
}
location /api {
proxy_pass http://192.168.1.33:8000/api;
}
}
# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;
# location / {
# root html;
# index index.html index.htm;
# }
#}
# HTTPS server
#
#server {
# listen 443 ssl;
# server_name localhost;
# ssl_certificate cert.pem;
# ssl_certificate_key cert.key;
# ssl_session_cache shared:SSL:1m;
# ssl_session_timeout 5m;
# ssl_ciphers HIGH:!aNULL:!MD5;
# ssl_prefer_server_ciphers on;
# location / {
# root html;
# index index.html index.htm;
# }
#}
}
|