জাভাস্ক্রিপ্ট / এইচটিএমএল 5 এ এক্সেল ফাইলকে কীভাবে পার্স করবেন


136

আমি এর মাধ্যমে এক্সেল ফাইলটি পড়তে সক্ষম হয়েছি FileReaderতবে এটি পাঠ্যের পাশাপাশি অদ্ভুত অক্ষরগুলিও আউটপুট করে। আমাকে xlsফাইলটি সারি অনুসারে পড়তে হবে, প্রতিটি কলামে ডেটা পড়তে হবে এবং এটিকে JSON এ রূপান্তর করতে হবে।

কীভাবে xls ফাইল সারি সারি পড়তে হয়?



1
@ জোয়াচিমপাইলবার্গ: এটি প্রশ্নের উত্তর দেয় না। আমাকে একের পর এক এক্সিল ফাইল সারি পড়তে হবে। যদিও আমি ফাইলআরডার (এইচটিএমএল 5) ব্যবহার করে এটি পড়তে পারি তবে এখনও সারিগুলি ব্রাউজ করতে অক্ষম।
7:44 এ ডাকাত

উত্তর:


104

ফাংশনের নীচে এক্সেল শীট (এক্সএলএসএক্স ফর্ম্যাট) ডেটা জেএসএনে রূপান্তর করে। আপনি ফাংশন প্রতিশ্রুতি যোগ করতে পারেন।

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/jszip.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/xlsx.js"></script>
<script>
var ExcelToJSON = function() {

  this.parseExcel = function(file) {
    var reader = new FileReader();

    reader.onload = function(e) {
      var data = e.target.result;
      var workbook = XLSX.read(data, {
        type: 'binary'
      });

      workbook.SheetNames.forEach(function(sheetName) {
        // Here is your object
        var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
        var json_object = JSON.stringify(XL_row_object);
        console.log(json_object);

      })

    };

    reader.onerror = function(ex) {
      console.log(ex);
    };

    reader.readAsBinaryString(file);
  };
};
</script>

পোস্টের নীচে XLS ফর্ম্যাটের এক্সেল থেকে JSON জাভাস্ক্রিপ্ট কোডের কোড আছে?


1
এটি ক্রোমে বৃহত্তর এক্সেল ফাইলগুলির জন্য ক্র্যাশ হয়, এর জন্য কোনও ভাল সমাধান?
জেড

আপনার ফাইলটি কত বড় তা আমি জানতে পারি?
পেরু

6
e.target.result () e.target.result হওয়া উচিত বিকাশকারী.মোজিলা.আর.ইন.ইউএস
ডকস / ওয়েব

3
আমার জন্য, আমাকে jszip.jsআগে স্ক্রিপ্ট ঘোষণা করতে হয়েছিল xlsx.js
ফ্লোরিন ভার্দোল

1
আমি কীভাবে পাবলিক ভেরিয়েবলকে json_object বরাদ্দ করতে এবং লুপের বাইরে এটি অ্যাক্সেস করতে পারি?
শারদুল

109

পুরানো প্রশ্ন, তবে আমার মনে রাখা উচিত যে জাভাস্ক্রিপ্ট থেকে এক্সএলএস ফাইলগুলি পার্স করার সাধারণ কাজটি ক্লান্তিকর এবং কঠিন তবে অসম্ভব নয়।

খাঁটি জেএসে আমার প্রয়োগ করা বেসিক পার্সার রয়েছে:

উভয় পৃষ্ঠা হ'ল এইচটিএমএল 5 ফাইল-এপিআই-চালিত এক্সএলএস / এক্সএলএসএক্স পার্সার (আপনি নিজের ফাইলটি টানুন-ড্রপ করতে পারেন এবং এটি কমা-বিচ্ছিন্ন তালিকায় কোষের ডেটা মুদ্রণ করবে)। আপনি জেএসওএন অবজেক্টও তৈরি করতে পারেন (ধরে নিলে প্রথম সারিটি শিরোনাম সারি)।

পরীক্ষার স্যুট http://oss.sheetjs.com/ এ এমন একটি সংস্করণ দেখায় যা ফাইলগুলি পেতে এবং পার্স করতে এক্সএইচআর ব্যবহার করে।


4
আপনি যদি উত্তরে কিছু নমুনা কোড যুক্ত করতে পারতেন তবে এটি আরও ভাল করে তুলতে চাই (আপনি যদি গ্রন্থাগারগুলির নেতা হন তবে ডায়াক্লেইমার যুক্ত করুন)।
acdcjunior

