Discussion :

[mel--]

Bonjour à tous,

Tout d'abord je remercie tout ceux qui prendront le temps de lire ce message.

Je développe actuellement une application MEAN stack. J'utilise donc Nodejs pour gérer le backend. J'ai un CORS qui contrôle l'origine des requêtes.
En local, tout fonctionne correctement.

Je dois maintenant déployer l'application sur un serveur web (j'utilise NGINX) et c'est la que je rencontre des difficultés.

Lorsque que je build l'application et que je lance le back, l'application en ligne fonctionne correctement.

Au bout d'un moment, mon CORS bloque les requête provenant de mon front en prenant pour origin autorisée localhost:4200.
J'ai supposé que le problème venait du fait que lorsque je retravaille sur le projet en local, le cors reprend localhost:4200 comme origin autorisé, mais je ne comprends pas comment c'est possible puisque mon application est déployée sur un serveur distant.

Je vous met les bouts de code concernés:
Mon index back :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
let origin = 'https://nomdomainedemonapp.co'
 
const options = {
    cors: {
        origin: origin,
        methods: ["GET", "POST"],
        allowedHeaders: ["my-custom-header"],
        credentials: true
    }, allowEIO3: true
};
const io = require("socket.io")(server, options);

Lorsque je travaille en local il s'agit du même code. La seul chose qui change, c'est let origin = 'https://nomdomainedemonapp.co' qui devient let origin = 'http://localhost:4200'

Les headers:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
app.use((req, res, next) => {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content, Accept, Content-Type, Authorization');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH, OPTIONS');
    next();
  });

Ma configuration nginx:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
location /soc{
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header Access-Control-Allow-Origin *;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_pass http://127.0.0.1:3000;

J'apprends tout ca seule donc il se peut que je ne sois pas dans les bonnes pratiques.

Par avance un très grand merci

[mel--]

Bonjour,

J'ai un peu avancé sur le déploiement sur nginx.

Malheureusement je rencontre à nouveau un problème.

J'ai donc utilisé un reverse proxy pour pouvoir faire des requetes https redirigées vers mon back.

Malheureusement je n'arrive pas à modifier mes routes pour qu'elles fonctionnent avec le reverse.

Peut être que l'erreur est ailleurs

Je remet le code ci dessous:
reverse proxy nginx:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
  location /soc/ {
                root /capza_app/back/;
                index index.js;
#               proxy_set_header X-Real-IP;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header Host $host;
                proxy_set_header X-NginX-Proxy true;
                proxy_set_header AccesControl-Allow-Origin *;
                proxy_pass http://ip:3000/;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
                proxy_http_version 1.1;
        #       proxy_redirect http://ip:3000/ https://compliance.capza.co;
        }

Appel de l'api dans mon front:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
 apiUrl = 'https://compliance.capza.co/soc/transaction/'
 
 saveFund(newFund : Fund){
    console.log("nous sommes dans le service de ", newFund)
    let url = this.apiUrl + 'saveFund';
    console.log("front" + url)
    return this.http.post<Fund>(url, newFund, { headers: new HttpHeaders({ 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*' })})
  }

Redirection vers le controlleur dans mon index:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
const TransactionController = require('./controllers/transactionController');
 
app.use('/user', UserController);
app.use('/user/saveUser', UserController);
app.use('/soc/transaction', TransactionController);

Mon controller:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
app.post('/saveFund', (req, res, next) =>{
 
    const newFund = new Fund({
        fund_s:             req.body.fund_s,
        fund_name:          req.body.fund_name,
        isUBO:              req.body.isUBO,
        isHDD:              req.body.isHDD,
        fund_acquis_date:   req.body.fund_acquis_date,
        fund_sell_date:     req.body.fund_sell_date,
        id_user :           req.body.id_user
    })
 
    console.log(newFund)
 
    newFund.save()
    .then((newFundSave) => res.status(200).json({message : 'Nouvelle fondation ajoutée', data : newFundSave}))
 
})

Je présice que tout fonctionne en locale, et tout fonctionne lorsque je déploie sans utiliser de ssl.

Par avance un très grand merci