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

Missing UI elements when accessing via Vagrant Box - Bad Base HREF URL #20

Open
weierophinney opened this issue Dec 31, 2019 · 5 comments

Comments

@weierophinney
Copy link
Contributor

My issue is similar to #16 except I ran this from the repo's own vagrant box

My repro was

  • Install from composer create
  • Boot up the vagrant box provided in the skeleton
  • vagrant ssh
  • enabled development mode
  • then ran php -S 0.0.0.0:8080 -t public public/index.php

So on my host machine (outside the vbox),

  • Go to http://localhost:9090/
  • Get the ApiGility welcome message
  • Click on "Get Started"
  • Directs me to http://localhost:9090/apigility/ui
  • I see an unstyled page with {{ flash.message }} vars around

I do have the rwoverdijk/assetmanager directory in my vendor folder and it works fine.

I encountered a similar situation on my own vagrant box with the same issue. So I tried it with the skeleton's own vagrant box and still encountered the error.

My local enviroment

  • Ubuntu Desktop 14.04
  • Vagrant 1.6.2
  • Virtulabox 4.3.6

Any help would be great

Update: The problem does not appear if I load up the built-in PHP server locally - it only happens when if I access it via Vagrant (the php web server is started from the vagrant instance)
If I ran the PHP web server in Vagrant and access it to there, it will give me missing UI issues.
But I just ran it locally (without Vagrant), this works fine. It is still an issue because I would like to enable my fellow developers to run Apigility from their vagrant boxes and ensuring everyone is on the same env settings.


Originally posted by @mechastorm at zfcampus/zf-apigility-skeleton#64

@weierophinney
Copy link
Contributor Author

Do you see something like this in your browser?
https://cloud.githubusercontent.com/assets/468091/2926926/4f17d9d6-d763-11e3-8a06-6356f34b4497.png

If yes then you most probably use Internet Explorer. Which version is this? Did you try using Chrome?


Originally posted by @kaloyan-raev at zfcampus/zf-apigility-skeleton#64 (comment)

@weierophinney
Copy link
Contributor Author

Update: Ok I noticed now the problem does not appear if I load up the built-in PHP server locally.
If I ran the PHP web server in Vagrant and access it to there, it will give me missing UI issues.
But I just ran it locally (without Vagrant), this works fine. It is still an issue because I would like to enable my fellow developers to run Apigility from their vagrant boxes and ensuring everyone is on the same env settings. I have updated this on the main description as well

@kaloyan-raev I am seeing that screenshot on my Ubuntu Desktop enviroment

  • Ubuntu Chrome 31.0.1650.63
  • Ubuntu Firefox 29
    This was on localhost:9090 which maps to the vagrant box's port 8080

I tried it remotely on a Mac via 192.x.x.x:9090, and I still saw the same issue on

  • Mac OS Mavericks - Version 35.0.1916.114

Originally posted by @mechastorm at zfcampus/zf-apigility-skeleton#64 (comment)

@weierophinney
Copy link
Contributor Author

Check the source code in the browser. There is a "base" tag somewhere on the top. Check if the URL in the "href" attribute is accessible from the client box (the one running the browser). If not, then the JavaScript and CSS file won't be served correctly to the browser, and hence the nice picture you see.


Originally posted by @kaloyan-raev at zfcampus/zf-apigility-skeleton#64 (comment)

@weierophinney
Copy link
Contributor Author

Found the cause! Thanks for the tip @kaloyan-raev . Though I need to find a proper solution to this.

When I checked the source code of the generated site on my browser, the base href was shown as

<base href="http://localhost:9090:8080/zf-apigility-admin/">

Port 8080 is what the built-in php server was activated on, and Port 9090 was that port that was mapped in the VagrantFile to the vbox port 8080.

Modified my Vbox to map port 8080 to port 8080 - this fixes the issue. Not an elegant one, the proper one could be either

  • update the skeleton VagrantFile to map guest port 8080 to host 8080 (instead of 9090)
  • go through the PHP module and debug what is causing it out put two port numbers on the base href

Originally posted by @mechastorm at zfcampus/zf-apigility-skeleton#64 (comment)

@weierophinney
Copy link
Contributor Author

Seconded this:

Modified my Vbox to map port 8080 to port 8080 - this fixes the issue.

The application is generating links that assume that the server is running on port 8080, so either the port forwarded needs to be 8080 or that hardcoding needs to be removed from the app.


Originally posted by @Danack at zfcampus/zf-apigility-skeleton#64 (comment)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant