Develop Reference

Getting unwanted base64 when require('image.dir')

I have a project structure with two separate folders, one for the backend and the other one for the frontend.
I'm trying to generate PDFs with an image inside comming from the public file of the frontend.
I'm getting it with my actual image path put into a require('').
getImagesRequire(state) {
state.images.forEach( el => {
el.src = require(`#/assets/${el.dir}`)
})
return state.images;
}
It's working perfectly for all images in that list but one, when that original path is sent through the require('') it's returning the base64 code of the image, and I don't understand where it's coming from. I'm thinking maybe it comes from the file but it's png like every other image file... Any insight welcome

Use Messenger SDK to send file data

I have a webview that opens from a messenger bot.
From the webview I want to send image data to the conversation (no URL - data coming from the canvas).
I tried to use Messenger SDK beginShareFlow with file data attachment:
function uploadImage(data) {
let message = {
"attachment": {
"type": "image",
"payload": {
"is_reusable": true
},
"filedata": data
}
};
MessengerExtensions.beginShareFlow(function (share_response) {
// User dismissed without error
if (share_response.is_sent) {
// The user actually did share.
//close the webview
MessengerExtensions.requestCloseBrowser(function success() {
// webview closed
}, function error(err) {
console.log(err);
});
}
},
function (errorCode, errorMessage) {
// An error occurred in the process
console.log(errorMessage);
},
message, "current_thread");
}
But I get an error:
Messenger Extensions unexpected error.
Would appreciate help =]
EDIT:
I found out that filedata is used to transfer a file location (which I do not have).
So I tried other solutions:
I created from my cavas blob, and tried to pass it in filedata - did not work
I created a blob file (by adding name and date) and tried to move the location - did not work
I created a url from blob and tried to move it as a url (not as filedata) - and got an error:
Invalid image URL provided in message content
When I go to the blob url from the browser I see the image =[

Per the SDK's section on sending attachments:
There are three ways to attach an asset to a message:
URL
File
attachment_id
The attachment_id refers to previously uploaded URL/File attachments. Sending raw file data is not an option. You must either upload the image to a URL or save it to a file. Blob URLs do not work because they refer only to data stored in the local system's memory. You need to move that data to an image or file on a server.
Upload the image to a URL
Your first option is to upload the image to a URL. Depending on how private the contents of the image are, you could use a public image hosting service like imgur, or you could upload the image to a public location on your server. If you want to keep the image hidden, you could save the image at a URL containing a randomly generated hash and delete that file as soon as the attachment has been uploaded to Messenger. However, you could keep the image totally private with the second option:
Upload the image from a (temp) file
Your second option is to upload the image according to a file location. By uploading the image to a file on your server, you could avoid the image ever becoming visible to the public. To avoid filling up server space, you could manually delete the file once the attachment has uploaded, or you could use a temp file. In fact, the SDK's example for sending a file demonstrates sending a temporary file saved in the /tmp folder.

Store an uploaded image to Github using NodeJS and Github API

Been Struggling to try to push an Image to my repo on Github using NodeJS and Github API, I've covered the part of creating the SHA,Commit Tree and everything, the only thing left is to pass the image to the API and saving it as an actual Image (e.g test.png)
What I did so far is retrieving the image like below:
reader.onload = (e) => {
image = reader.result.split(',')[1]
}
Then sending it to the NodeJS server to get Sent to Github, but it's only stored as test.jpg but the content is not an actual Image but just :
/9j/4AAQSkZJRgABAQAASABIAAD/4QBARXhpZgAATU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqA.....
Any help?

Based on this blog post, you might have to add ?raw=true to the end of the src url. Alternately, I found a hack on a previous SO answer.

Okay solved it! the only thing that I had to add is to actually convert the base64 content to Binary using this:
var data = Buffer.from(b64string, 'base64');
And then sending this data to a commit which worked perfectly!

upload image from local computer and saving them to a folder with redactor in meteorjs

I am using redactor plugin with meteorjs, to format the texts and add images, videos and links.Redactor supports uploading images as a web link, but here I wanted to add a button to upload images from local machine. For this I have added the button to the redactor. It is showing the browse image selection and is working.
$('.editor').redactor({
imageUpload:"/upload",
imageUploadCallback: function(image, json)
{
console.log(image);
console.log(json);
},
imageUploadErrorCallback: function(json)
{
console.log(json.error);
}
});
When I print console.log("#redactor_file").val()); it gives the name of the file. But, when I do console.log(console.log(html);) its gives <p><img src="undefined"></p>. Can I get the link or the url of the image here. If yes then how?
HTTP.methods({
'upload': function(data) {
console.log(data)
return JSON.stringify( {'data':"data"})
}
});
When I do console.log(data) using the above code it shows me Image in String format. Now I want to store the Image using GridFS. Or is there any better way to store Image in MongoDB. If yes then tell me or guide me to store image using GridFS ?

While Redactor provides a client-side method for uploading files, it does not provide a server-side method for receipt of uploaded files. Also, stock Meteor doesn't provide such a method either.
So you have a few choices. First is through using a router such as Iron Router, which you could create a server-side /uploads route, and Iron Router gives you access to the request, response objects. Which might work, but because this is no longer over DDP, you don't have access to Meteor.userId, etc. See How to respond server-side to routes using Meteor and Iron-Router?
A more Meteor-like way of doing the file upload is Meteor File or CollectionFS though I'm not sure how simply these would integrate with Redactor. You could definitely get them to work together, just off the top of my head I don't know how easy it would be.

Upload image from current HTML page

I have an image on my HMTL page. This is generated by DevExpress library at runtime and the src url points to a DevExpress script with a cache key:
<img id="Chart_89_IMG" src="/DXB.axd?DXCache=30f02093-de66-4ed6-8557-2382065c701a" />
I'm trying to get this file onto the server in a subsequent form post to use in an email. I've tried just passing the url in my form, but by the time it gets to the server, I get a 404 (assuming the cache key is expired).
I've also tried using canvas to get the bytes and pass that to the server, but was having trouble converting that byte stream back to an image, and canvas won't work for IE8, which I need to support.
My last idea was to include a file upload input on my form and pass the image to the server that way. But, how can I create a file from an image in javascript to use as an upload?
Any other ideas would be appreciated too!

Since this was DevExpress, I was able to change the BinaryStorageMode to the session:
settings.BinaryStorageMode = BinaryStorageMode.Session;
Then after I posted the form, the chart's bytes were accessible in the Session:
byte[] bytes = ((DevExpress.Web.ASPxClasses.BinaryStorageData)HttpContext.Current.Session[sessionKey]).Content;