awslabs / aws-api-gateway-developer-portal

A Serverless Developer Portal for easily publishing and cataloging APIs
Apache License 2.0
928 stars 402 forks source link

Hiding OPTIONS #470

Open theluxaz opened 3 years ago

theluxaz commented 3 years ago

In order to avoid CORS errors I had to enable that for every resource and method in Api Gateway. The functionality works now, however, when you go to the API page on developer portal, the OPTIONS rows (methods) take up around hald of all request now, making it really hard to find the functions you need. They are not usable and double the size of the method (request) list. Is there any way to prevent them from showing up in the developer portal, hiding them in some way? Deleting the options methods brings back the CORS issues, so that does not seem to be a viable solution.

nzphoenix commented 3 years ago

I solve this by putting the following into dev-portal/custom-content/styles.css:

#root .swagger-ui .opblock.opblock-options{ display: none; }

theluxaz commented 3 years ago

This fixes the problem. Thank you! Though the changes to the styles.css only work if I go to developer's portal through incognito mode.

Clearing all site cache from the site does not change a thing. Is there some kind of caching for the old css and how can it be updated/reloaded?

ironman-255 commented 3 years ago

Hi, I deployed AWS developer portal using AWS SAM. I am facing the exact same problem, I would like to remove the OPTIONS method from the API list. Would it be possible to have more information on how to proceed with this solution? I edited the style.css in my local folder "C:\dev\BWT\dev-portal\aws-api-gateway-developer-portal-master\dev-portal\public\custom-content" and redeployed the portal. there is no changes visible in the portal. I tried login in the portal in incognito mode like mentioned by @theluxaz, no changes either. Thanks

nzphoenix commented 3 years ago

@ironman-255 If you're deploying with SAM I have found success by also making the style changes within the \portal\lambdas\static-asset-uploader\build\custom-content folder (if you rebuild the portal locally I imagine you wouldn't/shouldn't make changes here directly) and then ensuring that the StaticAssetRebuiltToken and StaticAssetRebuiltMode parameters are added to the SAM command. I've also gone into Cloudfront and created an invalidation for /custom-content/* to force the changes to show.

ironman-255 commented 3 years ago

Hi, I probably forgot to restart the browser after applying the changes, this morning after new startup it was working. Solution " nzphoenix commented on Apr 15" seems to work fine. On redeploy, I only added StaticAssetRebuildToken parameter to the command as stipulated in the doc. Special thanks to @nzphoenix.

talipini commented 3 years ago

@ironman-255 @nzphoenix - I am facing the exact same issue and cannot get the portal to update the local changes.I updated the local dev-portal/custom-content/styles.css and changed the logo at dev-portal/public/custom-content. I followed these steps to redepoly but I cannot get these changes to propagate the portal. Static files under s3 portal-static-assets just get updated to the original files.

After updating the files,..

  1. npm run build
  2. deploy with StaticAssetRebuiltMode and StaticAssetRebuildToken

I see the local changes get updated to dev-portal/build/custom-content folder but the s3 bucket and the portal still shows the old files.

Anything I am missing? Appreciate any guidance.

nzphoenix commented 3 years ago

@talipini If you're not rebuilding the portal locally then you probably need to make the changes in the \portal\lambdas\static-asset-uploader\build\custom-content folder.

Also make sure you add an invalidation to your API Gateway Cloudfront distribution for /custom-content/ (or just "" as that'll work too) and give it a few minutes.

talipini commented 3 years ago

@nzphoenix Thank you! That was it. I ended up just copying the files to s3 and invalidating /cutom-content/* in cloudfront.

ironman-255 commented 3 years ago

Yep, now I got it! I was used to wait for the changes to appear. But if you want to see the changes faster... https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Invalidation.html Thanks.

tej-rana commented 2 years ago

How about adding tags property with value CORS for all options?

"options" : {
        "tags" : [ "CORS" ],
        ...
        }