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

Github Code Spaces Template #1260

Closed
Alek99 opened this issue Jun 27, 2023 · 8 comments · Fixed by #2125
Closed

Github Code Spaces Template #1260

Alek99 opened this issue Jun 27, 2023 · 8 comments · Fixed by #2125
Assignees
Labels
feature request A feature you wanted added to reflex good first issue Good for newcomers help wanted Extra attention is needed

Comments

@Alek99
Copy link
Contributor

Alek99 commented Jun 27, 2023

If anyone if familiar with GitHub code spaces it would be awesome if we have a template with Pynecone preloaded so new users can experiment as fast as possible. We can also put a link to the template in the readme.

@Alek99 Alek99 added good first issue Good for newcomers help wanted Extra attention is needed feature request A feature you wanted added to reflex labels Jun 27, 2023
@rahulbagai
Copy link

@Alek99 could you please assign this to me, I am looking to contribute to this project. thanks!

@rahulbagai
Copy link

@Alek99 I have the template repository and the readme instructions ready. Here is the template repository - https://github.com/rahulbagai/pynecone-template

and here is the README instructions

You can also access this project in a fully configured development environment using Github Codespaces. Click the following link to create a new Codespace:

[![Open in Codespaces](https://img.shields.io/badge/Open%20in-Codespaces-blue?logo=github&style=for-the-badge)](https://github.com/codespaces/new?template_repository=rahulbagai/pynecone-template)

Could you please help review and allow me to make the contributions to pynecone repos. thanks!

@Alek99
Copy link
Contributor Author

Alek99 commented Jun 29, 2023

Awesome thanks! I'll test this, after I confirm it works the next steps have a couple options:

a) We make a subfolder in the main Pynecone repo and add this code there.

b) I make another public repo under the Pynecone organization just to have this code.

@Alek99
Copy link
Contributor Author

Alek99 commented Jun 29, 2023

I tried this with the counter app and it seems that state is not working with code spaces. Based on a discord discussion I had with a user I think it may require some special configuration for code spaces to support web sockets?

Is the counter example working with your code spaces instance?

@rahulbagai
Copy link

@Alek99 Ah my bad! I was working on local devcontainer and it worked fine there. I will test it out in codespaces as well, make necessary changes and send the change request.

@rahulbagai
Copy link

rahulbagai commented Jun 30, 2023

@Alek99, I've been investigating a challenge I've encountered and would appreciate your guidance.

I've been running a Pynecone application (counter app) in Github Codespaces. However, I've noticed that while the app runs locally on localhost:3000, there might be some necessary adjustments or configurations required to make it fully compatible with Codespaces, which provides a cloud-based development environment, especially regarding the support for WebSockets.

I've confirmed this based on the following browser logs:

[blocked] The page at https://rahulbagai-miniature-broccoli-4qvxg4pxxwcqvv9-3000.preview.app.github.dev/ was not allowed to run insecure content from ws://localhost:8000/event/?EIO=4&transport=websocket.

The issue seems to be mixed content, which occurs when a webpage loaded over a secure HTTPS connection attempts to load resources via an insecure HTTP or WebSocket connection.

To mitigate this, I believe we should switch to a secure WebSocket connection (wss://) rather than an insecure one (ws://). However, I'm unsure whether Pynecone currently supports this functionality.

Upon inspecting the constants.py file for any possible configurations, I noted a segment in the Endpoint class related to URL replacement and WebSocket protocol switching. I suspect this might be contributing to the insecure content issue.

Here are a few potential solutions I've considered:

  1. Secure Server Usage: Hosting the application on a server that uses https:// and supports wss:// for WebSocket connections could prevent mixed content issues by ensuring all connections are secure. Does Pynecone currently support any such configurations in the pcconfig.py file?

  2. Source Code Modification: Theoretically, we could modify the Pynecone source code to always use wss:// instead of ws://. However, this would require detailed understanding of the library's internals, which I might not be equipped for at the moment.

  3. Proxy Server Implementation: Using a proxy server that accepts wss:// connections and forwards them as ws:// connections to the Pynecone server could also solve the mixed content problem. The client would only ever see the secure wss:// connections. However, this method would require additional setup and could potentially introduce additional latency.

Could you please advise on the best way to proceed? I would greatly appreciate your insights.

@rahulbagai
Copy link

@Alek99

I hope you're doing well. I am following up on the issue related to the integration of Pynecone. I'd like to know if there have been any updates or progress.

Specifically, I would appreciate any information on the following:

  1. Compatibility with GitHub Codespaces: Have you encountered any guidelines or suggestions from the GitHub Codespaces environment that could help resolve the WebSocket compatibility issue? Understanding any platform-specific considerations would be beneficial in determining the best solution.

  2. Community Input: Has any feedback or insights from other contributors or maintainers within the Pynecone community regarding WebSocket support in GitHub Codespaces? Their experiences or suggestions could provide valuable guidance in addressing this issue.

  3. Next Steps: Based on our previous discussions, I would like to know how to resolve this issue. Are there any specific steps or recommendations you have in mind? I'm eager to contribute and make progress on this task.

I appreciate your time and support throughout this process. Any updates or guidance you can provide would be highly appreciated.

Thank you!

@rahulbagai
Copy link

@Alek99 I have submitted a pull request for this feature. Would you kindly review it?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature request A feature you wanted added to reflex good first issue Good for newcomers help wanted Extra attention is needed
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants