I'm generating a pdf on server-side using Meteor SSR and node html-pdf library.
My problem is I can't load images from localhost. I'm trying to get the path to the image using Meteor.absoluteUrl, like below:
var imageUrl = Meteor.absoluteUrl( 'images/logo1.png' );
which resolves to http://localhost:3000/images/logo1.png, when I access this url directly on the browser it return the image. But it doesn't load rendering the html with SSR.
If I image source for an external image it resolves.
Is it possible to render images from localhost using Meteor SSR?
Thank you.
Edit
It is working on the pdf, but it doesn't work if I send the html response to the browser like this:
response.writeHead( 200, {'Content-Type': 'text/html'} );
response.end( html );
You need to put your image in the public folder. The url you are aiming for is pointing to your public/images/logo1.png app folder.
if you need your image to be private, I advise you to choose, depending on your image size, a blob storing in the mongoDB or a gridFS storage (if your images can be bigger than 16mb), using collectionFS or file-collection packages.
Related
Locally I got:
The deployed version I got:
I'm not sure why the service URL is added before the image URL.
And the wired thing is the dynamic url path does not load correctly while the static path works well.
I guess it might have to do with the path redirection so below is my setting:
I'm running API tests using GitHub Actions and I want to upload to the report generated by Mochawesome to Google Cloud so I can see failures clearly without digging through CI logs. I have the upload part working but when I view the html file on Google Cloud it doesn't load, I just get a blank white page. I'm uploading the css files too so why isn't the html file loading?
Using cdn for assets resolves the isssue .mocharc.js:
module.exports = {
reporter: 'node_modules/mochawesome',
'reporter-option': [
'cdn=true',
'timestamp=true'
],
};
When you're creating a file using the Cloud Storage API , set the mime_type to 'text/html' and skip the content_disposition.
You can manually edit the metadata to set the proper type, which is text/css for CSS files. If the type is neither specified nor auto-detected at upload time, Google Cloud Storage serves files as binary/octet-stream which may prevent the browser from properly rendering it.
Alternatively, you can also specify the MIME type in HTML, e.g.,
<link rel="stylesheet" href="css/theme.css" type="text/css">
to make sure that the browser handles it appropriately.
Here are a few examples with similar implementation:
Run HTML file from Google Cloud URL
Serve HTML file
Website host HTML file page
So I'm trying to build an offline-first application with Firebase storage images but am running into an issue. I don't want the user to know when an image is being uploaded to Firebase or not and I want to show the image from the user's local storage immediately. Basically, I want the app to render the local storage image if the image isn't uploaded yet.
I currently use CachedNetworkImage but this requires that the image has been uploaded.
I could create the image URL before uploading it and somehow reference that URL with the local image but I'm not sure how to go about doing that. Any thoughts?
Edit:
I think I'm going to go with this approach: https://www.youtube.com/watch?v=vzrP93xNW8g
It's basically using Firestore track what's been uploaded or not.
Without code we're guessing of course, but making some assumptions here...
Assuming this means not all images will be in their local storage forever:
Could you simply check if an image exists in firebase and if it doesn't present the local image? That is, conditionally build a vanilla Image widget pulling from local storage or a CachedNetworkImage from a URL based on a variable. Perhaps you have a MyImage object with a URL property and pick which widget to build by checking if that is null in the build function.
I have images stored in my AWS S3 and I would like to display it to a user. What is the most efficient way of doing that? Should I get the image url or download the image itself and display.
There are like 1000 images which need to be displayed.
Front-end - Angular
framework - .netcore
It depends on the permissions you have on your bucket. If it's public, then just link directly to the files in AWS. If it's private, then you'll have to download them with something that does have access (such as your app) and serve them to the user from there.
I have a small query. I wrote a Flex Application with PHP remoting using ZendAMF. i also made and auth system. User provides credentials and i pass them to my gateway where i have a service registered to query a SQL db and verify if the user is registered or not. Thats working perfectly. In my application i am loading MRTG graphs (PNG Files) into Image component. The GRAPHS are inside my Document Root. They are also loading well. Problem is if i type the URL path to the png file i can see it directly without any authentication. to cater that i added htaccess file to MRTG folder inside my document root. Know when i view the images inside my Flex App it asks for HTTP username and password. which i dont want.
In simple words . MRTG PNG's are inside my document root
Can i move them out of document root and still have my Flex App access them ( i tried and failed with that)
I just want the user to be able to view MRTG pngs and not directly from URL.
If you are using ZendAMF, why don't you just create a service method on your service that provides you with those images?
That way you have full control over what happens.
For example you could send them through as a byte array or a base64 encoded string, making it a lot harder to define where the image is actually stored on server disk.
Cheers