PowerShell adalah alat canggih yang membantu Anda menyederhanakan dan mengotomatiskan tugas yang membosankan dan berulang. Administrator biasanya menggunakan PowerShell untuk mengekstrak informasi dari sistem atau database saat kumpulan data yang diperlukan harus disajikan sebagai laporan. Tetapi laporan dalam teks atau file CSV biasanya kurang mencolok dan gaya HTML yang mewah. Dalam tutorial ini, Anda akan belajar cara membuat nn Laporan HTML Dengan PowerShell, Show
PowerShell dapat membantu Anda membuat laporan HTML dan menjauh dari format hambar lainnya ini. Hanya dengan menggunakan PowerShell, Anda dapat membuat laporan menjadi hidup dengan HTML yang memungkinkan Anda membuat presentasi bermakna dari data mentah yang diekstrak dari sistem. Anda bahkan dapat menerapkan Cascading Style Sheets (CSS) untuk menyesuaikan tata letak laporan Anda dengan mudah Dalam artikel ini, Anda akan mempelajari cara menggunakan 6 yang dikombinasikan dengan 7 cmdlet untuk membuat laporan HTML. Anda juga akan mempelajari skrip dasar untuk CSS dan bagaimana hal itu dapat bermanfaat dalam memformat desain laporan berbasis HTML AndaPrasyaratArtikel ini akan menjadi panduan. Jika Anda berniat untuk mengikuti, pastikan Anda telah menyiapkan prasyarat berikut sebelumnya
Membuat Laporan Informasi Dasar Komputer menggunakan ________0______8Untuk mendemonstrasikan cara menggunakan cmdlet _8 dan parameternya, Anda akan membuat skrip yang mendapatkan informasi dasar mesin (seperti Sistem Operasi, Prosesor, BIOS, dan ruang Disk yang tersedia) dan menghasilkan informasi tersebut ke laporan HTMLAnda mulai dengan perintah yang mengumpulkan informasi tentang versi sistem operasi dari mesin. Buka konsol PowerShell Anda lalu salin dan tempel perintah di bawah ini lalu tekan enter untuk menjalankan perintah _Ketika Anda menjalankan perintah di atas, cmdlet _0 mengumpulkan properti dari kelas 1 yang berisi informasi tentang sistem operasi mesin, perintah akan mengembalikan banyak hasil, sehingga diperlukan filter untuk mendapatkan hanya informasi yang relevan. Hasilnya akan terlihat mirip dengan tangkapan layar yang ditunjukkan di bawah iniInformasi Sistem Operasi MesinSekarang setelah Anda mendapatkan perintah untuk mengembalikan informasi sistem operasi, mari ubah hasilnya menjadi kode HTML. Untuk mengonversi hasil (objek) dari perintah di atas dalam kode HTML, Anda dapat menyalurkan keluaran 0 cmdlet ke 8. Jalankan perintah di bawah ini di konsol PowerShell Anda
Anda dapat melihat screenshot berikut di bawah ini bahwa PowerShell secara otomatis menghasilkan tag HTML dari output 0 cmdlet. Hasilnya ditampilkan dalam format tabel, di mana tajuk tabel menampilkan nama properti seperti Versi, Keterangan, NomorBuild, dan Pabrikan. Setiap baris tabel mewakili objek dan menampilkan nilai objek untuk setiap propertiKode HTML yang dihasilkanMengekspor Laporan Ke File HTMLSekarang setelah Anda mendapatkan hasilnya dan dikonversi ke kode HTML, mari ekspor laporan ke file HTML menggunakan cmdlet 5 dan lihat laporan di browser web. Pipa keluaran cmdlet 8 dan tentukan jalur tempat Anda ingin menyimpan laporan menggunakan parameter 7 dan gunakan Basic-Computer-Information-Report. html sebagai nama filenyaBuka PowerShell ISE Anda atau editor teks apa pun, salin kode di bawah ini dan simpan skrip dengan nama file Generate-HTML-Report. Ps1
Jalankan Hasilkan-HTML-Laporan. Skrip Ps1 di Konsol PowerShell Anda
Setelah menjalankan skrip, buka Basic-Computer-Information-Report. html di browser web. Peramban web menginterpretasikan kode laporan HTML dan menampilkan data di layar peramban. Laporan tersebut harus berisi informasi tentang sistem operasi mesin yang mirip dengan tangkapan layar di bawah ini Menggabungkan Laporan Menggunakan Get-CimInstance -Class Win32_OperatingSystem | Select-object Version,Caption,BuildNumber,Manufacturer | ConvertTo-Html | Out-File -FilePath .\Basic-Computer-Information-Report.html_8 ParameterPada titik ini, Anda sekarang memiliki skrip yang mendapatkan informasi tentang sistem operasi mesin dan mengekspor hasilnya ke laporan HTML. Tujuan Anda adalah menambahkan lebih banyak perintah dalam skrip untuk mendapatkan informasi komputer yang tersisa seperti Prosesor, BIOS, Disk, dan Layanan Setiap perintah akan menampilkan informasi komputer berbeda yang diformat sebagai kode HTML. Untuk menggabungkan informasi dengan benar dalam satu laporan HTML tunggal, gunakan parameter 8 untuk mendapatkan bagian tabel hanya dari kode HTML yang dihasilkan oleh cmdlet 8Seperti yang Anda lihat pada tangkapan layar di bawah, PowerShell menghasilkan semua elemen HTML dasar saat output disalurkan ke cmdlet 8Daftar kode HTML yang dihasilkan menggunakan 8 cmdletSaat Anda menggunakan parameter _8, PowerShell hanya menghasilkan elemen tabel HTML. Elemen _4, 5, 6, 7, dan lainnya dihilangkan. Hasilnya ditunjukkan di bawah iniDaftar kode HTML untuk tabel menggunakan parameter FragmentSekarang Anda sudah tahu bagaimana parameter _8 bekerja dari contoh di atas, mari terapkan itu di skripPerintah dalam skrip di bawah ini melakukan hal berikut
Informasi tambahan tentang skrip tersedia di komentar di cuplikan kode di bawah ini. Perbarui skrip dengan kode berikut
Jalankan skrip di konsol PowerShell. Anda dapat melihat output dari laporan seperti yang ditunjukkan di bawah ini Laporan HTML dengan informasi komputer dasarMenambahkan Label Menggunakan #The command below will get the Operating System information, convert the result to HTML code as a table and store it to a variable $OSinfo = Get-CimInstance -Class Win32_OperatingSystem | ConvertTo-Html -Property Version,Caption,BuildNumber,Manufacturer -Fragment #The command below will get the Processor information, convert the result to HTML code as table and store it to a variable $ProcessInfo = Get-CimInstance -ClassName Win32_Processor | ConvertTo-Html -Property DeviceID,Name,Caption,MaxClockSpeed,SocketDesignation,Manufacturer -Fragment #The command below will get the BIOS information, convert the result to HTML code as table and store it to a variable $BiosInfo = Get-CimInstance -ClassName Win32_BIOS | ConvertTo-Html -Property SMBIOSBIOSVersion,Manufacturer,Name,SerialNumber -Fragment #The command below will get the details of Disk, convert the result to HTML code as table and store it to a variable $DiscInfo = Get-CimInstance -ClassName Win32_LogicalDisk -Filter "DriveType=3" | ConvertTo-Html -Property DeviceID,DriveType,ProviderName,VolumeName,Size,FreeSpace -Fragment #The command below will get first 10 services information, convert the result to HTML code as table and store it to a variable $ServicesInfo = Get-CimInstance -ClassName Win32_Service | Select-Object -First 10 |ConvertTo-Html -Property Name,DisplayName,State -Fragment #The command below will combine all the information gathered into a single HTML report $Report = ConvertTo-HTML -Body "$ComputerName $OSinfo $ProcessInfo $BiosInfo $DiscInfo $ServicesInfo" -Title "Computer Information Report" #The command below will generate the report to an HTML file $Report | Out-File .\Basic-Computer-Information-Report.html4 dan #The command below will get the Operating System information, convert the result to HTML code as a table and store it to a variable $OSinfo = Get-CimInstance -Class Win32_OperatingSystem | ConvertTo-Html -Property Version,Caption,BuildNumber,Manufacturer -Fragment #The command below will get the Processor information, convert the result to HTML code as table and store it to a variable $ProcessInfo = Get-CimInstance -ClassName Win32_Processor | ConvertTo-Html -Property DeviceID,Name,Caption,MaxClockSpeed,SocketDesignation,Manufacturer -Fragment #The command below will get the BIOS information, convert the result to HTML code as table and store it to a variable $BiosInfo = Get-CimInstance -ClassName Win32_BIOS | ConvertTo-Html -Property SMBIOSBIOSVersion,Manufacturer,Name,SerialNumber -Fragment #The command below will get the details of Disk, convert the result to HTML code as table and store it to a variable $DiscInfo = Get-CimInstance -ClassName Win32_LogicalDisk -Filter "DriveType=3" | ConvertTo-Html -Property DeviceID,DriveType,ProviderName,VolumeName,Size,FreeSpace -Fragment #The command below will get first 10 services information, convert the result to HTML code as table and store it to a variable $ServicesInfo = Get-CimInstance -ClassName Win32_Service | Select-Object -First 10 |ConvertTo-Html -Property Name,DisplayName,State -Fragment #The command below will combine all the information gathered into a single HTML report $Report = ConvertTo-HTML -Body "$ComputerName $OSinfo $ProcessInfo $BiosInfo $DiscInfo $ServicesInfo" -Title "Computer Information Report" #The command below will generate the report to an HTML file $Report | Out-File .\Basic-Computer-Information-Report.html5 ParameterPada titik ini, skrip sekarang dapat memperoleh semua informasi dasar komputer dan mengekspor hasilnya ke HTML. Namun, seperti yang Anda lihat pada tangkapan layar di atas, seseorang atau penerima laporan mungkin mengalami kesulitan dalam memahami konten saat Anda menghapus anotasi karena informasi tidak diberi label atau dikategorikan dengan benar Dengan menggunakan parameter 4 dan 5, Anda dapat menambahkan label ke setiap tabel sehingga siapa pun dapat dengan mudah membedakan konten laporanParameter _4 menentukan teks yang akan ditambahkan sebelum tag 9 pembuka dan parameter 5 menentukan teks yang akan ditambahkan setelah tag 1 penutup. Nilai yang ditambahkan pada parameter ini tidak secara otomatis diubah menjadi kode Html, jadi Anda perlu menggunakan tag HTML secara eksplisit agar dapat dirender dengan benar sebagai elemen HTMLPerbarui skrip menggunakan perintah di bawah, lalu jalankan skrip di konsol PowerShell Di bawah ini adalah perubahan dalam skrip
Anda dapat melihat dengan sedikit kerja ekstra, laporan dapat terlihat jauh lebih baik, laporan harus diperbarui seperti yang ditunjukkan di bawah ini Mengubah Tata Letak Tabel Menggunakan #The command below will get the name of the computer $ComputerName = "<h1>Computer name: $env:computername</h1>" #The command below will get the Operating System information, convert the result to HTML code as table and store it to a variable $OSinfo = Get-CimInstance -Class Win32_OperatingSystem | ConvertTo-Html -Property Version,Caption,BuildNumber,Manufacturer -Fragment -PreContent "<h2>Operating System Information</h2>" #The command below will get the Processor information, convert the result to HTML code as table and store it to a variable $ProcessInfo = Get-CimInstance -ClassName Win32_Processor | ConvertTo-Html -Property DeviceID,Name,Caption,MaxClockSpeed,SocketDesignation,Manufacturer -Fragment -PreContent "<h2>Processor Information</h2>" #The command below will get the BIOS information, convert the result to HTML code as table and store it to a variable $BiosInfo = Get-CimInstance -ClassName Win32_BIOS | ConvertTo-Html -Property SMBIOSBIOSVersion,Manufacturer,Name,SerialNumber -Fragment -PreContent "<h2>BIOS Information</h2>" #The command below will get the details of Disk, convert the result to HTML code as table and store it to a variable $DiscInfo = Get-CimInstance -ClassName Win32_LogicalDisk -Filter "DriveType=3" | ConvertTo-Html -Property DeviceID,DriveType,ProviderName,VolumeName,Size,FreeSpace -Fragment -PreContent "<h2>Disk Information</h2>" #The command below will get first 10 services information, convert the result to HTML code as table and store it to a variable $ServicesInfo = Get-CimInstance -ClassName Win32_Service | Select-Object -First 10 | ConvertTo-Html -Property Name,DisplayName,State -Fragment -PreContent "<h2>Services Information</h2>" #The command below will combine all the information gathered into a single HTML report $Report = ConvertTo-HTML -Body "$ComputerName $OSinfo $ProcessInfo $BiosInfo $DiscInfo $ServicesInfo" -Title "Computer Information Report" -PostContent "<p>Creation Date: $(Get-Date)<p>" #The command below will generate the report to an HTML file $Report | Out-File .\Basic-Computer-Information-Report.html8 ParameterMungkin, tabel HTML yang dihasilkan memiliki banyak kolom dan Anda ingin mengubah format untuk menampilkan nilai dengan benar sebagai daftar, Anda dapat menggunakan parameter 8. Secara default, saat Anda menyalurkan output ke 0, PowerShell menghasilkan tabel HTML yang menyerupai format tabel Windows PowerShellSeperti yang dapat Anda lihat pada tangkapan layar di bawah, header tabel menampilkan nama properti seperti Version, Caption, Build Number, dan Manufacturer dan setiap baris tabel mewakili objek dan menampilkan nilai objek untuk setiap properti Kode HTML dihasilkan oleh cmdlet ConvertTo-Html yang diformat sebagai TabelUntuk mengubah tata letak tabel menjadi daftar, gunakan parameter 1 lalu diikuti dengan Daftar. PowerShell menghasilkan tabel HTML dua kolom untuk setiap objek yang menyerupai format daftar Windows PowerShell. Kolom pertama menampilkan nama properti seperti Version, Caption, Build Number dan Manufacturer dan kolom kedua menampilkan nilai propertiKode HTML dihasilkan oleh cmdlet ConvertTo-Html yang diformat sebagai DaftarDari contoh di atas, Anda sekarang memiliki gagasan tentang cara mengubah tata letak tabel, mari terapkan parameter 8 dalam skrip kami untuk mengubah tata letak tabel informasi Sistem Operasi, Prosesor, BIOS, dan Disk ke format daftarPerbarui skrip dengan kode berikut di bawah ini. Skrip memiliki parameter _1 di baris perintah untuk Sistem Operasi, Prosesor, BIOS, dan Disk
Setelah menerapkan parameter _1, laporan harus diperbarui seperti yang ditunjukkan di bawah ini. Tata letak tabel untuk informasi Sistem Operasi, Prosesor, BIOS, dan Disk sekarang diubah menjadi daftarLaporan HTML dengan tabel yang diformat sebagai DaftarMeningkatkan Laporan Menggunakan CSSMari bawa laporan ke tingkat selanjutnya dan mulai menambahkan desain menggunakan CSS. CSS digunakan untuk mengontrol tampilan laporan HTML di browser web. CSS mengontrol font, teks, warna, latar belakang, margin, dan tata letak. Di akhir bagian ini, Anda akan dapat melihat bagaimana laporan akan berubah dari format biasa menjadi kaya menggunakan CSS Ada tiga cara untuk menerapkan CSS dalam HTML seperti Inline, Internal dan External. Untuk artikel ini, Anda akan menerapkan metode Internal menggunakan parameter 5 di laporan HTMLParameter _5 menentukan konten tag 5. Tag _5 adalah bagian dari struktur HTML tempat Anda menempatkan kode untuk CSS. Seperti yang Anda lihat pada tangkapan layar di bawah, tag 9 sudah disertakan saat kode HTML dihasilkan oleh cmdlet 8Kode HTML yang menampilkan elemen KepalaSekarang mari gunakan CSS untuk memformat laporan HTML. Pertama, salin kode di bawah ini dan tempel di awal skrip. Kode CSS yang ditetapkan dalam variabel _1 akan mengubah format teks dalam laporan yang ditempatkan dalam tag 3
Selanjutnya, gunakan parameter _5 dan tetapkan variabel 1. Perbarui skrip menggunakan kode di bawah ini
Saat Anda menjalankan skrip, laporan harus diperbarui seperti yang ditunjukkan di bawah ini. Perhatikan bahwa satu-satunya elemen HTML yang terpengaruh adalah 3 yang diterapkan pada label "Nama komputer". Langkah-langkah di atas adalah contoh bagus tentang cara mengontrol atau memanipulasi desain laporan HTML menggunakan CSSUntuk menambahkan lebih banyak desain ke tabel dan label lain yang ditempatkan di tag 5 dalam laporan, terus perbarui variabel 1 dengan kode CSS di bawah ini
Setelah memperbarui dan menjalankan skrip, laporan harus diformat seperti yang ditunjukkan di bawah ini – Berkat CSS, laporan sekarang menarik secara visual dan terlihat profesional Laporan HTML diformat menggunakan CSSMenggunakan Id HTML Dan Atribut Kelas Di CSSElemen HTML adalah blok bangunan dari seluruh laporan HTML Anda, CSS menggunakan elemen ini sebagai pemilih untuk mengetahui di mana gaya harus diterapkan. Dari contoh sebelumnya, kode CSS diterapkan pada elemen HTML 8, 9, dan 0 dalam laporan. Tetapi bagaimana jika Anda perlu menerapkan gaya yang berbeda pada elemen yang berbeda? . Dalam mendesain laporan HTML, Anda dapat menggunakan id atau class untuk menentukan satu elemen
Mari terapkan atribut id dan class dalam laporan HTML. Seperti yang Anda lihat pada cuplikan kode di bawah ini, label tanggal pembuatan ditempatkan di tag 7 0Saat laporan dibuat dan dilihat di browser, label tanggal pembuatan diformat seperti yang ditunjukkan di bawah ini Laporan HTML menunjukkan label tanggal pembuatanUntuk memformat label tanggal pembuatan menggunakan atribut id – Pertama, tetapkan nama id ‘Tanggal Pembuatan‘ ke tag 7. Nama id harus ditempatkan di dalam tag awal. Kode yang diperbarui ditunjukkan di bawah ini _1Kedua, buat kode CSS baru untuk memformat label tanggal pembuatan. Gunakan simbol _3 diikuti dengan nama ID saat mendeklarasikan ID di CSS. Tambahkan kode CSS di bawah ini di variabel 1 lalu simpan dan jalankan skrip di konsol PowerShell _2Setelah menetapkan id dan membuat kode CSS baru yang menargetkan atribut id dari tag 7, laporan harus diperbarui seperti yang ditunjukkan di bawah iniLaporan HTML menunjukkan label tanggal pembuatan yang diformat menggunakan CSS melalui ID sebagai pemilihMari terapkan atribut kelas di tabel informasi Layanan. Menggunakan CSS ubah warna teks menjadi hijau ** saat nilai status Running dan gunakan merah saat nilainya Berhenti Laporan HTML menampilkan tabel Informasi LayananSeperti disebutkan sebelumnya, atribut kelas dapat diberikan ke beberapa elemen HTML. Dalam laporan HTML, elemen yang menyimpan teks Berjalan dan Berhenti adalah tag 6. Menggunakan metode _7 dari PowerShell, tetapkan nama kelas RunningStatus dan StopStatus ke semua tag 6 dalam tabel informasi Layanan. Gunakan perintah di bawah ini dan perbarui skrip _3Add the following CSS code below in the 1 variable. All | tags with a class name of RunningStatus will have the hexadecimal value of 0 which is equivalent to color green, and All | tags with a class name of StopStatus will have the hexadecimal value of 1 which is equivalent to color red. _4Simpan dan Jalankan skrip. Tabel informasi Layanan dalam laporan harus diperbarui seperti yang ditunjukkan di bawah ini Laporan HTML menampilkan tabel Informasi Layanan yang diformat menggunakan CSS melalui pemilih kelasDi bawah ini adalah tata letak akhir dari laporan HTML yang diformat menggunakan CSS Tata letak akhir laporan HTMLDi bawah ini adalah perintah lengkap untuk Hasilkan-HTML-Laporan. Ps1 5KesimpulanDalam artikel ini, Anda telah mempelajari cara mengonversi objek (hasil) ke kode HTML dan membuatnya menjadi laporan HTML Menghasilkan laporan ke format HTML memberi Anda kemampuan untuk menerapkan CSS yang membuat laporan lebih mudah untuk disempurnakan dan dimanipulasi. Ada banyak sumber daya online gratis yang dapat Anda gunakan untuk meningkatkan keterampilan pengkodean HTML dan desain CSS Anda Saya harap artikel ini memberi Anda cukup ide tentang bagaimana Anda dapat membuat dan meningkatkan laporan HTML Anda. Bersulang Bacaan lebih lanjut
Benci iklan? Jelajahi Buku Panduan ATALainnya dari ATA Learning & Partners
|