Сбой подключения https nginx (CRA) к http express API в веб-приложении MERN - PullRequest
Новая
       15

Сбой подключения https nginx (CRA) к http express API в веб-приложении MERN

0 голосов
/ 14 апреля 2020

У меня есть веб-приложение MERN, работающее на одной цифровой океанской капле (сервер реакции / redux + express) с certbot, позволяющей шифровать ssl-сертификат, настроенный следующим образом: (* используется для конфиденциальных данных *) nginx conf: 

server {
    if ($host = www.*domain*.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


    if ($host = *domain*.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot

        listen 80 default_server;
        listen [::]:80 ipv6only=on default_server;

        server_name *domain*.com www.*domain*.com;
    return 404; # managed by Certbot

}


server {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    server_name *domain*.com www.*domain*.com;
    root /var/www/html;
    ssl_certificate /etc/letsencrypt/live/*domain*.com-0001/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/*domain*.com-0001/privkey.pem;
    ssl_session_timeout 1d;                                                                                                                                                                                                                      ssl_session_cache shared:MozSSL:10m;  # about 40000 sessions
    ssl_session_tickets off;

    # curl https://ssl-config.mozilla.org/ffdhe2048.txt > /path/to/dhparam
    #ssl_dhparam /path/to/dhparam;

    # intermediate configuration
    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-S$    ssl_prefer_server_ciphers on;

    # HSTS (ngx_http_headers_module is required) (63072000 seconds)
    add_header Strict-Transport-Security "max-age=63072000" always;

    # OCSP stapling
    ssl_stapling on;
    ssl_stapling_verify on;

 ssl_trusted_certificate /etc/letsencrypt/live/*domain*.com-0001/chain.pem;

    # replace with the IP address of your resolver
    resolver 8.8.8.8;
#127.0.0.1;
        location /home/login/create {
        proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header authorization $http_authorization;
                proxy_pass_request_headers      on;
                proxy_no_cache $cookie_nocache  $arg_nocache$arg_comment;
                proxy_no_cache $http_pragma     $http_authorization;
                proxy_cache_bypass $cookie_nocache $arg_nocache $arg_comment;
                proxy_cache_bypass $http_pragma $http_authorization;

                    #
                    # Custom headers and headers various browsers *should* be OK with but aren't
                    #

                if ($request_method = 'OPTIONS') {

                    #
                    # Tell client that this pre-flight info is valid for 20 days
                    #
                    add_header 'Access-Control-Max-Age' 1728000;
                    add_header 'Access-Control-Allow-Origin'  'http://local.web.com:1025' always;
                    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, HEAD' always;
 add_header 'Access-Control-Allow-Headers' 'authorization, Origin, X-Requested-With, Content-Type, Accept' always;                                                                                                                            add_header  'Access-Control-Allow-Credentials' 'true' always;
                    return 204;
                }
                if ($request_method = 'POST') {                                                                                                                                                                                                                  add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
                    add_header 'Access-Control-Allow-Origin'  'http://local.web.com:1025' always;
                    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, HEAD' always;
                    add_header 'Access-Control-Allow-Headers' 'authorization, Origin, X-Requested-With, Content-Type, Accept' always;
                    add_header    'Access-Control-Allow-Credentials' 'true' always;
                }
                if ($request_method = 'GET') {
                    add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
                    add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';                                                                                                                                                                   
                    add_header 'Access-Control-Allow-Origin'  'http://local.web.com:1025' always;                                                                                                                                                                
                    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, HEAD' always;
                    add_header 'Access-Control-Allow-Headers' 'authorization, Origin, X-Requested-With, 
                    Content-Type, Accept' always;
                    add_header    'Access-Control-Allow-Credentials' 'true' always;

                }
                   try_files $uri /index.html
      proxy_pass "http://localhost:5000/home/login/create";
        proxy_http_version 1.1;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection 'upgrade';
       }
}

express сервер: 

const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');
const product = require('./routes/product.route');

const app = express();

app.use(cors({ origin: true }));

const mongoose = require('mongoose');
let dev_db_url = 'mongodb+srv://*username*:*password*@Website-qoqbq.mongodb.net/Website?retryWrites=true&w=majority';
const mongoDB = process.env.MONGODB_URI || dev_db_url;
//new parser for future compatibility
mongoose.connect(mongoDB, {
    useNewUrlParser: true,
    useUnifiedTopology: true
});                                                                                                                                                                                                                                          mongoose.Promise = global.Promise;
const db = mongoose.connection;
db.on('error', console.error.bind(console, 'MongoDB connection error:'));
//json parsing and cors
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
    extended: false
}));

app.use('/home/login', product);
let port = 5000;

app.listen(port, "0.0.0.0", () => {
    console.log('Server is up and running on port number ' + port);
});

express API-контроллеры: 

const Product = require('../models/product.model');

 exports.product_create = function (req, res, next) {
    let product = new Product({
        name: req.body.name,
        text: req.body.text,
        email: req.body.email,
        v: req.body.v
    });
   //saving to db
    product.save(function (err, product) {
        if (err) {
            return next(err);
        }
    })
};
//getById
exports.product_details = function (req, res, next) {
    Product.findById(req.params.id, function (err, product) {
        if (err) return next(err);

    })
};
.
.
.

я выполняю запросы API в файле действий приставки (i пробовал и https, и http запросы) вот так: 

.
.
.
export const login = (details) => dispatch => {
 var formBody = [];
 for (var property in details) {
 var encodedKey = encodeURIComponent(property);
 var encodedValue = encodeURIComponent(details[property]);
 formBody.push(encodedKey + "=" + encodedValue);
 }
 formBody = formBody.join("&");

 fetch('https://localhost:5000/home/login/create', {
 method: 'POST',
 headers: {
   'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
 },
 body: formBody
 })                                                                                                                                                                                                                                           .then(res => res.json())
 .then(res => dispatch({
  type: NEW_POSTS,
  payload: res
})
  );
}
.
.
.

проблема, с которой я сталкиваюсь около месяца, заключается в том, что хотя nginx, кажется, без проблем загружает страницу как https мой сервер, по-видимому, отказывается от всех вложенных форм в мой API при использовании https на внешнем интерфейсе, но отлично работает при использовании http на внешнем интерфейсе. Интересно, что я получаю следующие ошибки:

google chrome: postActions. js: 46 POST https://localhost: 5000 / home / login / create net :: ERR_CONNECTION_REFUSED firefox Редакция разработчика: Запрос из другого источника отклонен: политика того же источника делает невозможным чтение удаленного источника в https://localhost: 5000 / home / login / create . (Причина: запрос CORS не выполнен).

Я попытался переконфигурировать пакет CORS разными способами, вручную добавить заголовки в ответ контроллера, добавить их в файл nginx conf и многое другое, но безуспешно , Прочитав подобные посты в Интернете, я обнаружил, что вам действительно не нужен сервер по протоколу https, если клиент настроен как https и передает запросы на порт localhost, поскольку мой сервер находится в той же сети. Кто-нибудь знает, что может быть причиной этой проблемы?

В firefox документах говорится, что проблема может быть вызвана следующим: По состоянию на Firefox 68, https страниц не разрешен доступ http://localhost, хотя это может быть изменено ошибкой 1488740. но я, честно говоря, понятия не имею, как обойти это или как проверить, является ли это даже причиной, вызывающей это. Спасибо за ваше время

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...