響應式搜索、ES 和 CORS

Question

我計划使用 AWS ES 服務來托管我的 Elasticsearch。 我設置為描述代理這里的Express服務器等等等等。

var proxy = require('express-http-proxy');
...
app.use('/', index);
app.use('/users', users);
app.use('/search', proxy('localhost:9200'));

它有效。 設置代理非常簡單明了。 以及它在使用 AWS ES 時 ReactiveSearch 推薦的內容。 我可以導航到 localhost:5000/search 並看到 ES 已啟動並正在運行（顯示默認歡迎消息）。

但是，當我啟動 React 前端（create-react-app）並嘗試提交查詢時，我收到此錯誤

Failed to load http://localhost:9200/query-index/_msearch?: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

我相信我在我的 React 組件中為本地 ES 服務器設置了正確的 ReactiveSearch 設置：

<ReactiveBase
              app="query-index"
              url="http://localhost:9200"
              >

其中 query-index 是我的 ES 索引，url 是本地 ES 服務器

我有本地 ES 實例的這些 CORS 設置

http.cors.enabled: true
http.cors.allow-credentials: true
# http.cors.allow-origin: "http://localhost:3000"
# http.cors.allow-origin: /https?:\/\/localhost(:[0-9]+)?/
http.cors.allow-origin: /https?:\/\/(localhost)?(127.0.0.1)?(:[0-9]+)?/
# #http.cors.allow.origin: "*" # this does not work with ReactiveBase
# #http.cors.allow-origin: /https?:\/\/(www.)?elastic.co/
# http.cors.allow-methods: OPTIONS, HEAD, GET, POST, PUT, DELETE
http.cors.allow-headers: X-Requested-With, Content-Type, Content-Length, Authorization, Accept

然后我相信我為我的 Express 服務器設置了正確的 CORS 設置。

var cors = require('cors');
...
var corsOptions = {
  origin: 'http://localhost:9200',
  optionsSuccessStatus: 200
};
...
app.options('/search', cors()); //should enable pre-flight for search routes
app.use('/search', cors(corsOptions), function(req, res, next) {
  res.header('Access-Control-Allow-Origin', 'http://localhost:3000');
  res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
  res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Length, Content-Type, Authorization, Accept');
  res.header('Access-Control-Allow-Credentials', 'true');
  next();
});

當涉及到 CORS 設置時，我做錯了什么。 是 CORS 路由設置還是 CORS ES 設置？

我計划將 AWS ES 用於生產，但我只想先在本地進行一些測試，似乎無法為 React 和 ReactiveSearch 設置正確的 CORS 設置。

Answer 1

似乎在 ES cors 配置中，您將https與 localhost 一起使用，這可能會產生錯誤

http.cors.allow-origin: /https?://(localhost)?(127.0.0.1)?(:[0-9]+)?/

同樣在 Express 應用程序的 cors 配置中，前端是否為localhost:3000 ？ 如果是這樣，您將前端列入白名單，但情況可能並非如此。

您可以在聲明任何路線之前簡單地使用app.use(cors()) ，然后按照此處所述為您的搜索路線使用代理，稍作更改，

app.use('/search', proxy(options));

https://github.com/appbaseio-apps/reactivesearch-proxy-server/blob/master/index.js#L46