কীভাবে জাভাস্ক্রিপ্টে ব্লবকে ফাইলে রূপান্তর করবেন

Question

আমার নোডেজেএস সার্ভারে কিছু ডিরেক্টরিতে একটি চিত্র আপলোড করতে হবে। আমি তার connect-busboyজন্য নোড মডিউল ব্যবহার করছি।

dataURLনীচের কোডটি ব্যবহার করে আমার যে চিত্রটি প্রসারণে রূপান্তরিত হয়েছে তা আমার ছিল :

dataURLToBlob: function(dataURL) {
    var BASE64_MARKER = ';base64,';
    if (dataURL.indexOf(BASE64_MARKER) == -1) {
        var parts = dataURL.split(',');
        var contentType = parts[0].split(':')[1];
        var raw = decodeURIComponent(parts[1]);
        return new Blob([raw], {type: contentType});
    }
    var parts = dataURL.split(BASE64_MARKER);
    var contentType = parts[0].split(':')[1];
    var raw = window.atob(parts[1]);
    var rawLength = raw.length;
    var uInt8Array = new Uint8Array(rawLength);
    for (var i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
    }
    return new Blob([uInt8Array], {type: contentType});
}

আমার ছবিটি আপলোড করার জন্য ব্লবকে কোনও ফাইলে রূপান্তর করার একটি উপায় প্রয়োজন।

কেউ কি আমাকে এতে সাহায্য করতে পারে?

Comments

ফাইলগুলি হ'ল ব্লবস, কেবল মেটা বৈশিষ্ট্যগুলি পরীক্ষা করে দেখুন এবং আপনি ভাল।

— ডান্ডাভিস

কোনও ব্লব যখন এটি আপলোড করা হয় তখন ডিফল্ট blob। তাই, আমি প্রথম ফাইলটি আমি ফসল তোলা হয়েছিল তার নাম নিষ্কাশিত এবং তারপর একই দিলেন filenameযাতে মুণ্ডিত ফাইল যখন করে সার্ভারে এটি আপলোড form.append("blob",blob, filename);।

— লাফালাফি

নীচের উত্তর আমার উত্তর কি সাহায্য করেছেন? তাই, দয়া করে এটি সঠিক উত্তর হিসাবে চিহ্নিত করুন।

— সিবিআর

Answer 1

এই ফাংশনটি একটিকে একটিতে রূপান্তর Blobকরে Fileএবং এটি আমার পক্ষে দুর্দান্ত কাজ করে।

ভ্যানিলা জাভাস্ক্রিপ্ট

function blobToFile(theBlob, fileName){
    //A Blob() is almost a File() - it's just missing the two properties below which we will add
    theBlob.lastModifiedDate = new Date();
    theBlob.name = fileName;
    return theBlob;
}

টাইপস্ক্রিপ্ট (সঠিক টাইপ সহ)

public blobToFile = (theBlob: Blob, fileName:string): File => {
    var b: any = theBlob;
    //A Blob() is almost a File() - it's just missing the two properties below which we will add
    b.lastModifiedDate = new Date();
    b.name = fileName;

    //Cast to a File() type
    return <File>theBlob;
}

ব্যবহার

var myBlob = new Blob();

//do stuff here to give the blob some data...

var myFile = blobToFile(myBlob, "my-image.png");

Comments

আমার মনে হয় কাস্টটি প্রথমে হওয়া উচিত তাই আপনার anyটাইপস্ক্রিপ্ট ব্যবহার করার দরকার নেই । এই উদাহরণটি দেখুন ।

— স্টাইলফেল

এটি সমস্ত উদ্দেশ্যে কাজ করে না। একটি এজ্যাক্স কলটিতে এই "ফাইল" যুক্ত করা ফাইলের নামটি সঠিকভাবে সেট করবে না।

— জ্যাকব পল রিচার্ড

এটি একটি ভাল সমাধান নয়, উত্পাদিত অবজেক্টটি এখনও একটি ব্লব।

— সিজাপে

শুধু যোগ b.__proto__ = File.prototype, এবং আপনার সমাধান স্বপ্নে হয়ে যে এমনকি ঠাট b instanceOf Fileথেকেtrue

— manuelnaranjo

এটি গ্রহণযোগ্য উত্তর হওয়া উচিত নয়, স্ট্যাকওভারফ্লো . com/ a / 53205768/ 2557517 বা স্ট্যাকওভারফ্লো . com / a/ 31663645 / 2557517 হওয়া উচিত।

— কিরা

Answer 2

আপনি ফাইল নির্মাণকারী ব্যবহার করতে পারেন:

var file = new File([myBlob], "name");

ডাব্লু 3 স্পেসিফিকেশন অনুযায়ী ব্লবটি নতুন ফাইল অবজেক্টের জন্য বাইটগুলিতে অন্তর্ভুক্ত থাকবে এবং নির্দিষ্ট নামটি দিয়ে ফাইলটি তৈরি করবে http://www.w3.org/TR/FileAPI/#dfn-file

Comments

এটি আমি যা খুঁজছিলাম, তার মধ্যে একটি পার্থক্যটি হ'ল প্রথম যুক্তিটি আসলে একটি অ্যারে তাই আমি এটি ব্যবহার করেছি: var ফাইল = নতুন ফাইল ([আমার ব্লব], "নাম");

— মাইকেলডকুনি

হ্যাঁ. আমি এই সমাধানটিও খুঁজছি। স্ট্যাম্পলে সার্ভার ব্লব অবজেক্ট থেকে ফাইলের নাম পেতে পারে না। সুতরাং আমি এটি ফাইল এ ফিরে রূপান্তর করা প্রয়োজন। তবে সাফারি ফাইল এপিআই সমর্থন করে না ... এখন 0-এ ফিরে :(

— হিউ হাউ

ফাইল কন্সট্রাক্টররা উদাহরণস্বরূপ ফ্যান্টমজেএসে কাজ করেন না:TypeError: FileConstructor is not a constructor (evaluating 'new File([''], 'file.pdf', {'size': 1000, 'type': 'application/pdf'})')

— বিকেমিনিচ

এজতে বর্তমানে (2017-10-04) একটি বাগ রয়েছে যা এই নির্মাণকারীর ব্যবহারকে বাধা দেয়। বিকাশকারী.মাইক্রোসফট.ওনস

— মাইক্রোসফ্ট

ফাইলের প্রকারটি যুক্ত করার বিষয়ে নিশ্চিত হন, অন্যথায় এটি সঠিকভাবে কাজ করবে না। নতুন ফাইল ([আমারব্লব], "নাম", {প্রকার: "চিত্র / জেপিগ",});

— বার্নার্ডা

Answer 3

জোশুয়া পি নিক্সনের উত্তর সঠিক তবে আমাকে শেষ বারের পরিবর্তিত তারিখও নির্ধারণ করতে হয়েছিল। সুতরাং এখানে কোড।

var file = new File([blob], "file_name", {lastModified: 1534584790000});

1534584790000 " GMT: শনিবার, 18 আগস্ট, 2018 9:33:10 এএম " এর একটি ইউনিক্স টাইমস্ট্যাম্প

Comments

instanceofগৃহীত উত্তরের মতো ভঙ্গ না করার জন্য পয়েন্টগুলি

— ম্যাট জেনসেন

Answer 4

আমার কাজ করার জন্য আমাকে স্পষ্টভাবে প্রকারটি সরবরাহ করতে হয়েছিল যদিও এটি করার মাধ্যমে এটি অঙ্কুরের মধ্যে রয়েছে:

const file = new File([blob], 'untitled', { type: blob.type })

Answer 5

আমার আধুনিক রূপ:

function blob2file(blobData) {
  const fd = new FormData();
  fd.set('a', blobData);
  return fd.get('a');
}

Comments

ফলস্বরূপ ফাইল ব্যবহারের জন্য একটি ফাইলের নাম যুক্ত করতে:fd.set('a', blobData, 'filename')

— jooguerravieira

এটি কোনও আইওএস ডিভাইসে ব্যর্থ হয় যখনfd.set

— গান করুন

ধন্যবাদ। এটি কাজ করে, এখন আমাকে ব্লবকে ফাইলে রূপান্তর করতে হবে না।

— xreyc_developer22

Answer 6

FileSaver.js github প্রকল্পে ব্যবহার saveAsকরুন ।

FileSaver.jssaveAs()স্থানীয়ভাবে এটি সমর্থন করে না এমন ব্রাউজারগুলিতে ফাইলসেভার ইন্টারফেস প্রয়োগ করে ।

Answer 7

টাইপরাইটারে মুদ্রি

public blobToFile = (theBlob: Blob, fileName:string): File => {       
    return new File([theBlob], fileName, { lastModified: new Date().getTime(), type: theBlob.type })
}

জাভাস্ক্রিপ্ট

function blobToFile(theBlob, fileName){       
    return new File([theBlob], fileName, { lastModified: new Date().getTime(), type: theBlob.type })
}

আউটপুট

File {name: "fileName", lastModified: 1597081051454, lastModifiedDate: Mon Aug 10 2020 19:37:31 GMT+0200 (Eastern European Standard Time), webkitRelativePath: "", size: 601887, …}
lastModified: 1597081051454
lastModifiedDate: Mon Aug 10 2020 19:37:31 GMT+0200 (Eastern European Standard Time) {}
name: "fileName"
size: 601887
type: "image/png"
webkitRelativePath: ""
__proto__: File