как соблюдать windows использование из приложения React js переднего конца при использовании node js API

Question

Прежде чем перейти к вопросу, обратите внимание, я перепробовал много предложений от stackoverflow и многих других веб-сайтов. Есть много предложений, но большинство из них действительно не решают этот вопрос прямо.

Мой вопрос в одном простом предложении: как сообщить моему веб-серверу (который основан на node js express API)? , зарегистрированный windows идентификатор пользователя (из моего приложения js) в приложении intr anet?

До сих пор я могу писать node js на основе *1029* сервер, который использует узел- Библиотека sspi и предоставляет мне windows идентификатор пользователя и группы. Этот API-интерфейс так же прост, как

    var express = require('express');
    var app = express();
    var server = require('http').createServer(app);
    let cors = require('cors')
    app.use(cors())


    app.use(function (req, res, next) {
    var nodeSSPI = require('node-sspi');
    var nodeSSPIObj = new nodeSSPI({
        retrieveGroups: true
    });
    nodeSSPIObj.authenticate(req, res, function(err){
        res.finished || next();
    });
    });

    app.get('*', function (req, res, next) {
        res.json({msg: '************  Server reply by user ' + req.connection.user})
    });


// Start server
var port = process.env.PORT || 3002;
server.listen(port, function () {
  console.log('Express server listening on port %d in %s mode', port, app.get('env'));
});

React App. js код

import React, { Component } from 'react';
import './App.css';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      msg: "Not known",
      localdata:"local status",
      status:"not set",
    };
  }
  componentDidMount() 
  {
    fetch('http://192.168.7.179:3002/',{
      method: 'GET', // *GET, POST, PUT, DELETE, etc.
      headers: {
        'Content-Type': 'application/json',
      },
    })
      .then(response => 
        {
          this.state.status = response.status;
          return response.text();
        }
      )
      .then(msg => 
        this.setState({ msg })
        );
  }
  render() {
    return (

      <div className="App"> 
      <div> LocalData is  - {this.state.localdata}</div>
      <div> Server data is - {this.state.msg} </div> 
        api call status is  - { this.state.status } 
      </div>
    );
  }
}

export default App;

В приведенном выше коде, если вы делаете вызов API из браузера, вы получаете правильный ответ

http://192.168.7.179:3002/

{"msg":"************  Server reply by user IUYT\\user1"}

Но из приложения реакции

LocalData is - local status
Server data is -
api call status is - 401

в окне F12

Failed to load resource: the server responded with a status of 401 (Unauthorized)

Пожалуйста, предложите изменения, необходимые для вызова из приложения реакции.

Answer 1

После исследования, наконец, вчера произошел прорыв. Поэтому я решил ответить на мой собственный вопрос.

5 баллов, чтобы изменить в моем примере.

1. Мы должны указать клиенту и серверу IP-адреса или домены для связи , Поэтому я изменил все упоминания происхождения вызовов API на их соответствующие IP-адреса. (Localhost -> 192 ...)

2. В cors нам нужно указать IP-адрес и номер порта в качестве источника

3. В вызовах на стороне клиента, если мы используем fetch, использовать учетные данные: include или, если ax ios использовать withCredentials: true
4. В сервере cors должен знать источник, поэтому включайте ваших клиентов ip с портом
5. Используйте express -ntlm или node-sspi в качестве windows аутентификатора.

Так что общее изменение в моем коде в примере:

На стороне сервера

    var corsOptions = {
    origin: 'http://192.168.7.179:3001',
    credentials: true,
    authenticate: true,
    authorization: true,
    optionsSuccessStatus: 200 
    }
    app.use(cors(corsOptions))

вместо

 app.use(cors())

и на стороне клиента добавьте 'credentials:' include '' в качестве параметра для получения.

change

fetch('http://192.168.7.179:3002/',{
      method: 'GET', // *GET, POST, PUT, DELETE, etc.
      headers: {
        'Content-Type': 'application/json',
      }
    })

до

fetch('http://192.168.7.179:3002/',{
      method: 'GET', // *GET, POST, PUT, DELETE, etc.
      credentials: 'include'
    })

Вот так, сначала запустите api, затем запустите, когда вы запустите ваше приложение реагирования, и вы получите приглашение для windows auth. Введите учетные данные домена и сервер получит результаты.

Шаги 1. В браузере проверьте, работает ли сервер -> http://192.168.7.179: 3002 /

{"msg ":" ************ Серверный ответ пользователя IUYT \ user1 "}

Регистрация http://localhost: 3001 / результат -

LocalData - локальный статус

Данные сервера - неизвестны

Состояние вызова API - не установлено

НО

В браузере проверьте, работает ли клиент -> http://192.168.7.179: 3001 /

LocalData is - локальный статус

Данные сервера - {" msg ":" ************ Серверный ответ пользователя IUYT \ user1 "}

Состояние вызова API - 200