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

API Explorer does not work in Safari (mixed HTTP/HTTPS content problem) #1603

Closed
bajtos opened this Issue Aug 14, 2018 · 12 comments

Comments

Projects
None yet
8 participants
@bajtos
Member

bajtos commented Aug 14, 2018

Description / Steps to reproduce / Feature proposal

  1. Start our todo example application
  2. Open http://127.0.0.1:3000/swagger-ui in Safari (MacOS)

Current Behavior

Failed to load API definition.

  • Fetch errorNot allowed to request resource http://127.0.0.1:3000/openapi.json
  • Fetch errorPossible mixed-content issue? The page was loaded over https:// but a http:// URL was specified. Check that you are not attempting to load mixed content.

Expected Behavior

API Explorer (swagger UI) is correctly loaded for the explored application.

Please note that both Chrome and Firefox work well.

Acceptance Criteria

~~Verify issue has been resolved once we offer a self-hosted API Explorer #559. If not, re-review this issue with the team. Otherwise close it.~~~

  • Create a new subdomain to host swagger-ui, e.g. explorer.loopback.io.
  • Move the hosted swagger-ui website from loopback.io repo to a new GH repository
  • Configure this new repo to be hosted on explorer.loopback.io (via GH pages)
  • Make sure both HTTP and HTTPS schemas are allowed for this new domain
  • The current URL https://loopback.io/api-explorer should redirect to the new domain
  • Check and possibly fix LB4 code creating the explorer URL to use the same scheme (HTTP/HTTPS) as is the API application using.

See Reporting Issues for more tips on writing good issues

@bajtos

This comment has been minimized.

Member

bajtos commented Aug 14, 2018

Related reading:

https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content

Note: Since Firefox 55, the loading of mixed content is allowed on http://127.0.0.1/ (see bug 903966). Chrome allows mixed content on http://127.0.0.1/ and http://localhost/. Safari does not allow any mixed content.

https://stackoverflow.com/questions/32883306/safari-9-disallowed-running-of-insecure-content

According to the Apple support forums Safari does not allow you to disable the block on mixed content.
Though this is frustrating for usability in legitimate cases like yours, it seems to be part of their effort to force secure content serving / content serving best practices.

I am not sure how to actually fix this problem if Safari does not allow mixed content even on localhost. Perhaps we need to support both http and https protocols for our hosted API Explorer, so that HTTP applications can access API Explorer via HTTP? Or maybe it's enough to describe this problem in our documentation, advise users to use Firefox or Chrome, and wait until we implement self-hosted explorer (see #559).

@hacksparrow

This comment has been minimized.

Member

hacksparrow commented Aug 14, 2018

Does not work on the latest version of Chrome either.

@dhmlau

This comment has been minimized.

Contributor

dhmlau commented Aug 15, 2018

@virkt25 , do we need to estimate this or should put to backlog directly?

@virkt25

This comment has been minimized.

Contributor

virkt25 commented Aug 15, 2018

I think @raymondfeng already has a fix for this in #1608

@raymondfeng

This comment has been minimized.

Member

raymondfeng commented Aug 15, 2018

@virkt25 Unfortunately I don't think #1608 will resolve this issue. The root cause of this one is that our hosted API explorer is served using https but the openapi spec is exposed over http by default unless the target app is secured using https.

@virkt25

This comment has been minimized.

Contributor

virkt25 commented Aug 15, 2018

Ah right, forgot the issue goes beyond just not setting the right protocol for the openapi spec file.

@dhmlau we should estimate this but for that to happen we need to decide upon a fix. I can think of two options:

  • Host a non-https version of the API Explorer ourselves (maybe a new domain like explorer.loopback.io that has both http and https support? We can get @rmg to help with the setup.

  • Create a self-hosted / built-in API Explorer component as planned in #559

EDIT assigned to everyone for further discussion.

@raymondfeng

This comment has been minimized.

Member

raymondfeng commented Aug 15, 2018

To self-host API explorer UI, I created a PR to enable it: #1611

@dhmlau

This comment has been minimized.

Contributor

dhmlau commented Aug 20, 2018

Discussing with @virkt25, after #1611 is done, this issue can be resolved by addressing #559.

@dhmlau dhmlau added the p2 label Aug 20, 2018

@bajtos bajtos changed the title from API Explorer does not work in Safari to API Explorer does not work in Safari (mixed HTTP/HTTPS content problem) Aug 28, 2018

@bajtos bajtos added p1 and removed p2 labels Aug 28, 2018

@bajtos bajtos referenced this issue Aug 28, 2018

Closed

Monthly Milestone - September 2018 🌾🌽🍂 #1653

14 of 20 tasks complete
@bajtos

This comment has been minimized.

Member

bajtos commented Aug 30, 2018

Earlier this week, we discussed this issue with @raymondfeng and @virkt25 and found a solution that should be relatively quick to implement and does not require self-hosted explorer.

See the updated acceptance criteria:

  • Create a new subdomain to host swagger-ui, e.g. explorer.loopback.io.
  • Move the hosted swagger-ui website from loopback.io repo to a new GH repository
  • Configure this new repo to be hosted on explorer.loopback.io (via GH pages)
  • Make sure both HTTP and HTTPS schemas are allowed for this new domain
  • The current URL https://loopback.io/api-explorer should redirect to the new domain
  • Check and possibly fix LB4 code creating the explorer URL to use the same scheme (HTTP/HTTPS) as is the API application using.
@hacksparrow

This comment has been minimized.

Member

hacksparrow commented Aug 30, 2018

If you remember my demo, the app which was hosted on a https server had its s stripped and swagger-ui tried to load the http version and failed.

Is this covered by one of the criteria?

@bajtos

This comment has been minimized.

Member

bajtos commented Aug 30, 2018

@hacksparrow thanks for raising this concern. I believe the correct handling of protocols is part of the last criteria:

Check and possibly fix LB4 code creating the explorer URL to use the same scheme (HTTP/HTTPS) as is the API application using.

When the app is running on HTTP, then the explorer should redirect to http://explorer.loopback.io. When the app is on HTTPS, then the explorer should redirect to https://explorer.loopback.io.

@raymondfeng

This comment has been minimized.

Member

raymondfeng commented Sep 21, 2018

Fixed. Now we have API explorer served from:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment