从具有正确内容类型的JsZip中提取图像
从具有正确内容类型的JsZip中提取图像
提问于 2018-06-14 08:13:59
我正在尝试从zip文件中提取pngs文件，以便上传到服务器。我的问题是，我加载的blob具有错误的内容类型，因此服务器会拒绝它们。
谁能告诉我如何更改blob上的内容类型，或者如何将文件提取为图像
下面是我提取它们的方法
JSZip.loadAsync(file)
.then(function (zip) {
const re = /(.jpg|.png|.gif|.ps|.jpeg)$/
const dataFile = /(.json)$/
const promises = Object.keys(zip.files).filter(function (fileName) {
return re.test(fileName.toLowerCase())
}).map(function (fileName) {
const file = zip.files[fileName]
return file.async('blob').then(function (blob) {
return [
fileName,
URL.createObjectURL(blob),
]
})
})
const jsonPromise = Object.keys(zip.files).filter(function (fileName) {
return dataFile.test(fileName.toLowerCase())
}).map(function (fileName) {
const file = zip.files[fileName]
return file.async('string').then(function (data) {
return [
'data',
data,
]
})
})
promises.push(jsonPromise[0])
return Promise.all(promises)
}).then(function (result) {
return result.reduce(function (acc, val) {
acc[val[0]] = val[1]
return acc
}, {})
}).then((result)=>{
const object = JSON.parse(result.data)
for(let i in object.images)
object.images[i].url = result[object.images[i].name]
resolve(object)
}).catch((err)=>{reject(err)})})
然后，我获得blob url并尝试上传它。
fetch(blobURL).then(res => res.blob()).then((blob)=>{
blob.lastModifiedDate = new Date()
blob.name = 'model_' + id + '_' + uuidv1() + '.png'但是这个blob是contentType‘纯文本’，而它应该是一个png。
回答 1
Stack Overflow用户
发布于 2018-06-14 08:51:30
我将斑点绘制为图像，转换为画布并上传到..尽管这看起来是一个不优雅的解决方案
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
const img = new Image()
img.onload = function () {
canvas.width = this.naturalWidth // update canvas size to match image
canvas.height = this.naturalHeight
ctx.drawImage(this, 0, 0)
uploadFromCanvas(canvas,hotspot).then(resolve)
}
img.src = blobURL})
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50847944
复制相关文章
相似问题
腾讯云开发者