3
আমি এই psjinx.com/programming/2014/01/04/… :) সম্পর্কে ব্লগ করেছি
পঙ্কজ 28843

আমরা জেএস-এক্সএলএসএক্সের সাহায্যে কয়েকটি শীর্ষ সারি এবং এক্সএলএসএক্সের কলামগুলি এড়িয়ে যেতে পারি?
মায়াঙ্ক

19

excel fileএখানে একটি আপলোড করুন এবং আপনি এখানে JSONফর্ম্যাটে ডেটা পেতে পারেন console:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/jszip.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/xlsx.js"></script>
<script>
    var ExcelToJSON = function() {

      this.parseExcel = function(file) {
        var reader = new FileReader();

        reader.onload = function(e) {
          var data = e.target.result;
          var workbook = XLSX.read(data, {
            type: 'binary'
          });
          workbook.SheetNames.forEach(function(sheetName) {
            // Here is your object
            var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
            var json_object = JSON.stringify(XL_row_object);
            console.log(JSON.parse(json_object));
            jQuery( '#xlx_json' ).val( json_object );
          })
        };

        reader.onerror = function(ex) {
          console.log(ex);
        };

        reader.readAsBinaryString(file);
      };
  };

  function handleFileSelect(evt) {
    
    var files = evt.target.files; // FileList object
    var xl2json = new ExcelToJSON();
    xl2json.parseExcel(files[0]);
  }


 
</script>

<form enctype="multipart/form-data">
    <input id="upload" type=file  name="files[]">
</form>

    <textarea class="form-control" rows=35 cols=120 id="xlx_json"></textarea>

    <script>
        document.getElementById('upload').addEventListener('change', handleFileSelect, false);

    </script>

এটি নিম্নলিখিত Stackoverflowপোস্টগুলির সংমিশ্রণ :

  1. https://stackoverflow.com/a/37083658/4742733
  2. https://stackoverflow.com/a/39515846/4742733

শুভকামনা ...


14

এই কোডটি আপনাকে সহায়তা করতে পারে
বেশিরভাগ সময় jszip.js কাজ করে না তাই আপনার জেএস কোডে xlsx.full.min.js অন্তর্ভুক্ত করুন।

এইচটিএমএল কোড

 <input type="file" id="file" ng-model="csvFile"  
    onchange="angular.element(this).scope().ExcelExport(event)"/>

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/xlsx.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/jszip.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.10.8/xlsx.full.min.js">
</script>

$scope.ExcelExport= function (event) {


    var input = event.target;
    var reader = new FileReader();
    reader.onload = function(){
        var fileData = reader.result;
        var wb = XLSX.read(fileData, {type : 'binary'});

        wb.SheetNames.forEach(function(sheetName){
        var rowObj =XLSX.utils.sheet_to_row_object_array(wb.Sheets[sheetName]);
        var jsonObj = JSON.stringify(rowObj);
        console.log(jsonObj)
        })
    };
    reader.readAsBinaryString(input.files[0]);
    };

এক্সেল শিটের পাশাপাশি আমি চিত্রগুলি আপলোড করতে চাইলে কী হবে
ময়ূর আগরওয়াল

9

আপনি যদি কোনও ব্রাউজারে * .xlsx ফাইলটি পড়ার সহজতমতমতম উপায় চান তবে এই গ্রন্থাগারটি এটি করতে পারে:

https://catamphetamine.github.io/read-excel-file/

<input type="file" id="input" />
import readXlsxFile from 'read-excel-file'

const input = document.getElementById('input')

input.addEventListener('change', () => {
  readXlsxFile(input.files[0]).then((data) => {
    // `data` is an array of rows
    // each row being an array of cells.
  })
})

উপরের উদাহরণে dataকাঁচা স্ট্রিং ডেটা। schemaযুক্তি দিয়ে পাস করে এটি কঠোর স্কিমা দিয়ে JSON এ পার্স করা যায় । এর উদাহরণের জন্য এপিআই ডক্স দেখুন।

এপিআই ডক্স: http://npmjs.com/package/read-excel-file


4

উপরের উত্তরের জন্য আপনাকে ধন্যবাদ, আমি মনে করি সুযোগ (উত্তরগুলির) সম্পন্ন হয়েছে তবে যে কেউ প্রতিক্রিয়া ব্যবহার করছে তার জন্য আমি একটি "প্রতিক্রিয়া উপায়" যুক্ত করতে চাই।

