Closed irwinwilliams closed 3 years ago
I’m unable to reproduce this. Can you please provide more details?
Sure, I noticed afterward that it worked on the .azurestaticwebsites.net site, but not in my local dev env. Here's a request handling it fine: Same request with a query string:
Thanks. We’ll transfer this issue to the CLI repo and address is there.
Ignore query string when serving static content. (Dev server and API calls should proxy the http request as-is, including query string)
Also need to print a disclaimer that the CLI is an emulator and might not match the cloud environment 100%. Will create a separate issue to track.
@anthonychu It looks like we already ignore query string when serving static content (and our e2e tests are passing). We will probably need more details on how to reproduce this issue.
@rwinwilliams are you able to share your app so I can try it locally? Or, can you run the SWA CLI using the --verbose=silly
and copy/paste the logs of the request that leads to the 404 page? Thank you.
FYI, the debugging logs might look like the following:
@anthonychu It looks like we already ignore query string when serving static content (and our e2e tests are passing). We will probably need more details on how to reproduce this issue.
@rwinwilliams are you able to share your app so I can try it locally? Or, can you run the SWA CLI using the
--verbose=silly
and copy/paste the logs of the request that leads to the 404 page? Thank you.FYI, the debugging logs might look like the following:
debug logs using --verbose=silly
Hey @manekinekko, here's the output when --verbose=silly
is on:
@irwinwilliams I can't seem to reproduce this either. Looking at the log messages, it looks like this might be an older version of the CLI. Can you check the version of the CLI? Ensure you're running 0.6.0.
swa --version
My swa --version output was 0.4.0. So I ran, "npm install -g @azure/static-web-apps-cli" Got it up to 0.6.0. Same issue. Restarted vscode. No change. Going off to restart. Edit: after restart, still no joy.
If you look at the logs below, you'll see this:
[swa] checking storage content
[swa] finding file for request
[swa] - requestPath: /app/project/?test=1/index.html
[swa] - filePath: C:\Development\del\[TestApp]\app\project\?test=1\index.html
[swa] - exists: false
Which suggests the server is making the query string a part of the file search.
Here's the log output:
Please share the app you’re testing with and repro steps.
It’s possible this is an issue on Windows. We’ll test this on a Windows machine.
It's a private repo, @anthonychu, I can add you/your team.
@irwinwilliams are you able to print the version of the SWA installed on your system, using the command swa -v
.
Thank you.
@manekinekko, sure, it's now 0.6.0.
Oh! Are you still having the same issue with 0.6.0?
Hey, @manekinekko, yep.
Thank you @irwinwilliams !
@anthonychu I confirm I am not seeing this issue on Macos. So this might be Windows-related.
Hello @irwinwilliams
Could please confirm if there is the following navigationFallback
setting in your staticwebapp.config.json
? I cannot see navigationFallback
setting in your log.
If there isn't, please add this and try again.
"navigationFallback": {
"rewrite": "/index.html",
"exclude": ["*.{txt}"]
},
As far as I investigated, it seems that the query string for index.html
cannot be handled appropriately if there is no this setting.
And this setting is only for navigation to index.html
.
@manekinekko Do we have any way to handle query strings in any pages without the navigationFallback
setting?
By comparing between manekinekko's log and irwinwilliams' log, some different points were found.
Request path
/folder/index.html
in manekinekko's log/index.html
or /
in irwinwilliams' logRoute matching result In manekinekko's log, there are following lines.
[swa] turning glob expression into valid RegExp
[swa] - glob: /folder/*.{html,xml}
[swa] - regexp: /^\/folder\/.*(html|xml)$/
[swa] - isMatch: true
[swa] - doesRequestPathMatchWildcardRoute: true
This is caused by the following route setting. https://github.com/Azure/static-web-apps-cli/blob/34f96cd9475b38168cd4edd1ec9ade3d7b6728ea/cypress/fixtures/static/staticwebapp.config.json#L33-L36
@manekinekko Could you please confirm if this issue was reproduced after removing the route setting from your staticwebapp.config.json
?
And @irwinwilliams Could you please confirm if this issue was mitigated by adding the following route setting into your staticwebapp.config.json
?
{
"route": "/*.{html,xml}",
"rewrite": "/"
},
Thanks
Thank you so much @horihiro for taking the time to investigate this. Please note that the logs I shared are those of our E2E application and do not reflect @irwinwilliams configuration. I simply shared my logs as an example.
Also, I don't think the following rule is necessary:
{
"route": "/*.{html,xml}",
"rewrite": "/"
},
Because this rule will rewrite ALL *.html
and *.xml
(eg: /foo/bar/baz.html
) requests to /index.html
, which can be problematic.
@irwinwilliams are you able to share your staticwebapp.config.json
if you are using one, so @horihiro and I can give investigate the issue?
Do we have any way to handle query strings in any pages without the navigationFallback setting?
@horihiro for static content, query params are ignored by the CLI. See: https://github.com/Azure/static-web-apps-cli/blob/0abec9309688e991400b38d21d973f68145033ce/src/msha/middlewares/request.middleware.ts#L266-L269
Thank you!
for static content, query params are ignored by the CLI. @manekinekko do you mean that the CLI doesn't support query parameters on static content?
I also confirmed the access to /folder/index.html?query=value
returns 404 if the following route setting is removed from staticwebapp.configjson
in this.
{
"route": "/folder/*.{html,xml}",
"rewrite": "/folder/"
}
/folder/index.html?query=value
-> 404 Not Found/folder/index.html
-> 200 OKIs this the expected behavior of the CLI?
# I use the dev container for this investigation, so this might not be the Windows-specific issue.
@horihiro I am confused because I can't reproduce this issue. As you can see from the screenshot and logs, the file /folder/index.html?query=value
is served as expected!
Thanks @manekinekko
It seems that your config file still contains the following route setting according to the following log.
{
"route": "/folder/*.{html,xml}",
"rewrite": "/folder/"
}
[swa] turning glob expression into valid RegExp
[swa] - glob: /folder/*.{html,xml}
[swa] - regexp: /^\/folder\/.*(html|xml)$/
[swa] - isMatch: true
Please remove this route setting at first from staticwebapp.config.json
and try again if you can.
In my env this issue can be reproduced when removing the setting and accessing /folder/index.html?key=value
.
@horihiro your analysis was correct. When the matching route is absent, then isMatchingRewriteRoute
becomes undefined
and the rest of the logic fails. We will fix that soon.
Thank you again for your feedback 🙌🏼
@irwinwilliams this should be resolved. Please reopen this thread if you still have the issue.
Hey, very cool @manekinekko, I see it was merged to main, how do I get access to it via npm? (on there it says last published 8 days ago)
👋 @irwinwilliams Did you manage to get it working on 0.6.1?
@manekinekko I've been struggling to get vite's dev server to run nicely on swa, and it turns out it's because it's ignoring query params. I'm on swa-cli v0.6.1.
Relevant part of the log: The App.vue file is being requested with query params to fetch the styles for the component, but it looks like it's stripped out when swa proxies it?
--------------------------------------------------------
[swa] ------------------- processing route -------------------
[swa] --------------------------------------------------------
[swa] processing /src/components/HelloWorld.vue
[swa] checking for matching route
[swa] checking auth request
[swa] - not an auth request
[swa] checking function request
[swa] - not a function request
[swa] checking HTTP method: GET
[swa] - method is valid (allow-list: GET,HEAD,OPTIONS)
[swa] checking for query params
[swa] checking rewrite auth login request
[swa] checking rewrite auth logout request
[swa] checking authorizations for route
[swa] - no matching rule
[swa] - access authorized
[swa] using userConfig
[swa] - userConfig: <undefined>
[swa] checking storage content
[swa] finding file for request
[swa] - filePathFromRequest: /src/components/HelloWorld.vue
[swa] checking mime types
[swa] - extension: .vue
[swa] - found: application/octet-stream
[swa] constructing headers
[swa] - matchingRouteHeaders: <undefined>
[swa] - globalHeaders: <undefined>
[swa] - url: /src/components/HelloWorld.vue
[swa] - target: http://localhost:3000
[swa] customUrl: false
[swa] is4xx: false
[swa] remote dev server detected. Proxying request
[swa] - url: /src/components/HelloWorld.vue
[swa] - code: 200
[swa] GET http://localhost:3000/src/components/HelloWorld.vue (proxy)
[swa]
[swa] --------------------------------------------------------
[swa] ------------------- processing route -------------------
[swa] --------------------------------------------------------
[swa] processing /src/App.vue?vue&type=style&index=0&lang.css
[swa] checking for matching route
[swa] checking auth request
[swa] - not an auth request
[swa] checking function request
[swa] - not a function request
[swa] checking HTTP method: GET
[swa] - method is valid (allow-list: GET,HEAD,OPTIONS)
[swa] checking for query params
[swa] - query: vue=&type=style&index=0&lang.css=
[swa] checking rewrite auth login request
[swa] checking rewrite auth logout request
[swa] checking authorizations for route
[swa] - no matching rule
[swa] - access authorized
[swa] using userConfig
[swa] - userConfig: <undefined>
[swa] checking storage content
[swa] - query: vue=&type=style&index=0&lang.css=
[swa] finding file for request
[swa] - filePathFromRequest: /src/App.vue
[swa] checking mime types
[swa] - extension: .vue
[swa] - found: application/octet-stream
[swa] constructing headers
[swa] - matchingRouteHeaders: <undefined>
[swa] - globalHeaders: <undefined>
[swa] - url: /src/App.vue
[swa] - target: http://localhost:3000
[swa] customUrl: false
[swa] is4xx: false
[swa] remote dev server detected. Proxying request
[swa] - url: /src/App.vue
[swa] - code: 200
[swa] GET http://localhost:3000/src/App.vue (proxy)
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteTimeMiddleware : /src/components/HelloWorld.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher corsMiddleware : /src/components/HelloWorld.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteDecoreURIMiddleware : /src/components/HelloWorld.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteServePublicMiddleware : /src/components/HelloWorld.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteTransformMiddleware : /src/components/HelloWorld.vue
[run] 2021-08-11T11:50:17.132Z vite:cache [memory] /src/components/HelloWorld.vue
[run] 2021-08-11T11:50:17.132Z vite:time 0ms /src/components/HelloWorld.vue
[swa] getting response from dev server
[swa] GET http://localhost:4280/src/components/HelloWorld.vue - 200
[swa] getting response from dev server
[swa] GET http://localhost:4280/src/App.vue - 200
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteTimeMiddleware : /src/App.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher corsMiddleware : /src/App.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteDecoreURIMiddleware : /src/App.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteServePublicMiddleware : /src/App.vue
[run] Wed, 11 Aug 2021 11:50:17 GMT connect:dispatcher viteTransformMiddleware : /src/App.vue
[run] 2021-08-11T11:50:17.133Z vite:cache [memory] /src/App.vue
[run] 2021-08-11T11:50:17.133Z vite:time 0ms /src/App.vue
Hi there, A really simple test I did was to just stuff query string parameters on to html pages as I make requests and I'm realizing that this leads to 404 errors. Can you confirm if no-query-string support is a feature or a bug?