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

Vite proxy does not work in Docker environment #14719

Closed
scriptPilot opened this issue Oct 21, 2023 · 1 comment
Closed

Vite proxy does not work in Docker environment #14719

scriptPilot opened this issue Oct 21, 2023 · 1 comment

Comments

@scriptPilot
Copy link

Describe the bug

I would like to run both, backend and frontend in Docker.

Backend is running in php:apache container, exposing /api.php at localhost:8000.
Frontend is running node container, exposing vite server at localhost:5173.

Vite proxy config:

{
  "/api.php": "http://localhost:8000"
}

When I run the backend in Docker and frontend without, it works like a charm.

When I run both with Docker, the frontend is accessible and the backend too, but the call from frontend via proxy to the backend does not work with fetch().

Reproduction

https://github.com/scriptPilot/bug-vite-proxy

Steps to reproduce

See readme in the repo.

System Info

From Docker:


  System:
    OS: Linux 5.10 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
    CPU: (6) arm64 unknown
    Memory: 2.91 GB / 3.84 GB
    Container: Yes
    Shell: 5.2.15 - /bin/bash
  Binaries:
    Node: 18.18.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.8.1 - /usr/local/bin/npm
  npmPackages:
    vite: ^4.5.0 => 4.5.0 


### Used Package Manager

npm

### Logs

_No response_

### Validations

- [X] Follow our [Code of Conduct](https://github.com/vitejs/vite/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/vitejs/vite/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://vitejs.dev/guide).
- [X] Check that there isn't [already an issue](https://github.com/vitejs/vite/issues) that reports the same bug to avoid creating a duplicate.
- [X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to [vuejs/core](https://github.com/vuejs/core) instead.
- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vitejs/vite/discussions) or join our [Discord Chat Server](https://chat.vitejs.dev/).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.
@scriptPilot
Copy link
Author

I was able to solve this issue with support of this thread:
https://stackoverflow.com/questions/74281247/api-call-not-reaching-vite-proxy-target-localhost5000

Solution: Use the PHP Docker container name + internal port

proxy: {
  '/api.php': 'http://php:80'
}

@github-actions github-actions bot locked and limited conversation to collaborators Nov 5, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

1 participant