Реагирование полученного URL-адреса на стороне клиента не соответствует запрашиваемому URL-адресу на стороне сервера - PullRequest
Новая
       46

Реагирование полученного URL-адреса на стороне клиента не соответствует запрашиваемому URL-адресу на стороне сервера

1 голос
/ 07 октября 2019

Я работаю над небольшим приложением nodejs-express-реакции. Я отправляю запрос на стороне сервера API управления Google Analytics, а затем пытаюсь получить ответ со стороны клиента. Он не работает, так как код состояния выборки Status Code: 405. Однако я вижу, что выбранный URL-адрес не совпадает с запрошенным URL-адресом. Я не понимаю, что именно не так.

Я получаю /auth/google/callback, но в соответствии с информацией о сети и при поиске ошибки запрашиваемый URL-адрес https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A5000%2Fauth%2Fgoogle%2Fcallback&client_id=XXXXXXX-XXXXXXX.apps.googleusercontent.com

Вот полная ошибка: 

Access to fetch at 'https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A5000%2Fauth%2Fgoogle%2Fcallback&client_id=XXXXXXXX-XXXXXXXX.apps.googleusercontent.com' (redirected from 'http://localhost:5000/auth/google/callback') from origin 'http://localhost:5000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

У меня это на стороне сервера: 

app.get(
    "/auth/google",
    passport.authenticate("google", { scope: ['Profile','https://www.googleapis.com/auth/analytics.readonly'] })
);

app.get(
    "/auth/google/callback",
    passport.authenticate("google", { failureRedirect: "/error", session: false }),
    function(req, res) {
        var token = req.user.token;
    request('https://www.googleapis.com/analytics/v3/management/accounts?access_token=' + token,  
function (error, response, body) {
  console.log(JSON.parse(body).items);
res.send({data:JSON.parse(body).items})
});
    }
);

И на стороне клиента: 

  componentDidMount() {
    fetch('/auth/google/callback',    {
          method: 'GET',
          withCredentials: true,
          headers: {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*'},
          credentials: 'same-origin'
      })
      .then(res => res.json())
      .then(user => this.setState({ data: data }));
  }

Как мне структурировать свой узел / экспресс-бэкэнд, чтобы яможет заставить выборку стороны реакции работать правильно?

РЕДАКТИРОВАТЬ: Я добавил 'Access-Control-Allow-Origin': '*' в заголовок, но все еще получил ошибку.

1 Ответ

1 голос
/ 07 октября 2019

fetch('/auth/google/callback' требуется полный URL (например, https://localhost:8080/auth/google/callback)

РЕДАКТИРОВАТЬ 

headers: {
    'Content-Type': 'application/json', 
    'Access-Control-Allow-Origin': '*'
}
...