I am using react and laravel and the image save in backend folder how I can display it in the frontend ?
I use this path
<img src="http://localhost:8000/public/avatar/images.png"/>
but do not work
the /public folder is usually the web root - so you may want to try -
<img src="http://localhost:8000/avatar/images.png"/>
Assuming you have moved the uploaded file to your applications "public" path.
The root folder for laravel is usally the folder above the public web root.
Better also not include the host
<img src="/avatar/images.png"/>
Related
Third party application which I'm trying to integrate, asking to put a file inside a .well-known folder. how can I make that file accessible from URL? (example.com/.well-known/token.txt). site is deployed as a gitlab page. every attempt I tried gives 404 error.
If you put your ".well-known" folder inside the "static" folder it should get deployed to the root of your website as you expect.
How can I make the {domainname}.com/public route of my React app just serve the files in my /public directory? I am using react-photo-gallery which to my knowledge only allows the use of full urls (not the relative ones that are used inside components).
An example of this working would be that if I have a file image.jpg inside my /public folder, I could access it by going to {domainname}.com/public/image.jpg.
I am getting a problem in deploying my app to the server. The problem is i have folders inside the webroot which points to the .css and .js files.
I was doing the basic cakephp function $this->Html->css('bootstrap') when my simple css files were in the css folder but now there are some other folders inside the webroot because of using the plugins for the frontend UI.
For this i have changed my url to like this $this->Html->css('/global/plugin/file')
Problem is on local it is working fine because of virtual host example.com but on live server i have domain like this 192.168.00.00/mysite so it go to the main directory to and link the ip 192.168.00.00 instead of going to 192.168.00.00/mysite.
Is there any good way to solve this and add the flexibility to the url so that my local and live will not be disturbed while i push my code through git?
Just removes '/' from $this->Html->css('/global/plugin/file') to below
<?php
$this->Html->css('global/plugin/file');
$this->Html->script('global/plugin/file'); //example loading file.js
?>
I already had an issue about this one including my JS and CSS inside a folder but when I removed '/' it solve my problem.
Confirm that their is a file.css inside plugin inside webroot\css\global\plugin\file.css windows path or LINUX path /webroot/css/global/plugin/file.css
I'm hosting an angular 2 app on s3. I'm using redirect rules on the s3 bucket, as defined in the answer.
<RoutingRules>
<RoutingRule>
<Condition>
<HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
</Condition>
<Redirect>
<HostName>yourdomainname.com</HostName>
<ReplaceKeyPrefixWith>#!/</ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>
</RoutingRules>
My angular app is then using html5 routing to match the redirect rules:
In app.module.ts:
RouterModule.forRoot(appRoutes, { useHash: true })
This combination works well, with the exception of displaying an image in the assets folder of the website. This is in my navbar:
<img src="./assets/logo.png" id="group-ed-logo" />
I am using the angular-cli, which has the following in the angular-cli.json:
"assets": [
"assets",
"assets/logo.png",
"favicon.ico",
"logo.png"
],
Edit: I have added logo.png to the above and put the logo.png file at the root directory of the src file and then used:
<img src="logo.png" id="group-ed-logo" />
The logo then displays. It would be tidier to have the images in an assets folder. However, it may be that the angular-cli currently doesn't support assets in folders when using html 5 routing.
If the file is in the assets directory, then I am getting a 404 url not found: "http://www.myurl.com/#/assets/logo.png".
For folders, in the bucket 'Create a folder' then add your files to that bucket.
Also, if you drag and dropped the whole dist folder, you may be looking at the inside of the dist folder on the AWS UI, not realizing that you are in the dist folder. Copy only the contents of the dist folder, not the dist folder. -- This happened to me.
In my application I have some local images. I can see my images when test in google developer tools with ionic serve and even in genymotion simulator with android 4.4.4 and 4.2.2. but when I install my app on real android device ( I try on Samsung Galaxy S3 and Samsung Galaxy Ground Neo) I can't see my images.
My folder structure is like this:
www
index.html
app
book
book.html
images
icon.png
and in my book.html I try the following url for loading image:
<img src="app/book/images/icon.png">
<img src="../../images.icon.png">
I also move icon.png to root folder inside index.html and try this:
<img src="icon.png">
but it doesn't work.
The way that HTML structure works is that is that you always need to call your files relative to your current file. For example, if your structure looks like:
- index.html
- folder
-image.png
You would need to say src="image.png". So in your case, you do not have to reference the root directory (folder). You can just say images/icon.png. To reference an upper level folder (if it were in the root), you could say ../../icon.png, using ../ for each subsequent folder.
I had the same problem. my images are stored in www\assets\images. I was using the path ../../assets/images/myimg.png and worked in ripple but not when deployed to my android device.
The solution that worked for me was removing the relative path and using assets/images/myimg.png