我有问题设置api和前端在同一域使用nginx



我从azure得到了一个vm,我试图在vue和django中设置前端和后端。然而,我的问题是,在1域下,我似乎不能使它们都工作。

这是我的nginx配置为vue:

server {
listen 80;
server_name www.todoapi.xyz;
return 301 https://www.todoapi.xyz$request_uri;
}
server {
listen 443 ssl;
server_name www.todoapi.xyz;
client_max_body_size 4G;
error_log  /webapps/todo/enviroment_3_8_2/logs/nginx-vue-error.log;
access_log /webapps/todo/enviroment_3_8_2/logs/nginx-vue-access.log;
ssl_certificate /etc/letsencrypt/live/www.todoapi.xyz/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/www.todoapi.xyz/privkey.pem;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
ssl_ciphers 'EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH';
charset utf-8;
root /webapps/todo/todo_vue/dist;
index index.html index.htm;
location / {
root /webapps/todo/todo_vue/dist;
try_files $uri $uri/ =404;
}
}

And nginx config for django:

upstream todo_app_server {
server unix:/webapps/todo/enviroment_3_8_2/run/gunicorn.sock fail_timeout=0;
}
server {
listen 80;
server_name www.todoapi.xyz;
return 301 www.todoapi.xyz$request_uri;
}
server {
listen 443 ssl;
server_name www.todoapi.xyz;
client_max_body_size 4G;
access_log /webapps/todo/enviroment_3_8_2/logs/nginx-django-access.log;
error_log /webapps/todo/enviroment_3_8_2/logs/nginx-django-error.log;
ssl_certificate /etc/letsencrypt/live/www.todoapi.xyz/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/www.todoapi.xyz/privkey.pem;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
ssl_ciphers 'EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH';
location /static/ {
alias /webapps/todo//environment_3_8_2/todo/static/;
}
location /media/ {
alias /webapps/todo/todo_vue_api/media/;
}
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_redirect off;
if (!-f $request_filename) {
proxy_pass http://todo_app_server;
}
}
}

从我在谷歌上读到的,似乎有可能让他们在同一域,但我不能这样做。两个nginx文件都可以单独运行,但是只有vue文件可以一起工作。

任何人看到这个和想知道。我创建了一个名为api.todoapi.xyz的子域名。将django api的nginx改为api.todapi.xyz,并使用certbox获取此子域名的证书。