Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
374 views
in Technique[技术] by (71.8m points)

nignx部署vue+node。无法访问页面

我vue项目打包为web,node项目为一个server文件夹,数据库是mysql(8.20)。本地运行良好。

server/index.js

const express = require('express');
const app = express();
const bodyParser = require('body-parser');

// use挂载中间件
app.use((req, res, next) => {// 默认路径为根目录,所有请求都会经过这个中间件
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Access-Control-Expose-Headers, Platform, Token, Uid');
  res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS, HEAD');
  res.header('Content-Type', 'application/json; charset=utf-8');
  next();
});

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
//静态资源解析路径
app.use(express.static(path.join(__dirname, 'web')));

app.use('/api', require(__dirname + '/module/emailInfo'));

app.listen(8092, () => {
  console.log('express listen port 8092');
});

我阿里云申请了免费的服务器(试用一个月那个),参照网上一些教程,我安装了mysql, nginx, node, pm2.

我将打包文件web和server文件都上传到 /usr/local/offcial_web文件夹下:
image.png
并启动了node项目

pm start /usr/local/offcial_web/server/index.js

image.png
发现并没有打印里面的console 我这算启动成功了吗

我在 /etc/nginx/conf.d/offcial_web.conf 配置如下
server {

  listen 80;
  server_name 118.190.38.232;
  root /usr/local/offcial_web/web;

  location / {
     root /usr/local/offcial_web/web/;
     #try_files $uri $uri/ /index.html;
     index index.html;
  }

  location ^~ /static/ {
     root /usr/local/offcial_web/web/;
  }

  location ^~ /api/ {
    #rewrite  ^/api/(.*)$ /$1 break;

    proxy_pass http://127.0.0.1:8092;

    limit_req zone=query burst=30 nodelay;
    limit_req_status 503;
    include  uwsgi_params;
    # 指向uwsgi 所应用的内部地址,
    # 所有请求将转发给uwsgi 处理
    #uwsgi_pass iess_nodes; 
    proxy_connect_timeout 300s;
    proxy_send_timeout 300s;
    proxy_read_timeout 300s;
    proxy_http_version 1.1;

    client_max_body_size 10m;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For     $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    #uwsgi_pass 127.0.0.1:8000;
 }

}
最后执行了

nginx -s reload

我在浏览器打开地址并未出现预期的页面
image.png
image.png
刚刚接触node和nginx,不太懂这方面。我是哪里不对吗
谢谢。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

最后我把nginx.conf user 改成了root(当前登录服务器用户)

且offcialweb文件被我改成了如下(主要是注释了一些配置)

server {

  listen 80;
  server_name xxxxx;#xxxx为你的服务器IP/域名
  #root /usr/local/offcial_web/web; 

  location / {
     root /usr/local/offcial_web/web/;
 index index.html;
     try_files $uri $uri/ /index.html;
  }

  location ^~ /static/ {
     root /usr/local/offcial_web/web/;
  }        

  location  /api/ {
    #rewrite  ^/api/(.*)$ /$1 break;
    
    proxy_pass http://127.0.0.1:3389;
    
    #limit_req zone=query burst=30 nodelay;
    #limit_req_status 503;
    #include  uwsgi_params;
    #uwsgi_pass iess_nodes; # 指向uwsgi 所应用的内部地址,所有请求将转发给uwsgi 处理
    #proxy_connect_timeout 300s;
    #proxy_send_timeout 300s;
    #proxy_read_timeout 300s;
    #proxy_http_version 1.1;

    #client_max_body_size 10m;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    #uwsgi_pass 127.0.0.1:8000;
 }

}
最后结果是成功了,前端页面出来了,(node服务)后端接口能走通。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...