Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: Add Flagsmith signature header when testing webhook. #3666

Merged

Conversation

shubham-padia
Copy link
Contributor

@shubham-padia shubham-padia commented Mar 25, 2024

Fixes #2786.

Thanks for submitting a PR! Please check the boxes below:

  • I have run pre-commit to check linting
  • I have added information to docs/ if required so people know about the feature!
    No need to add info to the docs
  • I have filled in the "Changes" section below?
  • I have filled in the "How did you test this code" section below?
  • I have used a Conventional Commit title for this Pull Request

Changes

We are trying to create the same signature as the webhook in the python code. This commit assumes that the python code will use the same approach to create signature for long term.

We are relying on notes here to make sure that both frontend and backend are implementing the same signature function, which is not the perfect approach. An alternative would be a backend endpoint to test the webhook so that the implementation always remains the same, but not sure if its overkill at this point or not. Note to maintainers: Please let me know what you think about both the approaches and what makes sense in this case since you might know best how the users might use this feature and how often the sign function might change.

I'm also modifying the string on the frontend to be the exact same as the json.dumps output on the python side, so that the sign value is the same on both side.

How did you test this code?

  • Created a webhook on the project settings, set the secret to test123 and a dead example URL and noted down the header value: X-Flagsmith-Signature: 1907ef6a4c7a3e0010504757728d8dbbf3980247e3e2c5835757b80e9fd1f085

Screenshot 2024-03-26 at 12 01 27 AM

  • You can check that the replit here will give the same signature. I also generated it in test_unit_webhooks.py by modifying the code to use the same example as frontend just to make sure there is no different when using the replit, but didn't commit the code since the current test is sufficient enough.
    Screenshot 2024-03-26 at 12 07 32 AM

I have not tested this on a real webhook, just a dead link, let me know if I need to test it on a real webhook, would be nice if there's an existing test endpoint for that.
I have not added any tests on the frontend side, since I could only find e2e tests, please let me know if tests needed to be added on frontend for this change.

NOTE: I found a lot of unrelated errors to my changes when running npm run lint:fix, I commited the changes related to my PR and ignored the rest, let me know what was the ideal approach here, same with pre-commit

Copy link

vercel bot commented Mar 25, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 10, 2024 3:16pm
flagsmith-frontend-preview ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 10, 2024 3:16pm
flagsmith-frontend-staging ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 10, 2024 3:16pm

Copy link

vercel bot commented Mar 25, 2024

@shubham-padia is attempting to deploy a commit to the Flagsmith Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions bot added front-end Issue related to the React Front End Dashboard api Issue related to the REST API labels Mar 25, 2024
@shubham-padia shubham-padia force-pushed the fix/webhook-secret-signature-frontend branch from a52cb1e to 446e372 Compare March 25, 2024 18:47
@shubham-padia shubham-padia marked this pull request as ready for review March 25, 2024 18:50
@shubham-padia shubham-padia changed the title Draft: fix: Add Flagsmith signature header when testing webhook. fix: Add Flagsmith signature header when testing webhook. Mar 25, 2024
const [error, setError] = useState<string | null>(null)
const [loading, setLoading] = useState(false)
const [success, setSuccess] = useState(false)
const [sign, setSign] = useState('')
getSignature(json, secret, setSign)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think rather than re-evaluating this each render we may as well just do this on submit

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const submit = () => {
setError(null)
setLoading(true)
setSuccess(false)
data
.post(webhook, JSON.parse(json), null)
.post(webhook, JSON.parse(json), headers)
Copy link
Member

@kyle-ssg kyle-ssg Mar 25, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

RE above comment, this could be something more like

getSignature().then((sign)=>{
 const headers = {
    'X-Flagsmith-Signature': sign,
  }
 return data.post(...)
}).then

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Member

@kyle-ssg kyle-ssg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great from a FE perspective, I'll handover to another member of the team from a backend perspective. Thank you very much for this!

Copy link
Contributor

github-actions bot commented Mar 28, 2024

Uffizzi Preview deployment-49072 was deleted.

@shubham-padia
Copy link
Contributor Author

Bump for review

api/core/signing.py Outdated Show resolved Hide resolved
@shubham-padia shubham-padia force-pushed the fix/webhook-secret-signature-frontend branch 2 times, most recently from 5c6bef7 to 50c30ea Compare April 2, 2024 15:03
api/webhooks/webhooks.py Outdated Show resolved Hide resolved
api/webhooks/webhooks.py Outdated Show resolved Hide resolved
@matthewelwell
Copy link
Contributor

@shubham-padia @khvn26 looks like we've got CI failures here now, can we fix?

@codecov-commenter
Copy link

codecov-commenter commented Apr 3, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 95.90%. Comparing base (eca05ca) to head (15fd590).
Report is 26 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #3666      +/-   ##
==========================================
+ Coverage   95.89%   95.90%   +0.01%     
==========================================
  Files        1101     1102       +1     
  Lines       34568    34703     +135     
==========================================
+ Hits        33149    33283     +134     
- Misses       1419     1420       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Fixes Flagsmith#2786.
We are trying to create the same signature as the webhook
in the python code. This commit assumes that the python code
will use the same approach to create signature for long term.
@shubham-padia
Copy link
Contributor Author

@shubham-padia @khvn26 looks like we've got CI failures here now, can we fix?

@kyle-ssg fixed!

@novakzaballa novakzaballa removed their request for review April 4, 2024 13:37
@shubham-padia
Copy link
Contributor Author

Just checking if there are any blockers to getting this merged :) !

@matthewelwell matthewelwell removed their request for review April 10, 2024 12:41
}

const signPayload = async (body: string, secret: string): Promise<string> => {
if(!secret) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a note, added this as it was rejecting attempting to sign with an empty secret. Instead it just resolves with '' in this case.

@kyle-ssg kyle-ssg added this pull request to the merge queue Apr 11, 2024
Merged via the queue into Flagsmith:main with commit c950875 Apr 11, 2024
23 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
api Issue related to the REST API front-end Issue related to the React Front End Dashboard
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Include x-flagsmith-signature header when webhook is triggered by test webhook widget
6 participants