Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Does Phonegap support root relative path? What are the best practices?

I'm really baffled after reading PhoneGap on iOS with absolute path URLs for assets and have a couple of questions:

  • Does Phonegap supports root relative path? For instance Ionic framework for Hybrid Mobile development has such kind of path in their samples:

    <script src="//ionic/js/ionic.bundle.min.js"></script>

  • What are the best practices for Phonegap's path?

like image 769
Ilya Buziuk Avatar asked Jul 30 '14 11:07

Ilya Buziuk


People also ask

What is root path and relative path?

A relative path describes the location of a file relative to the current (working) directory*. An absolute path describes the location from the root directory. When learning to access data files through programming, we regularly use relative file paths.

Should you use relative paths?

Relative paths rely on the current working directory. This is a form of global state, and as such it should be avoided whenever possible. Depending on the structure of your application, the current working directory may not be guaranteed to be constant through all code paths that can reach a certain routine.

Why do we use relative path?

The advantage to using relative paths is that you can change your domain name, and your links will continue to work without having to modify them. Of course, if you move files and folders within your site, you will have to update relative paths as well.

What is absolute path and relative path in Windows?

If all three components are present, the path is absolute. If no volume or drive letter is specified and the directory name begins with the directory separator character, the path is relative from the root of the current drive. Otherwise, the path is relative to the current directory.


2 Answers

I stumbled upon this old thread while trying to solve the same/similar challenge with images not rendering on the device but, oddly, would render when running with a live server or with the Chrome browser.

If you're reading this, the filespec to your image is also case-sensitive. Chrome doesn't care, but Cordova (Phonegap) does!

like image 124
eppineda Avatar answered Oct 10 '22 16:10

eppineda


Basically in phone gap development everything that concerns your code resides in the www folder.

-myApp
   -www
      -index.html
      -img
      -js
      -css
      -libraries
      -templates

The best would be to just refer the files as js/file.js and css/file.css i.e relative to index.html.

Root relative paths may conflict depending on the platform and thus would be a unnecessary hassle.

Root Relative Paths:

doing something like this :

<link href="/css/app.css">

This will work in your browser if you have a local server setup and have set your myApp/www folder as the root.

But when you build your app in cordova and test it on your phone, it will display incorrectly as it does not have any reference to that server root and will reference it as file:///.

Absolute paths

An absolute path would require you to mention the complete address. When you are creating your app, your code resides in the myApp/www folder. But when you build the app(assuming android), it is moved to the platforms/android/assets/www folder. So your absolute paths will again be wrong.

Remote Server

Your app obviously interacts with a remote server . If you store your images on your remote server, then you must refer to them with absolute paths in your application.

like image 20
Varun Nath Avatar answered Oct 10 '22 16:10

Varun Nath