Comments (7)
The other concern I have about is image file size the editor supports. As I read in many places, base64 image strings is only good for small images.
from bootstrap-wysiwyg.
@qiulang is this mostly to overcome the need to access the raw stream of an upload vs using the regular file post methods?
There are a lot of advantages over using the base64 string - such as not needing a library to manage the image preview in the browser and allowing for cut-and-paste from other sources like editing apps.
Do we just need to provide some better examples of how to handle the file upload?
from bootstrap-wysiwyg.
@qiulang as @steveathon states, I believe the idea behind this entire package is to keep things as simple as possible and therefore limit dependencies and therefore allow for its use in the largest range of environments.
That being said, there is nothing preventing you from converting the base64 string your server receives and turning into a stand-alone image stored somewhere on your server and modifying the resultant HTML code to point to that image instead of in-lining it.
I'm not sure what your particular use case is, but (I imagine) this would be fairly trivial to do with PHP. If you could provide us with more details of what you're trying to accomplish, perhaps we could point you in the right direction.
from bootstrap-wysiwyg.
@steveathon @kaptainkommie, thanks for answering my question. In my particular case it is
to overcome the need to access the raw stream of an upload
and just like you said we actually
converting the base64 string on my server and turning into a stand-alone image stored somewhere on my server and modifying the resultant HTML code to point to that image instead of in-lining it.
I do have a question, as you guys said "there are advantages over using the base64 string". So what is the advantage of using base64, except it is simple ?
from bootstrap-wysiwyg.
Somewhat true. Base64 images are in their raw state when they sit in the editor - that means that if you upload a 1.6GB gigapixel image then it will indeed sit in browser memory until it has finished submitting to the server. This can be hell on a browser.
It's a trade off that works when you're uploading images, when you edit an existing set of content that already has an image in it, it doesn't load the base64 string to do the work - it only uses the or other media tag. That means you're cutting out that bloat.
So it's a mixed bag yes, but it's an effective way of dealing with it in the editor until it's uploaded.
Some examples we could add would be:
- Dealing with stream in language X (What language are you using btw)
- How to background upload images in a contenteditable=yes div (This is probably only few lines of code that would need some variables added to the setup of the editor itself... perhaps a plugin could work here)
- Preventing image paste in the editor. Perhaps a config option for some compatibility support.
With the last one, you'll need to work out how to upload images and then have code to go fetch images, insert them as tags, etc. Feels like more work in the long run. An example of how to stream the image upload is probably better in the short term.
from bootstrap-wysiwyg.
Also just noticed in @kaptainkommie's post.
That being said, there is nothing preventing you from converting the base64 string your server receives and turning into a stand-alone image stored somewhere on your server and modifying the resultant HTML code to point to that image instead of in-lining it.
I think this is the best course of action - if you can background upload the images in the editor. Perhaps what is missing from the editor is an event firing when an image is pasted.
from bootstrap-wysiwyg.
@steveathon Isn't insertFiles() fired when an item is dropped onto the editor?
from bootstrap-wysiwyg.
Related Issues (20)
- Bootstrap Version HOT 4
- bootstrap-wysiwyg-4 npm install error HOT 2
- Release updated version of the project.
- Clicking for cancel not work! HOT 1
- Semantic Web support HOT 1
- Image size restriction increases file size HOT 4
- Filter Images HOT 1
- Switch to html source button
- Where is Official Maintained Code? HOT 1
- Wrong 'saveSelection' HOT 3
- Document and fix cleanHtml
- Expose API to allow bulding on top of the plugin
- Add 'target' attribute to hyperlink.
- Force default font size HOT 1
- Expand the DIV
- touchend is never executed cause (!this.getCurrentRange) is never true
- Unused options
- Spell checking plugin HOT 1
- What's with all the weird emails on the wiki?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bootstrap-wysiwyg.