How to access linked application

[tatemz]

I have a basic apache setup with a successful browser-sync container linked to it with the appropriate ports. I have browser sync successfully working with an expected success message

[BS] Access URLs:
 -------------------------------------
       Local: http://localhost:3000
    External: http://172.17.0.251:3000
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://172.17.0.251:3001
 -------------------------------------

And the "external IP" that is being referenced is followed to the browser-sync container and not the apache container.

docker inspect browser-sync | grep "IPAddress"
  "IPAddress": "172.17.0.251",
  "SecondaryIPAddresses": null,

When I go to my docker-machine IP address 192.168.99.100, the site loads up. However going to 192.168.99.100:3000 does not work.

Tips?

[arnau]

Hi @tatemz, could you share the command you used to start browser-sync please? I'm interested in seeing what strategy did you use to connect with the apache service.

[shankie-codes]

Hey @arnau – great project.

I've got a usage question that I hoped you might be able to sort.

In the Docker spirit, I'm running the same config on local (on Docker for Mac, rather than Toolbox, though I don't think that makes a difference) as I am on the server, which is a number of WordPress sites on Apache behind an nginx reverse proxy (I'm using the excellent HTTPS-PORTAL).

So, I end up with URLs that look like https://mysite1.localhost and https://mysite2.localhost, which then point to running containers called mysite1 and mysite2

I've tried running the following Docker command:

docker run -dt \
           -p 3000:3000 \
           -p 3001:3001 \
           -v $(PWD)/:/source \
           -w /source \
           --link=mysite1 \
           --dns-search=localhost \
           --name browsersync \
           ustwo/browser-sync \
           start \
           --proxy "mysite1.localhost"\
           --files "*.css"

This seems to work in as much as the UI acknowledges the presence of the connected container (and I can ping mysite from within the browsersync container), but when I go to http://localhost:3000, it simply redirects me to https://mysite1.localhost without port 3000.

Any idea how to get this to serve directly rather than redirecting?

[shankie-codes]

Ah a bit more info. I re-read the readme and tried your recommended networking approach, e.g.

docker run -dt \
           -p 3000:3000 \
           -p 3001:3001 \
           -v $(PWD):/source \
           -w /source \
           --add-host dkr:172.17.0.8 \
           --name browsersync \
           ustwo/browser-sync \
           start \
           --proxy "dkr"\
           --files "*.css"

And ended up with the same result as my solution using --link and --dns-search. This means that you probably can use my approach in general for networking (and not get stuck using IP addresses), though the result for me seem to be the same in either approach 😢

[arnau]

@shankiesan at first glance, it looks like a nginx rule redirecting from localhost:3000 to mysite1.localhost.

I'm not familiar with http-portal but, is it possible it is redirecting traffic from localhost? If so, it could be the cause.

About your approach using --dns-search looks good, I'll give it a try with Docker for mac.

Another approach I have to check that might work smooth is just using a custom network shared between browser-sync and the proxied container. I'll come back to you when I manage to properly test it.

[arnau]

@shankiesan I did a couple of tests with Docker for mac (Version 1.11.1-beta10 (build: 6662) and the results are quite good. I updated the README so hopefully now it will be more clear.

Besides that, I changed from Alpine to the official node 6-slim docker image.

About the --dns-search, I don't see it necessary either using links or a custom network given that both are already using Docker's DNS system.

Let me know if there is any issues with the new version.

[shankie-codes]

@arnau I think you're right about a redirect. I think there's a 301 getting in the way. I'll open a thread on the main BrowserSync repo to try to get a workaround.

Glad that the link approach worked! I'll have a test of it now and see how I get one. Cheers!

[shankie-codes]

Ok, I've worked out that my initial issue was with redirects. Before, I couldn't get it to work with any https site because I was putting the http URL. For instance, if I wanted to visit my wife's birthday party site at trishwish.com and proxied trishwish.com, it wouldn't work because if I curl trishwish.com, I get a 301 redirect to https://trishwish.com.

However, now with using --link=trishwish and --proxy=trishwish, all seems to be working well!

Thanks @arnau

[shankie-codes]

Well, I might have spoken too soon. It's serving the site (and connected to BS), but not picking on on file changes. I'll have a bit more of a play tomorrow 😄

[arnau]

@shankiesan how are you running docker?

[shankie-codes]

Using Docker for Mac Beta, version 1.11.1

[arnau]

umm, the last tests I did with Docker for Mac (same version), BS was reacting well on FS changes. Could you put together an example close to what you are doing so I can test it?

[shankie-codes]

Ok, I think I am indeed having some problem with file system events.

If I do:

docker run -t \
           --name browser-sync \
           --link mysite1 \
           -v $(PWD):/source \
           -w /source \
           -p 3000:3000 \
           -p 3001:3001 \
           ustwo/browser-sync \
           start --proxy "mysite1" --files "*"

It loads and connects to BS. But if I change a file (say add something.text to my current working directory on the host, i.e. $(PWD) from above), it doesn't reload. However, I'm not exactly sure what the problem is because if I docker exec -it browser-sync sh and ls, I can see my something.txt with its updated modified time. That makes sense as it's volume-mounted, so I thought, "Perhaps it's just notifications that are broken...". So I tried, from inside the browser-sync container, doing a echo "hi" >> test.txt" and it still didn't force a reload.

Any ideas? Thanks @arnau for your help

[shankie-codes]

Oops I spoke too soon! Doing a echo "hi" >> test.txt" from within the container does work. It's changes from the host filesystem that don't seem to be notifying. Hmm.

[arnau]

Well, when I started this project, using Docker Machine, I found Docker not able to pick any filesystem event because the way the whole stack was set.

The last tests I did with Docker for Mac where successful in this regard given that they did a partial implementation of the filesystem events propagation. To be honest, I did a quite simple test so might be that it is not good enough.

Could you try the tests I did to verify it works/doesn't work for you?

You have to clone this repository, and run:

make test-proxy

Go to sandbox/ and change the CSS. It should work.

[arnau]

Ah, well, if the echo test works the one I'm telling you about should work as well.

[arnau]

Now, I'm wondering if the HTTPS-PORTAL you were mentioning before has anything to do with the problem. What do you think?

[shankie-codes]

Thanks for that test – interesting. However, it fails in the same way that my other test fails, in that it loads, connects to browsersync, but doesn't seem to pick up on a a filesystem change.

So, I don't think that HTTPS-PORTAL has anything to do with it. It doesn't work with your test – and also, I believe how I'm using it above, I access it directly from the docker network, rather than using the HTTPS-PORAL nginx RP.

Hmm. The plot thickens...

[arnau]

mmm, I'll find some time soon to have a couple more tests to see if I can narrow down this issue.

Does the polling strategy work at least?

make test-clean # only if you still have the old containers hanging around
make test-proxy-polling

[shankie-codes]

Oddly enough, doing echo "hi there" >> simple.css" from within the container doesn't seem to trigger an update within the containers made bymake test-proxy`.

I've tried

make test-clean
make test-proxy-polling

and the server doesn't respond at all. I assume that's another issue...

[arnau]

ugh, ok, I'll do some more tests then

[shankie-codes]

Hehe sorry. I know the feeling 😄

[shankie-codes]

Hey @arnau did you get a chance to take a look at this?

[shankie-codes]

Oh never mind me @arnau – I've tried it again after blitzing Docker (for another reason) and it seems to work. I'll let you know if I hit any other issues 😄

[arnau]

Hey, sorry I haven't had the time to look deeper. Glad it works :)

[ganlanyuan]

Hey, I encountered the same issue with @tatemz. I used mamp to generate a link for php files. Then ran docker run -it --name web -v $(pwd):/usr/src/www/app web sh for my test. Then ran docker run -dt --name browser-sync --link web -p 3000:3000 -p 3001:3001 ustwo/browser-sync start --proxy "http://localhost:8888/develop/docker-gulp-libsass/app/" --files "**/*.css, **/*.php" to link to web. And I ran docker inspect browser-sync | grep "IPAddress" to get the ip:

"SecondaryIPAddresses": null,
"IPAddress": "172.17.0.3",
"IPAddress": "172.17.0.3",

But I can't open http://172.17.0.3:3000/ in the browser. Could you help?

[arnau]

@ganlanyuan how did you install Docker and what OS are you using?

Besides that, could you ellaborate a bit more on the purpose of

docker run -it --name web -v $(pwd):/usr/src/www/app web sh

Ah, one last thing, the IP you got with IPAddress is internal to Docker so it shouldn't be used from the outside. If you use Docker for Mac (or for Windows) you should be able to access http://localhost:3000.

[ganlanyuan]

Hey, I installed Docker for Mac. And it's running on Mac OSX EI Capitan 10.11.6. The purpose of

docker run -it --name web -v $(pwd):/usr/src/www/app web sh

is to run gulp tasks (compile scss, concat and compress JS, compress images & svgs).

How can I get the address which can be run on other devices? Like mobile or tablet. Thanks

[arnau]

The default behaviour in Docker for Mac is to bind to 0.0.0.0. You can confirm this is true by doing:

docker ps

It should show the published ports with something like 0.0.0.0:3000. If this is the case, then you can access the service from an external device using the IP assigned to your computer (check it in System Preferences > Network).

The only thing it won't work if I understand your setup correctly is --proxy "http://localhost:8888/develop/docker-gulp-libsass/app/"

Mainly because localhost inside a Docker container does not resolve to your machine which is where I suspect :8888 is running. A solution for that would be using the IP assigned to your machine or, a bit more involved, not use MAMP and dockerise your app.

[ganlanyuan]

I see, great thanks for you help! Let me try to dockerise it first.

[ganlanyuan]

Come back again. I first ran a php server for my app using

docker run --name server -p 8080:80 -v $(pwd):/var/www/html/ -d eboraas/apache-php

And then ran

docker run -dt --name sync --link server -p 3000:3000 -p 3001:3001 ustwo/browser-sync start --proxy "http://192.168.1.114:8080" --files "**/*.css"

And I go to http://192.168.1.114:3000. It did show "Connected to Browsersync" on the browser, but the browser didn't refresh when I modified the css.
Could you help me with this? Thanks a lot!

[arnau]

@ganlanyuan could you try:

docker run --name server -p 8080:80 -v $(pwd):/var/www/html/ -d eboraas/apache-php
docker run -dt --name sync --link server -p 3000:3000 -p 3001:3001 ustwo/browser-sync start --proxy "http://server" --files "**/*.css"

Let me know if there is any change/improvement.

[ganlanyuan]

I tried, still nothing changed. No auto refresh happening when style is changed.

[arnau]

Have you tried with a polling strategy? I have an example here https://github.com/ustwo/docker-browser-sync/blob/master/sandbox/proxy_polling.js

[ganlanyuan]

Thanks, I tried

docker run --name server -p 8080:80 -v $(pwd):/var/www/html/ -d eboraas/apache-php
docker run -t --name sync --link server -p 3000:3000 -p 3001:3001 ustwo/browser-sync -v $(pwd)/bs-config.js:/source/bs-config.js start --config bs-config.js

But it says "no bs-config.js found"

[arnau]

Hi, well there is a small issue with the order of parameters. Docker is picky with where you put the name of the image, it has to be the last one. After that it expects the rest to be the command received by the container, so the pattern is:

docker run <docker flags> <image name> <container cmd and/or flags>

In our case the command should be:

docker run -t --name sync --link server -p 3000:3000 -p 3001:3001 -v $(pwd)/bs-config.js:/source/bs-config.js  ustwo/browser-sync start --config bs-config.js

This way, the -v flag is part of the docker flags and start --config ... command and flags of the container.

[ganlanyuan]

Hey, thanks a lot for your help! It still doesn't work for me. But I find a solution by using php build-in server in gulp tasks. Thanks again!

[titaniumbones]

@ganlanyuan I have a similar problem to this and am stuck. Do you stil lremember how you solved your issue? Thanks1

[ganlanyuan]

Hey @titaniumbones I built a docker image for my task.