You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by bz...@apache.org on 2021/09/22 03:20:20 UTC
[apisix-dashboard] branch master updated: feat(plugin): allowing
referer-restriction to dynamically adapt to the BE rules (#2001)
This is an automated email from the ASF dual-hosted git repository.
bzp2010 pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new e1130f4 feat(plugin): allowing referer-restriction to dynamically adapt to the BE rules (#2001)
e1130f4 is described below
commit e1130f446644d841220ef4f54f693c7758ca811f
Author: wmdmomo <43...@users.noreply.github.com>
AuthorDate: Wed Sep 22 11:20:15 2021 +0800
feat(plugin): allowing referer-restriction to dynamically adapt to the BE rules (#2001)
* feat(plugin): add basic
* feat(plugin): fix UI referer-restriction
* feat(plugin): fix variable name
* feat(plugin): add test case for referer plugin
---
...ate-route-with-referer-restriction-form.spec.js | 21 ++++++++++-
web/src/components/Plugin/UI/plugin.tsx | 2 +-
.../components/Plugin/UI/referer-restriction.tsx | 43 ++++++++++++----------
3 files changed, 43 insertions(+), 23 deletions(-)
diff --git a/web/cypress/integration/route/create-route-with-referer-restriction-form.spec.js b/web/cypress/integration/route/create-route-with-referer-restriction-form.spec.js
index 9fa5d02..f15ff2b 100644
--- a/web/cypress/integration/route/create-route-with-referer-restriction-form.spec.js
+++ b/web/cypress/integration/route/create-route-with-referer-restriction-form.spec.js
@@ -33,6 +33,9 @@ context('Create and delete route with referer-restriction form', () => {
deleteAlert: '.ant-modal-body',
whitlist: '#whitelist_0',
alert: '.ant-form-item-explain-error [role=alert]',
+ newAdd: '.ant-btn-dashed',
+ whitlist_1: '#whitelist_1',
+ passSwitcher: '#bypass_missing',
};
const data = {
@@ -41,6 +44,9 @@ context('Create and delete route with referer-restriction form', () => {
weight: 1,
deleteRouteSuccess: 'Delete Route Successfully',
submitSuccess: 'Submit Successfully',
+ wrongIp: 'qq@',
+ correctIp: 'apisix-dashboard_1.com',
+ activeClass: 'ant-switch-checked',
};
beforeEach(() => {
@@ -75,7 +81,8 @@ context('Create and delete route with referer-restriction form', () => {
.should('be.visible')
.within(() => {
cy.get(selector.disabledSwitcher).click();
- cy.get(selector.checkedSwitcher).should('exist');
+ cy.get(selector.disabledSwitcher).should('have.class', data.activeClass);
+ cy.get(selector.passSwitcher).should('not.have.class', data.activeClass);
});
// config referer-restriction form without whitelist
@@ -90,8 +97,18 @@ context('Create and delete route with referer-restriction form', () => {
cy.get(selector.notificationCloseIcon).click();
// config referer-restriction form with whitelist
- cy.get(selector.whitlist).type('127.0.0.1');
+ cy.get(selector.whitlist).type(data.wrongIp);
+ cy.get(selector.whitlist).closest('div').next().children('span').should('not.exist');
+ cy.get(selector.alert).should('exist');
+ cy.get(selector.whitlist).clear().type(data.correctIp);
cy.get(selector.alert).should('not.exist');
+
+ cy.get(selector.newAdd).click();
+ cy.get(selector.whitlist).closest('div').next().children('span').should('exist');
+ cy.get(selector.whitlist_1).closest('div').next().children('span').should('exist');
+ cy.get(selector.whitlist_1).type(data.correctIp);
+ cy.get(selector.alert).should('not.exist');
+
cy.get(selector.disabledSwitcher).click();
cy.get(selector.drawer).within(() => {
cy.contains('Submit').click({
diff --git a/web/src/components/Plugin/UI/plugin.tsx b/web/src/components/Plugin/UI/plugin.tsx
index 2ed802e..abac43a 100644
--- a/web/src/components/Plugin/UI/plugin.tsx
+++ b/web/src/components/Plugin/UI/plugin.tsx
@@ -74,7 +74,7 @@ export const PluginForm: React.FC<Props> = ({ name, schema, renderForm, form })
case 'limit-conn':
return <LimitConn form={form} schema={schema} />;
case 'referer-restriction':
- return <RefererRestriction form={form} />;
+ return <RefererRestriction form={form} schema={schema} />
default:
return null;
}
diff --git a/web/src/components/Plugin/UI/referer-restriction.tsx b/web/src/components/Plugin/UI/referer-restriction.tsx
index 3083ac8..ded1728 100644
--- a/web/src/components/Plugin/UI/referer-restriction.tsx
+++ b/web/src/components/Plugin/UI/referer-restriction.tsx
@@ -22,6 +22,7 @@ import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
type Props = {
form: FormInstance;
+ schema: Record<string, any> | undefined;
};
const FORM_ITEM_LAYOUT = {
@@ -46,10 +47,17 @@ const removeBtnStyle = {
alignItems: 'center',
};
-const RefererRestriction: React.FC<Props> = ({ form }) => {
- const { formatMessage } = useIntl();
+const RefererRestriction: React.FC<Props> = ({ form, schema }) => {
+ const { formatMessage } = useIntl()
+ const properties = schema?.properties
+ const allowListMinLength = properties.whitelist.minItems
+ const whiteInit = Array(allowListMinLength).join('.').split('.')
return (
- <Form form={form} {...FORM_ITEM_LAYOUT} initialValues={{ whitelist: [''] }}>
+ <Form
+ form={form}
+ {...FORM_ITEM_LAYOUT}
+ initialValues={{ whitelist: whiteInit }}
+ >
<Form.List name="whitelist">
{(fields, { add, remove }) => {
return (
@@ -73,33 +81,28 @@ const RefererRestriction: React.FC<Props> = ({ form }) => {
validateTrigger={['onChange', 'onBlur', 'onClick']}
noStyle
required
- rules={[
- {
- message: formatMessage({
- id: 'page.route.form.itemRulesPatternMessage.domain',
- }),
- pattern: new RegExp(/^\*?[0-9a-zA-Z-._]+$/, 'g'),
- },
- {
- required: true,
- message: `${formatMessage({
- id: 'component.global.pleaseEnter',
- })} whitelist`,
- },
- ]}
+ rules={[{
+ message: formatMessage({
+ id: 'page.route.form.itemRulesPatternMessage.domain',
+ }),
+ pattern: new RegExp(`${properties.whitelist.items.pattern}`, 'g')
+ }, {
+ required: true,
+ message: `${formatMessage({ id: 'component.global.pleaseEnter' })} whitelist`
+ }]}
>
<Input />
</Form.Item>
</Col>
<Col style={{ ...removeBtnStyle, marginLeft: -10 }}>
- {fields.length > 1 ? (
+ {fields.length > allowListMinLength &&
<MinusCircleOutlined
className="dynamic-delete-button"
onClick={() => {
remove(field.name);
}}
/>
- ) : null}
+ }
</Col>
</Row>
))}
@@ -129,7 +132,7 @@ const RefererRestriction: React.FC<Props> = ({ form }) => {
})}
valuePropName="checked"
>
- <Switch />
+ <Switch defaultChecked={properties.bypass_missing.default} />
</Form.Item>
</Form>
);