appbaseio / reactivesearch

Search UI components for React and Vue
https://opensource.appbase.io/reactivesearch
Apache License 2.0
4.89k stars 468 forks source link

Connecting to local ElasticSearch #385

Closed sunnydaystar closed 6 years ago

sunnydaystar commented 6 years ago

Issue Type: bug?

I am using local elastic search cluster, but the app prompts the following error message as attached. I am not sure what is going on here.

screen shot 2018-06-01 at 9 25 25 am
metagrover commented 6 years ago

Can you paste your ReactiveBase component's code here including all the props you are using there?

siddharthlatest commented 6 years ago

@sunnydaystar Can you paste the package.json file that you are using? In particular, which version of ReactiveSearch are you using? Which browser environment (and version) are you using this in?

Can you also tell the version of the appbase-js lib?

sunnydaystar commented 6 years ago

copied from package.json "dependencies": { "@appbaseio/reactivesearch": "^2.6.5", "react": "^16.4.0", "react-dom": "^16.4.0", "react-scripts": "1.1.4", "ws": "^5.2.0" },

appbase-js@^3.0.0 browser: Chrome Version 66.0.3359.181 (Official Build) (64-bit)

More detailed error from console:

Uncaught TypeError: Cannot read property 'on' of undefined at wsRequest.init (websocket_request.js:84) at new wsRequest (websocket_request.js:42) at AppbaseClient.performWsRequest (index.js:150) at new streamSearchService (stream_search.js:40) at AppbaseClient.searchStream (index.js:205) at query.js:1 at Array.forEach () at query.js:1 at index.js:8 at dispatch (applyMiddleware.js:35) at component.js:1 at index.js:8 at Object.watchComponent (ReactiveList.js:563) at ReactiveList.setReact (ReactiveList.js:354) at ReactiveList.componentDidMount (ReactiveList.js:132) at commitLifeCycles (react-dom.development.js:14248) at commitAllLifeCycles (react-dom.development.js:15342) at HTMLUnknownElement.callCallback (react-dom.development.js:100) at Object.invokeGuardedCallbackDev (react-dom.development.js:138) at invokeGuardedCallback (react-dom.development.js:187) at commitRoot (react-dom.development.js:15481) at completeRoot (react-dom.development.js:16496) at performWorkOnRoot (react-dom.development.js:16440) at performWork (react-dom.development.js:16358) at performSyncWork (react-dom.development.js:16330) at requestWork (react-dom.development.js:16230) at scheduleWork$1 (react-dom.development.js:16096) at scheduleRootUpdate (react-dom.development.js:16663) at updateContainerAtExpirationTime (react-dom.development.js:16690) at updateContainer (react-dom.development.js:16717) at ReactRoot../node_modules/react-dom/cjs/react-dom.development.js.ReactRoot.render (react-dom.development.js:17000) at react-dom.development.js:17140 at unbatchedUpdates (react-dom.development.js:16557) at legacyRenderSubtreeIntoContainer (react-dom.development.js:17136) at Object.render (react-dom.development.js:17195) at Object../src/index.js (index.js:7) at webpack_require (bootstrap 96d578b5533090aed759:678) at fn (bootstrap 96d578b5533090aed759:88) at Object.0 (registerServiceWorker.js:117) at webpack_require (bootstrap 96d578b5533090aed759:678) at ./node_modules/@appbaseio/reactivecore/lib/actions/component.js.Object.defineProperty.value (bootstrap 96d578b5533090aed759:724) at bootstrap 96d578b5533090aed759:724 index.js:2178 The above error occurred in the component: in ReactiveList (created by Connect(ReactiveList)) in Connect(ReactiveList) (created by ResultCard) in ResultCard (at App.js:72) in div (at App.js:70) in div (at App.js:38) in div (created by Styled(div)) in Styled(div) (created by URLParamsProvider) in URLParamsProvider (created by Connect(URLParamsProvider)) in Connect(URLParamsProvider) (created by ReactiveBase) in Provider (created by ReactiveBase) in ThemeProvider (created by ReactiveBase) in ReactiveBase (at App.js:15) in App (at index.js:7)

React will try to recreate this component tree from scratch using the error boundary you provided, ReactiveBase.

metagrover commented 6 years ago

Is your stream prop set to true on reactivelist, it should be false. If that's the case, it should fix things for you. Streaming only works with appbase apps.

Also, we aren't compatible with react 16.4 yet. Can you try downgrading react and react-dom to 16.2 and see if that fixes things for you?

sunnydaystar commented 6 years ago

After removing the stream prop (default to be false) or setting stream to be false, the error complaint was gone, and now the filtering components can be correctly displayed. But the UI does not show any hits results from the , I have tested both react 16.4 and 16.2, same blank results.

<div className={"mainBar"}>

<ResultList componentId="SearchResult" dataField="subject" pagination={true} paginationAt="bottom" pages={5} sortBy="desc" size={100} loader="Loading Results.." showResultStats={true} onData={this.hitsList} (I defined hitsList and omitted) onResultStats={(total, took) => { return "found " + total + " results in " + took + "ms." }} react={{ and: ["mainSearch", "..."] (omitted here) }} />

metagrover commented 6 years ago

Seems like some issue at the query end. Check if hitsList is getting called? For further debugging, you can check the request query and response in the networks panel and see if everything is alright with the query there.

You should be able to find it as _msearch and with the query body title: { preference: 'SearchResult' } in your browser's networks panel.

sunnydaystar commented 6 years ago

Thank you, this is really helpful. I did not set the value of 'dataField' in ResultList correctly. According to the documentation, 'dataField' is used for sorting, but the one I used is not sortable. My purpose is to sort by relevance score, so after I set dataField="_score", it does show the results now, and the results seems to be sorted by relevance score by looking into the 'network' panel in the console.