2017-02-10 16 views
0

Я совершенно новый для Sinatra и React JS, поэтому я просто хотел сделать GET-вызов с моего сайта React на сервере Sinatra, чтобы отобразить простой текст.React JS: нет ответа от сервера Sinatra с вызовом извлечения

Синатра Сервер:

require 'sinatra' 

set :root, 'lib/app' 

before do 
    response.headers['Access-Control-Allow-Origin'] = 'http://localhost:8080' 
    response.headers['Accept'] = 'gridoperator' 
    response.headers['Content-Type'] = 'gridoperator' 
end 

get '/gridoperator' do 
    'Hello root gridoperator' 
end 

Реагировать JS:

var Gridoperator_div = React.createClass({ 

    getInitialState: function(){ 
    return({ 
     call_name: 'initial' 
    }); 
    }, 

    componentDidMount: function(){ 

    fetch('http://localhost:4567/gridoperator', { 
     method: 'get' 
    }).then(response => response.text()) 
    .then(
     function(text){ 
      this.setState({ 
      call_name: text 
      }) 
    }); 

    }, 

    componentWillUnmount: function(){ 
    }, 

    render: function() { 
    return(
     <h1>Hello {this.state.call_name}!</h1> 
    ) 
    } 

}); 

ReactDOM.render(<Gridoperator_div/>, document.getElementById('gridoperator')); 

Синатра Сервер тестировался с REST и должен работать.

К сожалению, если я хочу, чтобы соединиться с моего веб-сайта React, единственное, что я могу читать это:

enter image description here

В журнал подключение моего React сайта признается:

::1 - - [10/Feb/2017:21:28:00 +0100] "GET /gridoperator HTTP/1.1" 200 23 0.0000 
::1 - - [10/Feb/2017:21:28:00 Mitteleuropõische Zeit] "GET /gridoperator HTTP/1.1" 200 23 
http://localhost:8080/ -> /gridoperator 

Я действительно надеюсь, что кто-то может мне помочь, поэтому спасибо в Advance!

Фосса

Редактировать

Я забыл о чем-то, если я начну свой веб-сайт, он компилирует с предупреждениями:

WARNING in ./~/encoding/lib/iconv-loader.js 
Critical dependencies: 
9:12-34 the request of a dependency is an expression 
@ ./~/encoding/lib/iconv-loader.js 9:12-34 
webpack: Compiled with warnings. 
+1

Вы искали в браузере javascript console для ошибок? –

ответ

1

Не видя более это трудно сказать, что точная проблема есть, но если бы я должен был догадаться, я бы сказал, что это, вероятно, что-то с предполетью CORS, так как вы так мало вернулись. Это также объясняет, почему статический контент может быть загружен.

Похоже, вы вручную раскручиваете свою собственную логику с помощью response.headers['Access-Control-Allow-Origin'] = 'http://localhost:8080'. Вы не устанавливаете все заголовки CORS, и поэтому запросы не проходят. См. Mozilla documentation для получения дополнительной информации.

Ручная работа такого рода логика - почти всегда плохая идея. Выезд https://github.com/cyu/rack-cors или https://github.com/britg/sinatra-cross_origin. Я рекомендую первый. Его легко настроить, и как только вы его настроите, вы можете более или менее забыть об этом.