Назад | Перейти на главную страницу

Размещение приложения reactjs с сервером синтаксического анализа

Я пытаюсь разместить приложение responsejs на том же сайте в качестве сервера синтаксического анализа. Я использую следующие

// Serve static assets
app.use(express.static(path.resolve(__dirname, '..', 'build')));

// Always return the main index.html, so react-router render the route in the client
app.get('*', (req, res) => {
  res.sendFile(path.resolve(__dirname, '..', 'build', 'index.html'));
});

вместе с обычными экспресс-конфигурациями сервера синтаксического анализа

// Serve the Parse API on the /parse URL prefix
var mountPath = process.env.PARSE_MOUNT || '/parse'
app.use(mountPath, api)

Но это не работает. Буду очень признателен, если меня укажут в правильном направлении.

PS: ошибки нет, у меня просто пустая страница.

parse-server

Трудно ответить без дополнительной информации, но вот что я хотел бы проверить:

Откройте инструменты разработчика, чтобы увидеть, появляется ли у вас ошибка на пустой странице. Возможно, вы загружаете незастроенный код, например, import неповрежденные операторы, которые браузер воспринимает как синтаксическую ошибку
Если вы используете обратный прокси перед express (например, nginx), проверьте его конфигурацию.
Убедитесь, что Экспресс знает, что нужно загрузить index.html в ответ на /. Я не использую экспресс для обслуживания статических файлов (я делаю это непосредственно в nginx), поэтому не знаком с соглашениями здесь.

я использую nginx служить статическим client-build (пакет веб-пакетов), а затем я запускаю parse-server установлен как экспресс-приложение, и parse-dashboard как собственное приложение. nginx, parse-server и parse-dashboard каждый находится в своем собственном контейнере докеров, все в одной сети докеров.

Если это поможет, вот nginx файл, который я использую:

server {

    listen 80;
    server_name localhost;
    charset utf-8;
    client_max_body_size 200M;

    # Forward to parse-server docker container
    location /api/ {
        proxy_pass http://server:80/;
        proxy_set_header Host $http_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;
        proxy_set_header X-NginX-Proxy true;
        client_max_body_size 200M;
    }

    # Forward to parse-dashboard docker container
    location /parse-dashboard/ {
      include /etc/nginx/mime.types;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-NginX-Proxy true;
      proxy_pass http://parse-dashboard/parse-dashboard/;
      proxy_ssl_session_reuse off;
      proxy_set_header Host $http_host;
      proxy_redirect off;
    }

    # Serve static client build
    location / {
      alias /usr/clientbuild/;
      try_files $uri /index.html;
      gzip_static on;
      expires max;
      add_header Cache-Control public;
    }
}

А вот как я монтирую parse-server в экспрессе:

var express = require('express');
var ParseServer = require('parse-server').ParseServer;

/* Sample env keys:

    PARSE_SERVER_APPLICATION_ID=yourproduct

    # localhost is the address of parse-server from the perspective of itself
    PARSE_SERVER_URL=http://localhost/api/parse/

    # localhost:9595 is the public address of nginx
    PARSE_PUBLIC_SERVER_URL=http://localhost:9595/api/parse/

    # Note that nginx mount path is /api
    PARSE_SERVER_MOUNT_PATH=/api/parse

    PARSE_SERVER_CLOUD_CODE_MAIN=/usr/src/app/server/build/cloud.js

*/

var startParseServer = function() {

    const cfg = {
        databaseURI: process.env.PARSE_SERVER_DATABASE_URI,
        cloud: process.env.PARSE_SERVER_CLOUD_CODE_MAIN,
        appId: process.env.PARSE_SERVER_APPLICATION_ID,
        masterKey: process.env.PARSE_SERVER_MASTER_KEY,
        serverURL: process.env.PARSE_SERVER_URL,
        publicServerURL: process.env.PARSE_PUBLIC_SERVER_URL,
        mountPath: process.env.PARSE_SERVER_MOUNT_PATH,
        filesAdapter: s3adapter,
        fileKey: process.env.PARSE_SERVER_FILE_KEY,
        allowClientClassCreation: false,
        maxUploadSize: '200mb'
    }

    var api = new ParseServer(cfg);

    var app = express();
    app.set('trust proxy', (ip) => true)

    app.use('/', (req, res, next) => {

        // Static code in development runs from localhost:3000
        const {
            PARSE_SERVER_ALLOW_ORIGIN='http://localhost:3000'
        } = process.env

        res.header('Access-Control-Allow-Origin', PARSE_SERVER_ALLOW_ORIGIN);
        res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
        res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

        next();
    });

    // Not sure if both these are necessary. Haven't messed with it.
    app.use('/parse', api);
    app.use('/api/parse', api);

    var port = process.env.PORT;
    app.listen(port, function() {
        console.log('Running on port ' + port.toString() + '.');
    });
};

startParseServer();

process.on('SIGINT', function() {
    console.log('Received SIGINT');
    process.exit(0);
});

process.on('SIGTERM', function() {
    console.log('Received SIGTERM');
    process.exit(0);
});

Надеюсь, это вам поможет.