diff options
author | Kristian Aune <kraune@verizonmedia.com> | 2022-08-18 13:22:21 +0200 |
---|---|---|
committer | Kristian Aune <kraune@verizonmedia.com> | 2022-08-18 13:22:21 +0200 |
commit | 08526e7f1e02c9f8d1063e6c64cdd662c091371e (patch) | |
tree | b14836ed591ba682d21e6065bb80dac5f965905b /client | |
parent | 0a104de7eb755bd37a62dcef759fbdaad8215e37 (diff) |
Add config steps to readme
Diffstat (limited to 'client')
-rw-r--r-- | client/js/app/README.md | 70 | ||||
-rw-r--r-- | client/js/app/img/querybuilder.png | bin | 0 -> 95609 bytes |
2 files changed, 57 insertions, 13 deletions
diff --git a/client/js/app/README.md b/client/js/app/README.md index ae6a8d1cc25..9dbce216224 100644 --- a/client/js/app/README.md +++ b/client/js/app/README.md @@ -3,17 +3,71 @@ ![Vespa logo](https://vespa.ai/assets/vespa-logo-color.png) # Vespa client +This app contains the **Query Builder** and the **Trace Visualizer**. -This app is work in progress. -It currently contains the **Query Builder** and the **Trace Visualizer**. +Install and start: + + $ nvm install --lts node # in case the installed node.js is too old + $ yarn install + $ yarn dev # then open link, like http://127.0.0.1:3000/ + +Alternatively, use Docker to start it without installing node: + + $ docker run -v `pwd`:/w -w /w --publish 3000:3000 node:16 sh -c 'yarn install && yarn dev --host' + +When started, open [http://127.0.0.1:3000/](http://127.0.0.1:3000/). + +*Troubleshooting:* Remove the generated `node_modules` directory and try again. +This is also relevant when switching between running local and in the container. ## Query Builder -The Query Builder is a tool for creating Vespa queries to send to a local backend. +The Query Builder is a tool for creating Vespa queries to send to a local Vespa application. The tool provides all of the options for query parameters from dropdowns. The input fields provide hints to what is the expected type of value. +![Query Builder](img/querybuilder.png) + +To access a Vespa endpoint from the Query Builder, +deploy with [CORS filters](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS). +To the query-serving container, add an `http` element in _services.xml_ like: +``` + <container id="default" version="1.0"> + + <http> + <filtering strict-mode="false"> + <request-chain id="request-chain"> + <filter id="com.yahoo.jdisc.http.filter.security.cors.CorsPreflightRequestFilter" + bundle="jdisc-security-filters"> + <config name="jdisc.http.filter.security.cors.cors-filter"> + <allowedUrls> + <item>*</item> + </allowedUrls> + </config> + </filter> + <binding>http://*/search/</binding> + </request-chain> + + <response-chain id="response-chain"> + <filter id="com.yahoo.jdisc.http.filter.security.cors.CorsResponseFilter" + bundle="jdisc-security-filters"> + <config name="jdisc.http.filter.security.cors.cors-filter"> + <allowedUrls> + <item>*</item> + </allowedUrls> + </config> + </filter> + <binding>http://*/search/</binding> + </response-chain> + </filtering> + + <server port="8080" id="default"/> + </http> +``` + +Deploy again, and (possibly) restart Vespa (internal port changes can be triggered by this). + ## Trace Visualizer @@ -45,13 +99,3 @@ Press the _JSON File_ button as shown in the image, and drag and drop the trace Then click on the newly added trace and see it displayed as a flame graph: ![Example Image](img/result.png) - - - -## Client install and start - - nvm install --lts node # in case your current node.js is too old - yarn install - yarn dev # then open link, like http://127.0.0.1:3000/ - -<!-- ToDo: publish a Docker image with all the clients ... --> diff --git a/client/js/app/img/querybuilder.png b/client/js/app/img/querybuilder.png Binary files differnew file mode 100644 index 00000000000..fa68f5bb82f --- /dev/null +++ b/client/js/app/img/querybuilder.png |