使用 Angular 的 ngx-quill-upload,如何用 http-url 替换 base64-url
ngx-quill-upload with Angular, how to replace the base64-url with a http-url
我使用 angular12、ngx-quill-upload 和 quill 编辑器来上传用户帖子。我正在尝试将图像上传到服务器,然后将 url 嵌入到 htmlstring 并将 htmlstring 保存到数据库。我可以成功地将图像上传到服务器,但是,当我将 html 字符串保存到数据库时,html 字符串仍然包含 base64 字符串而不是图像 url。如何禁用 base64 字符串但使用 URL?
这是我的 imageHandler:
imageHandler: {
upload: (file) => {
return new Promise((resolve, reject) => {
if (file.size < 1000000) { // Customize file size as per requirement
console.log("my sas is : " + this.imagesas);
this.blobService.uploadImage(this.imagesas, file, file.name,() => {}).
then(()=>{
resolve("https://example.blob.core.windows.net/post-images/"+file.name)
})
.catch(
()=>{
reject("error")
}
);
let url = "https://example.blob.core.windows.net/post-images/"+file.name;
console.log(url);
} else {
reject('Size too large');
}
});
},
accepts: ['png', 'jpg', 'jpeg', 'jfif', 'apng', 'bmp', 'gif', 'ico', 'cur', 'pjpeg', 'pjp', 'svg', 'tif', 'tiff', 'webp'] // Extensions to allow for images (Optional) | Default - ['jpg', 'jpeg', 'png']
} as Options,
如果您将其设置为 json 而不是 html,则更容易做到。这就是我所做的:
ReplaceBaseWithAddress(jsonstring: string) {
let data: QuillVM = JSON.parse(jsonstring);
let baseStrings: string[] = [];
if (data.ops.length > 1) {
for (let ctr = 0; ctr < data.ops.length; ctr++) {
if (data.ops[ctr].insert.image) {
let dataimage = data.ops[ctr].insert.image.split(",");
data.ops[ctr].insert.image = "BASE 64 replaced image with address location here";
if (dataimage[1]) {
let image64string:string = dataimage[1];
baseStrings.push(image64string);
}
}
}
}
}
我希望其他人找到更好的方法。
我使用 angular12、ngx-quill-upload 和 quill 编辑器来上传用户帖子。我正在尝试将图像上传到服务器,然后将 url 嵌入到 htmlstring 并将 htmlstring 保存到数据库。我可以成功地将图像上传到服务器,但是,当我将 html 字符串保存到数据库时,html 字符串仍然包含 base64 字符串而不是图像 url。如何禁用 base64 字符串但使用 URL?
这是我的 imageHandler:
imageHandler: {
upload: (file) => {
return new Promise((resolve, reject) => {
if (file.size < 1000000) { // Customize file size as per requirement
console.log("my sas is : " + this.imagesas);
this.blobService.uploadImage(this.imagesas, file, file.name,() => {}).
then(()=>{
resolve("https://example.blob.core.windows.net/post-images/"+file.name)
})
.catch(
()=>{
reject("error")
}
);
let url = "https://example.blob.core.windows.net/post-images/"+file.name;
console.log(url);
} else {
reject('Size too large');
}
});
},
accepts: ['png', 'jpg', 'jpeg', 'jfif', 'apng', 'bmp', 'gif', 'ico', 'cur', 'pjpeg', 'pjp', 'svg', 'tif', 'tiff', 'webp'] // Extensions to allow for images (Optional) | Default - ['jpg', 'jpeg', 'png']
} as Options,
如果您将其设置为 json 而不是 html,则更容易做到。这就是我所做的:
ReplaceBaseWithAddress(jsonstring: string) {
let data: QuillVM = JSON.parse(jsonstring);
let baseStrings: string[] = [];
if (data.ops.length > 1) {
for (let ctr = 0; ctr < data.ops.length; ctr++) {
if (data.ops[ctr].insert.image) {
let dataimage = data.ops[ctr].insert.image.split(",");
data.ops[ctr].insert.image = "BASE 64 replaced image with address location here";
if (dataimage[1]) {
let image64string:string = dataimage[1];
baseStrings.push(image64string);
}
}
}
}
}
我希望其他人找到更好的方法。