ImportData.js নামে একটি ফাইল তৈরি করুন:

import React, {Component} from 'react';
import XLSX from 'xlsx';
export default class ImportData extends Component{
    constructor(props){
        super(props);
        this.state={
            excelData:{}
        }
    }
    excelToJson(reader){
        var fileData = reader.result;
        var wb = XLSX.read(fileData, {type : 'binary'});
        var data = {};
        wb.SheetNames.forEach(function(sheetName){
             var rowObj =XLSX.utils.sheet_to_row_object_array(wb.Sheets[sheetName]);
             var rowString = JSON.stringify(rowObj);
             data[sheetName] = rowString;
        });
        this.setState({excelData: data});
    }
    loadFileXLSX(event){
        var input = event.target;
        var reader = new FileReader();
        reader.onload = this.excelToJson.bind(this,reader);
        reader.readAsBinaryString(input.files[0]);
    }
    render(){
        return (
            <input type="file" onChange={this.loadFileXLSX.bind(this)}/>
        );
    }
}

তারপরে আপনি রেন্ডার পদ্ধতিতে উপাদানটি ব্যবহার করতে পারেন যেমন:

import ImportData from './importData.js';
import React, {Component} from 'react';
class ParentComponent extends Component{
    render(){
        return (<importData/>);
    }
}

<ImportData/>নিজস্ব রাষ্ট্র ডেটা সেট হবে, আপনি Excel ডেটা "পিতা বা মাতা উপাদান" এ অনুসরণ করে প্রবেশ করতে পারবেন এই :


আমি মনে করি রিটার্নের বিবৃতিতে ট্যাগটি <ImportData/>পরিবর্তে হওয়া উচিত <importData/>। আমি প্রতিক্রিয়াটিতে মোটামুটি নতুন তবে আমি বিশ্বাস করি উপাদানগুলির নামগুলি সর্বদা বড় হয়ে থাকে। যাইহোক, উদাহরণটিতে আমদানি করার সময় সেই নামটিই ব্যবহৃত হয়।
রাহেন

3

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/jszip.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.0/xlsx.js"></script>
<script>
    var ExcelToJSON = function() {

      this.parseExcel = function(file) {
        var reader = new FileReader();

        reader.onload = function(e) {
          var data = e.target.result;
          var workbook = XLSX.read(data, {
            type: 'binary'
          });
          workbook.SheetNames.forEach(function(sheetName) {
            // Here is your object
            var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
            var json_object = JSON.stringify(XL_row_object);
            console.log(JSON.parse(json_object));
            jQuery( '#xlx_json' ).val( json_object );
          })
        };

        reader.onerror = function(ex) {
          console.log(ex);
        };

        reader.readAsBinaryString(file);
      };
  };

  function handleFileSelect(evt) {
    
    var files = evt.target.files; // FileList object
    var xl2json = new ExcelToJSON();
    xl2json.parseExcel(files[0]);
  }


 
</script>

<form enctype="multipart/form-data">
    <input id="upload" type=file  name="files[]">
</form>

    <textarea class="form-control" rows=35 cols=120 id="xlx_json"></textarea>

    <script>
        document.getElementById('upload').addEventListener('change', handleFileSelect, false);

    </script>


0

আপনি যদি কখনও ভেবে থাকেন যে সার্ভার থেকে কোনও ফাইল কীভাবে পড়বেন এই কোডটি সহায়ক হতে পারে।

বিধিনিষেধসমূহ:

  1. ফাইলটি সার্ভারে থাকা উচিত (স্থানীয় / দূরবর্তী)।
  2. আপনাকে হেডার সেটআপ করতে হবে বা CORS গুগল প্লাগইন রাখতে হবে।

<Head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script lang="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.12.4/xlsx.core.min.js"></script>
</head>

<body>
    <script>
    /* set up XMLHttpRequest */


    // replace it with your file path in local server
    var url = "http://localhost/test.xlsx";

    var oReq = new XMLHttpRequest();
    oReq.open("GET", url, true);
    oReq.responseType = "arraybuffer";

    oReq.onload = function(e) {
        var arraybuffer = oReq.response;

        /* convert data to binary string */
        var data = new Uint8Array(arraybuffer);

        var arr = new Array();
        for (var i = 0; i != data.length; ++i) {
            arr[i] = String.fromCharCode(data[i]);
        }

        var bstr = arr.join("");

        var cfb = XLSX.read(bstr, { type: 'binary' });

        cfb.SheetNames.forEach(function(sheetName, index) {

            // Obtain The Current Row As CSV
            var fieldsObjs = XLS.utils.sheet_to_json(cfb.Sheets[sheetName]);

            fieldsObjs.map(function(field) {
                $("#my_file_output").append('<input type="checkbox" value="' + field.Fields + '">' + field.Fields + '<br>');
            });

        });
    }

    oReq.send();
    </script>
</body>
<div id="my_file_output">
</div>

</html>

0

xslx.js, xlsx.full.min.js, jszip.js অন্তর্ভুক্ত করুন

ফাইল ইনপুটটিতে একটি অনভিজ্ঞ ইভেন্ট হ্যান্ডলার যুক্ত করুন

function showDataExcel(event)
{
            var file = event.target.files[0];
            var reader = new FileReader();
            var excelData = [];
            reader.onload = function (event) {
                var data = event.target.result;
                var workbook = XLSX.read(data, {
                    type: 'binary'
                });

                workbook.SheetNames.forEach(function (sheetName) {
                    // Here is your object
                    var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);

                    for (var i = 0; i < XL_row_object.length; i++)
                    {
                        excelData.push(XL_row_object[i]["your column name"]);

                    }

                    var json_object = JSON.stringify(XL_row_object);
                    console.log(json_object);
                    alert(excelData);
                })

            };

            reader.onerror = function (ex) {
                console.log(ex);
            };

            reader.readAsBinaryString(file);

}

-4

এক্সএলএস মাইক্রোসফ্ট দ্বারা ব্যবহৃত একটি বাইনারি মালিকানাধীন ফর্ম্যাট। কিছু নির্দিষ্ট গ্রন্থাগার বা অফিস ইন্টারপ ব্যবহার না করে সার্ভারের সাইড ভাষার সাথে এক্সএলএস পার্স করা খুব কঠিন। জাভাস্ক্রিপ্ট দিয়ে এটি করা অসম্ভব মিশন। ধন্যবাদ HTML5 ফাইল এপিআই থেকে আপনি তার বাইনারি বিষয়বস্তু পড়তে পারেন কিন্তু অর্ডার পার্স এবং এটি ব্যাখ্যা করা আপনি ডুব দিবেন করতে হবে XLS বিন্যাসের নির্দিষ্টকরণের । অফিস 2007 থেকে শুরু করে, মাইক্রোসফ্ট ওপেন এক্সএমএল ফাইল ফর্ম্যাটগুলি ( xslxএক্সেলের জন্য) আলিঙ্গন করেছে যা একটি মান।


@ducktyped, আমি সচেতন নই বা বাইনারি এক্সেল ফাইল পড়ার কোনও জাভাস্ক্রিপ্ট কোডও দেখিনি।
দারিন দিমিত্রভ

13
অসম্ভব মিশন? আমি এটাকে সন্দেহ করি. আমরা যদি ক্লায়েন্ট-সাইড জাভাস্ক্রিপ্টে লিনাক্স কার্নেলটি চালাতে পারি, তবে বাইনারি এক্সেল ফাইলটি পার্স করা সম্ভব হবে। এটা ঠিক যে আমার জ্ঞানের কেউ এখনও এটি করেনি।
জে পি রিচার্ডসন

এখানে MS xls কাঠামো জানতে আগ্রহী জন্য ডকুমেন্টেশন msdn.microsoft.com/en-us/library/office/...
djra

-5

var এক্সেল = নতুন অ্যাক্টিভঅবজেক্ট ("এক্সেল। অ্যাপ্লিকেশন"); var বই = এক্সেল.ওয়ার্কবুকস.ওপেন (আপনার_ফুল_ফায়াল_নাম_দেহ.এক্সএল); var শীট = book.Sheets.I আইটেম (1); var মান = শিট.রেঞ্জ ("এ 1");

যখন আপনি শীট আছে আপনি এক্সেলের মতো করে ভিবিএ ফাংশন ব্যবহার করতে পারেন।


6
এটি কেবল "আমাদের প্রিয় বন্ধু" আইইয়ের সাথে কাজ করে। এবং আমার এইচটিএমএল 5 ব্যবহার করা দরকার। আমাকে কেবল সারি সারি প্রকৃত পাঠ্য সামগ্রী ব্রাউজ করতে হবে।
11:47
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.