I've build a mobile site using jQTouch, and now I've been working to get that same site working with PhoneGap. For PhoneGap, I've moved most all of the assets (pages, images, JS, CSS, etc.) into the www directory, but I still need to load some dynamic content via Ajax. From the mobile site, I'm using relative URLs to load additional content. However, with PhoneGap, I haven't found a way to use relative URLs to access my mobile site and have been forced to use absolute URLs. My question is this: Is there a way to use relative URLs with PhoneGap? Maybe something like setting a base URL during the PhoneGap initialization?
When using PhoneGap the main files will be on the phone so relative files will be relative to the location on the phone.
If you need to access a file on a remote server (your mobile site) then it must be specified absolutely.
If your main HTML page within your PhoneGap app is at file://www/index.html and you try and access a relative file (say "logo.png") and so specify <img src="logo.png" /> you're really getting it from file://www/logo.png.
If you actually wanted the version of logo.png which is actually on your remote website, you have to provide the full (absolute) path or there's no way for the browser to know that when you specify "logo.png" you mean the one at "http://www.your-site.com/logo.png".
You can try using the <base> tag. This will set your Base URL to whatever you need:
<base href="http://yourdomain.com/">
<script src="js/remotescript.js"></script>
Note this means now your local scripts need to be in absolute form:
<script src="http://localhost/js/phonegap.js"></script>
See this other question for more info regarding this note. The guy there suggests to prepend a dot (.) before the local relative URL, though I didn't test this:
<script src="./js/phonegap.js"></script>
I know this is 6/7 years old, but for any others arriving here for the same question...
Here's a solution, since there isn't a more "packaged" one:
3 quick steps:
1) Store your site domain in a global javascript variable
var currentloc = 'https://example.com'
2) Use temporary variable to add your relative path to currentloc
var relpath = '/need/jsonex'
var ajaxcall = currentloc + relpath
$.ajax({...
3) Adjust currentloc if you do change the supposed "location" that you're calling relative path from on site
currentloc = currentloc + '/new/path'
** just remember if you make currentloc a global variable you need to keep track of these changes.
Hope this helps.
Related
I wrote a Typo-3 template which is working fine the problem is that when I call a "sub path" the image links aren't found anymore.
/index.php: every thing works fine
/test/index.php: images aren't found anymore
The problem is that no image url is an absolute path whether from TypoScript or from fileadmin via component.
Is there a way to force absolute path use everywhere?
I assume you use an extension to get nice URLs (coolUri or realUrl) so you get path segments for each page other than the root page.
So you have subfolders in your URL but always the index.php from your webroot is called.
Now you have images which by default are referenced relative to the working php script. As the working php script is /index.php a path to fileadmin/img/image1.jpg is correct.
But your browser thinks you are in path /test and requests an image <domain>/test/fileadmin/img/image1.jpg, which does not exist.
Either your browser needs to know which base to use for server pathes (setting base Url),
or (better) you provide absolute URLs for any resources. This can be done with a little typoscript configuration:
config.absRefPrefix = /
I am returning text/html(MediaType.TEXT_HTML) from REST web service which I want to show in browser.
Return string from web Service Method=<html>
<body background=\"WEB-INF\\DSCN0651.JPG\">
<h1>Hello World!!!</h1>Visit W3Schools.com!
<audio autoplay><source src=\"WEB-INF\\Coolest_Sms_All_Time.mp3\" type="audio/mpeg"</audio>
</body></html>
The problem I am facing is the background = DSCN0651.JPG is not rendered in browser
The audio autoplay is not working as I am not able to hear sound in browser.
Though I am only able to see Hello World!!! and link www.w3schools.com! in browser after REST call.
I checked the deployment area both image and mp3 are deployed fine under WEB-INF folder
I am using IE/chrome browser to make a call to my WebService get method.
Please let me know what I am doing wrong.
To link images or audio (or whatever resource), you need to give a relative URL which the client browser can understand, by asking the server for that resource. If you have a webpage like the above at URL http://example.com/foo/bar, the browser will try to look up http://example.com/foo/bar/WEB-INF\DSCN0651.JPG, but that's an invalid URL. I suggest you check that by trying out the real URL yourself, and by seeing with Developer tools what the browser does with your page.
That URL is invalid at least because it uses a backward slash \ instead of a forward slash /. That's wrong in URLs.
Actually, what you're showing uses \" and \\, but those should appear only when you embed them as a string in source code, to represent respectively " and \. You might want to inspect the output to ensure that's correct.
Moreover, that URL contains WEB-INF. I assume you're using a Java application server. However, the content of the WEB-INF folder is handled specially by Java application servers — in fact, resources there are not accessible to the public! So you should probably move them elsewhere and update the path (the right place depends on what you're exactly doing). Probably moving them up, outside of WEB-INF, and updating the URLs already works.
I just upgraded a site from 1.0.5 to 1.0.12 and am having troubles with images. It seems that now when I save a resource, ModX or TinyMCE places the name of the resource in the path for whatever images I have in that resource.
So, formally, my image paths looked like:
www.mysite.com/assets/images/photo.jpg
but now they look like:
www.mysite.com/page-name/assets/images/photo.jpg
This has broken all the images on my site. Further more, adding a new image or finding the old ones via the file browser doesnt work either. It just inserts them with the proper path, but updates them with the new path upon save, having the same effect.
Does anyone know what I can do to solve this?
Just specify "base url" in "head" tag - <base href="http://your_site.com/" >
Suppose an app has a webview that uses JQuery for example.
The server delivers the page with appropriate links to load JQuery, and the view works fine, but I would like it to not need to download JQuery (yes it may be cached, but it won't be the first time the app runs and I would rather not count on it)
So I can include the JQuery files with the app, but then how should I embed the links?
The server certainly doesn't know the bundle path.
I thought I could load the url into a string and then replace the JQuery paths with the local paths before displaying in the webview.
Is there an easier way?
You can use relative paths for jQuery and set the baseURL to the bundle path. However that requires that all resources are in the bundle directory (except those which are referenced by an absolute path).
Is it possible to intercept image load requests in WebView before they are actually started and modify their URLs?
For example, I have
mWebView.loadUrl(myUrl);
In onLoadResources event I can see URLs, but I can't modify them?
The thing is I am working on application that loads html content from remote location. For some reason author excluded image path and in img src he just have file name. Existing iPhone application is using this html content and I assume the content is build the way that is the best for iPhone. So, I need somehow to figure how to alter these paths. For example, if I choose to download all images first, I would need to alter path and add file:///... in front of image.jpg name.
Thanks.
you can use onLoadResource although are not only images but any resource loaded like javascript and css