Change cloudflare issue request flow #292
Conversation
Since there is no more query param, we will use only the body param to identify when the user want to issue tokens.
ppopth
force-pushed
the
change-cloudflare-issue-request-flow
branch
from
8dd58b9
to
4f6af15
Compare
src/background/index.ts
Outdated
| if (typeof chrome !== 'undefined') { | ||
| if (typeof browser !== 'undefined') { | ||
| return 'Firefox'; | ||
| } else { |
src/background/index.ts
Outdated
| } else { | ||
| return 'Chrome'; | ||
| } | ||
| } else { |
src/background/index.ts
Outdated
| @@ -57,10 +71,14 @@ chrome.webRequest.onBeforeRequest.addListener(handleBeforeRequest, { urls: ['<al | |||
| 'blocking', | |||
| ]); | |||
|
|
|||
| const extraInfos = ['requestHeaders', 'blocking']; | |||
| if (getBrowser() === 'Chrome') { | |||
There was a problem hiding this comment.
maybe we can have a const dicvtionary with browser
something like
const BROWSERS = {
CHROME: 'Chrome',
FIREFOX: 'Firefox',
EDGE: 'Edge',
} as const;
type BROWSERS = typeof BROWSERS[keyof typeof BROWSERS];There was a problem hiding this comment.
I changed to enum instead then.
There was a problem hiding this comment.
enum is not well built in typescript, and can rapidly makes code hard to read. Using a const map works better.
ppopth
force-pushed
the
change-cloudflare-issue-request-flow
branch
from
33f8db0
to
ca5c2aa
Compare
Chrome needs the extraHeaders flag in extraInfos to read the Referer header.
Previously we used axios to send an issuance request in handleBeforeRequest, but now we will send the request in handleBeforeSendHeaders because we need to read the Referer header first. After reading the Referer header, we extract the __cf_chl_tk query param in the Referer url and add the __cf_chl_f_tk query param with that token in the issuance request URL. We need a new "issueInfo" property to remember the request body we can read in handleBeforeRequest and then it will be read in handleBeforeSendHeaders so that in handleBeforeSendHeaders we will have both the body and the Referer header.
ppopth
force-pushed
the
change-cloudflare-issue-request-flow
branch
from
ca5c2aa
to
ac60db3
Compare
| expect(newIssueInfo).toBeNull(); | ||
|
|
||
| expect(issue.mock.calls.length).toBe(1); | ||
| expect(issue).toHaveBeenCalledWith('https://captcha.website/?__cf_chl_f_tk=token', { |
There was a problem hiding this comment.
Should we check that this request's Referer header will either not be present or contain the URL without the parameter?
There was a problem hiding this comment.
what request do you mean? issue is a method that will send a request using axios which cannot have a Referer header at all.
There was a problem hiding this comment.
I meant for the challenge solve request, and the Referer not being present is perfect. Thanks!
|
fwiw, with this PR things seem to work in Firefox Nightly. Thanks |
|
Does this fix the issue #291 or no? Just wondering since just happened to me the other day and I tught it was me since I reinstalled chrome. |
|
fwiw, you might want to compare the differences in implementation between this PR and PR #283 in the 2x commits made on 01/29/2022. The code here uses some very loose browser detection, whereas the code in the other PR uses feature detection.. which will support older versions of all supported browsers. For example, the code here will break in versions of Chrome < 72. |
Since we don't have any query param in the issue request any more, we remove the code which uses the query params to identify the issue request.
Currently we have a Referer header. We also need to use that header in the issue request as well. However such change requires a change in the code structure, as follows:
Previously we used axios to send an issuance request in handleBeforeRequest, but now we will send the request in
handleBeforeSendHeaders because we need to read the Referer header first.
After reading the Referer header, we extract the __cf_chl_tk query param in the Referer url and add the __cf_chl_f_tk query param with that token in the issuance request URL.
We need a new "issueInfo" property to remember the request body we can read in handleBeforeRequest and then it will be read in handleBeforeSendHeaders so that in handleBeforeSendHeaders we will have both the body and the Referer header.