From d4a63aca643e7e07358b689e8633080460ace0ac Mon Sep 17 00:00:00 2001 From: Beto Muniz Date: Wed, 17 Aug 2022 09:40:21 -0300 Subject: [PATCH] InfluxDB: Remove browser ('direct' access) mode. (#53529) * Remove InfluxDB browser ('direct' access) mode. * Improve text usage and clarity --- docs/sources/datasources/influxdb/_index.md | 26 +++++++++---------- .../influxdb/components/ConfigEditor.tsx | 10 ++++--- .../__snapshots__/ConfigEditor.test.tsx.snap | 8 +++--- .../plugins/datasource/influxdb/constants.ts | 2 ++ .../plugins/datasource/influxdb/datasource.ts | 7 +++++ .../influxdb/specs/datasource.test.ts | 21 +++++++++++++++ 6 files changed, 53 insertions(+), 21 deletions(-) create mode 100644 public/app/plugins/datasource/influxdb/constants.ts diff --git a/docs/sources/datasources/influxdb/_index.md b/docs/sources/datasources/influxdb/_index.md index 2c1b599ebc5..ed1c8d41323 100644 --- a/docs/sources/datasources/influxdb/_index.md +++ b/docs/sources/datasources/influxdb/_index.md @@ -33,19 +33,19 @@ InfluxDB data source options differ depending on which [query language](#query-l These options apply if you are using the InfluxQL query language. If you are using Flux, refer to [Flux support in Grafana]({{< relref "influxdb-flux/" >}}). -| Name | Description | -| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| `Name` | The data source name. This is how you refer to the data source in panels and queries. We recommend something like `InfluxDB-InfluxQL`. | -| `Default` | Default data source means that it will be pre-selected for new panels. | -| `URL` | The HTTP protocol, IP address and port of your InfluxDB API. InfluxDB API port is by default 8086. | -| `Access` | Server (default) = URL needs to be accessible from the Grafana backend/server, Browser = URL needs to be accessible from the browser. **Note**: Browser (direct) access is deprecated and will be removed in a future release. | -| `Allowed cookies` | Cookies that will be forwarded to the data source. All other cookies will be deleted. | -| `Database` | The ID of the bucket you want to query from, copied from the [Buckets page](https://docs.influxdata.com/influxdb/v2.0/organizations/buckets/view-buckets/) of the InfluxDB UI. | -| `User` | The username you use to sign into InfluxDB. | -| `Password` | The token you use to query the bucket above, copied from the [Tokens page](https://docs.influxdata.com/influxdb/v2.0/security/tokens/view-tokens/) of the InfluxDB UI. | -| `HTTP mode` | How to query the database (`GET` or `POST` HTTP verb). The `POST` verb allows heavy queries that would return an error using the `GET` verb. Default is `GET`. | -| `Min time interval` | (Optional) Refer to [Min time interval]({{< relref "#min-time-interval" >}}). | -| `Max series` | (Optional) Limits the number of series/tables that Grafana processes. Lower this number to prevent abuse, and increase it if you have lots of small time series and not all are shown. Defaults to 1000. | +| Name | Description | +| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `Name` | The data source name. This is how you refer to the data source in panels and queries. We recommend something like `InfluxDB-InfluxQL`. | +| `Default` | Default data source means that it will be pre-selected for new panels. | +| `URL` | The HTTP protocol, IP address and port of your InfluxDB API. InfluxDB API port is by default 8086. | +| `Access` | Direct browser access has been deprecated. Use “Server (default)” or the datasource won’t function. | +| `Allowed cookies` | Cookies that will be forwarded to the data source. All other cookies will be deleted. | +| `Database` | The ID of the bucket you want to query from, copied from the [Buckets page](https://docs.influxdata.com/influxdb/v2.0/organizations/buckets/view-buckets/) of the InfluxDB UI. | +| `User` | The username you use to sign into InfluxDB. | +| `Password` | The token you use to query the bucket above, copied from the [Tokens page](https://docs.influxdata.com/influxdb/v2.0/security/tokens/view-tokens/) of the InfluxDB UI. | +| `HTTP mode` | How to query the database (`GET` or `POST` HTTP verb). The `POST` verb allows heavy queries that would return an error using the `GET` verb. Default is `GET`. | +| `Min time interval` | (Optional) Refer to [Min time interval]({{< relref "#min-time-interval" >}}). | +| `Max series` | (Optional) Limits the number of series/tables that Grafana processes. Lower this number to prevent abuse, and increase it if you have lots of small time series and not all are shown. Defaults to 1000. | ### Flux diff --git a/public/app/plugins/datasource/influxdb/components/ConfigEditor.tsx b/public/app/plugins/datasource/influxdb/components/ConfigEditor.tsx index 0375b1be950..b1b431cd8f4 100644 --- a/public/app/plugins/datasource/influxdb/components/ConfigEditor.tsx +++ b/public/app/plugins/datasource/influxdb/components/ConfigEditor.tsx @@ -14,6 +14,7 @@ import { import { Alert, DataSourceHttpSettings, InfoBox, InlineField, InlineFormLabel, LegacyForms, Select } from '@grafana/ui'; const { Input, SecretFormField } = LegacyForms; +import { BROWSER_MODE_DISABLED_MESSAGE } from '../constants'; import { InfluxOptions, InfluxSecureJsonData, InfluxVersion } from '../types'; const httpModes = [ @@ -270,6 +271,7 @@ export class ConfigEditor extends PureComponent { render() { const { options, onOptionsChange } = this.props; + const isDirectAccess = options.access === 'direct'; return ( <> @@ -301,14 +303,14 @@ export class ConfigEditor extends PureComponent { )} - {options.access === 'direct' && ( - - Browser access mode in the InfluxDB datasource is deprecated and will be removed in a future release. + {isDirectAccess && ( + + {BROWSER_MODE_DISABLED_MESSAGE} )}
, @@ -147,6 +149,7 @@ export default class InfluxDatasource extends DataSourceWithBackend): Observable { + if (!this.isProxyAccess) { + const error = new Error(BROWSER_MODE_DISABLED_MESSAGE); + return throwError(() => error); + } // for not-flux queries we call `this.classicQuery`, and that // handles the is-hidden situation. // for the flux-case, we do the filtering here diff --git a/public/app/plugins/datasource/influxdb/specs/datasource.test.ts b/public/app/plugins/datasource/influxdb/specs/datasource.test.ts index f5db9a9dec2..ba8155d472b 100644 --- a/public/app/plugins/datasource/influxdb/specs/datasource.test.ts +++ b/public/app/plugins/datasource/influxdb/specs/datasource.test.ts @@ -6,6 +6,7 @@ import { FetchResponse } from '@grafana/runtime'; import config from 'app/core/config'; import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__ +import { BROWSER_MODE_DISABLED_MESSAGE } from '../constants'; import InfluxDatasource from '../datasource'; //@ts-ignore @@ -26,6 +27,7 @@ describe('InfluxDataSource', () => { beforeEach(() => { jest.clearAllMocks(); ctx.instanceSettings.url = '/api/datasources/proxy/1'; + ctx.instanceSettings.access = 'proxy'; ctx.ds = new InfluxDatasource(ctx.instanceSettings, templateSrv); }); @@ -124,6 +126,25 @@ describe('InfluxDataSource', () => { }); }); + describe('When getting a request after issuing a query using outdated Browser Mode', () => { + beforeEach(() => { + jest.clearAllMocks(); + ctx.instanceSettings.url = '/api/datasources/proxy/1'; + ctx.instanceSettings.access = 'direct'; + ctx.ds = new InfluxDatasource(ctx.instanceSettings, templateSrv); + }); + + it('throws an error', async () => { + try { + await lastValueFrom(ctx.ds.query({})); + } catch (err) { + if (err instanceof Error) { + expect(err.message).toBe(BROWSER_MODE_DISABLED_MESSAGE); + } + } + }); + }); + describe('InfluxDataSource in POST query mode', () => { const ctx: any = { instanceSettings: { url: 'url', name: 'influxDb', jsonData: { httpMode: 'POST' } },