Power Bi Js Api Example From GitHub

oflok000 — Tue, 30 Jan 2018 21:44:07 GMT

Hello

I was learning Power Bi Js Api from github and then when I start make my example. I got this problem

this is my Code. (I am using angular. I took access code,url,id from sample form github)

// app/app.component.ts

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import * as pbi from 'powerbi-client';


declare const $; 

@Component({
  selector: 'app-root',
  templateUrl:'app.component.html',
  styles: [``]
})
export class AppComponent implements OnInit {
    
    constructor(private http: HttpClient){}
    
    ngOnInit(){ 
        
        this.showReport();
            
    }
    
    showReport() {
    // Report's Secured Token
    let accessToken = 'H4sIAAAAAAAEAB2Wxw6shhJE_-VusUSGwZIX5JwzOzJDzsl6__5G3vei-6iquv79Y6VPP6XFn7__NBYvBIOr0ykKgg-FRvn-3Pa5iS1JnzN7fgswUIA8b96PLi660L_XS9HsrY9ULGBGnPeAWRJNB7jWCUgvuTlqEejfGk6f5iTlzWUfz3FAATeQqbg7eQqL-nPazEfJIf-qqdelQs5YsOV0bls9ZrrkPpmn-22p8L2BBAv8kuUjgcON3Cyo04rMGWZDAnGHlEjr9H2rYm9PV7OFaM4q9VRRV4RTQwE_468LlmJhPlE0iS6zPvz1yVF6t7NbldPkk-ZpnJ5QQxZfJJ4lSUF4Frf381xC4_OwLkJ6tjaMfGQxWEryO9IA41SQ7pxKmIFRDV5_n_dMUBUEo-AaGDM7eA_VJ6CC_DSuFW4N2kJvZZCvY5ydylmwb8qMmVTKX4VzaL5UY7lexoZi-O9UVUIXa9rAVA6KDYN_X8iTLGulhKUjswSrsiWeoZtOvZ-qn3feRmM_wbdWDWPponRcyRbHcOgvTABtglDi3lMOlyXN4KbrgQURy4PO-Og2gYAJVvmmYQAw2gEOj2idj7Yw8txPEe1msF-F6fqUzA9s2ps5EIHy9cRsfZ9YF7EkbZgvSNcZ5UBfNMkP7a63BZmkogg2KJHECG0oed9prPWxdWQNRh1W3OixEipITnYww-ZmSZMc_20vzoVcfwozcwwDu1H6AjJyB5gWlTBOUqFhYrdCCOBbKMvXqRkJtO4N1QJcId3usQNES19Xz5W6n0rEVf4mlYIJ0ZCQmXNadCGqF2EC6-fVEqWbWt0zeYWEBF4BHGRVZ6dLFQgduoafQdm9376-JNTNo_3IXNeqUhC948eZ89bURBMBl51g6di-Zsoh9Fub_OerPL6U2DIgk9Z8AOPm-xtR2uY3vQlo-ImsaT_QcqfiEgZH289SXjmZPJ8q--a2KNvjzcTugnDz48lYxGkoODTqs0UNLaog5R7CmXAEG3RJvkxeZCbstIMv7tDmg8xtaFslyZ9T-AG2TJ7iZE08GMHpEcCG6h27qATYlkHNLldfBuFqM4Xy9bJt3lmFs347qwIgd9Bjz5OsHiPTj_lukP316pr1YNK0tVGr7r7BWcrE5GQu2dvhq49oFHQKJTuXPsrr2sk5yyuDjNU4Wwmh6A1koEyuLKL7mZPQ8BUULjZik4oA_MFptlXmq_r-0rCdy3rv4UC6Wz3T1_0kt3Z92quM-vBnt9vg4Iu0raIci2D2LV7qlVYKZiwlBCpXy0smJUe3GEa3_YyyBxZi_u5OWcbI8rXwFL_G4HDKHQQDRD-nFFU4aLhN9OVyG8endqlSFql-mJbtpkWPeKerevp3t9dAE-2BEPgDPrhJHM9tyEOFqiffsfGk7DHXi4U0t2fb0DRcmLATVtDX5JlvrdJpUcRtWy6QJFGf2EbXD8DQmSbYNF9cM3f6RXfp64HuX45NQuXDh1t2b21ixN6x5_0e72piOrDky2IafIOS9JQelmu0-4KGIAlmuSsLBXL4qSoDy63yBIb21p80_XTdgS3ge5yE8jtWvNmHh0NxIVMN8ehhuXfoktjU21KbSkVtLseLDdX-fDIqk4MMWVek-G7X4tbp5vXshb2FSXapPkPzOlVo8zxqZx0xYXfiO4RbjS6MUgZwB6MHtfdZZveZH0Cm5I4IRxH0syt3l2sZFbpsUh8Ftah738u1h1chgB4u31FddQy38S06OvqObA7ED0O0u8aCJgSoGdXl8H4Gi4g4V06Tsut_XzjikhjKSLNcZaULhAqjs0dhvpgWmSiLkQPff6yzVlZb6krFGBV1YH3cIEFHPIo2rI9hCPdt_JmU80vwZ-eVeadDcD5mjtvFLXzuDSdGrWvYieupSrPaYklS0mXflz8MCxqneKPL4xypjMLNRbkgWJ-bdG2bNPiQWb_G4n0YBPiLJ3QGyCS2YLKak4pGNDF7IGQXrcTLswPlCNKAMunVGDVAzeJdYR5gsU_gvGyRFzgrp8jgXvOjz2eWKLUVUdJns7hlNb6C2Lou7Jbz5XEd69OIqVtBtNxQ5ooLAhoQQYNat5SuGuHth7DeOYWeF5pvs5qaDZMHqN3awzWCpAbYBNwC7zDT3-o6B5onQkTxB4fpHIcm4nvTNI-lY8LNvmEBSZc8_XL98-evP-z6zPukls-vOig6tuuiOkTwdH4VjHnGysmRDRJCwqnwm7DoPg43yAu4ofWwwYNXyBK-R0wqhuMKtUqcsc8N28PjZqltsRonWv6RglQaZA55HsAN-QN13m3yzSaDWqWIy-FWXty7TNtcimH1FaeW2PK0p7DbInaDBXPTDzdHBJPuInd2ZWnmViQDYiXKhmHPltcro7BUQN4WdqitaLFAGr3MeWd3UZJzxl2AVFjFxYdEMcAUPU8QpYkiSCzqTngrdQtWY865m_4uiwhOtIaNp4UH0vFZGHyCRG5nGXugg1jnhkqMwFC2zYKCRoymfyWinQfZ5oj5vUWncuINqOgccAlcJsPakG4fXXzK_uc_zM_c_JQe_Ci_CcwQUYhPTicXMb3sz7SV9H9T7rce0_1Yy99YbSCveGoiCeiomSTyOQEg-woG24FTMuCMgoCIo-NPhaJyYnHuV3hXz-Oo5Fdq4qdU3XZwgktJdnOlagzDhpPzgXUVkO6R_Dyfsh1LNk0f10WMnSgaY3b-TN13LGT1CO8M9xKBaveFuaAH6MMPilcE_80CxPe7wcFx_A7FmuJIs2WcWuNzkX6R5zIJcjr64YBioneeeUq06vWS7maPrbmTJOJHeAIH_vekoVanXe9m0hg19-SXaGHIWDoo81HTfj19pXgzl5e2uFdsGmTnumJkssqLDIZMPFA89gZYchMw-GSVdEdNptIIA5Z4mGHY5BXhuehxS3hVz06Psl6rJBiU92uqP8z_-z8oE56sLgsAAA==';

    // Embed URL
    let embedUrl = 'https://app.powerbi.com/reportEmbed?reportId=bd851208-5592-4e3e-ba72-5cfdfc39f41c&groupId=9166cf8d-d5fc-405e-bdc7-47e414da08fe';

    // Report ID
    let embedReportId = 'bd851208-5592-4e3e-ba72-5cfdfc39f41c';

    var models = pbi.models;
 
// We give All permissions to demonstrate switching between View and Edit mode and saving report.
    var permissions = models.Permissions.All
        
    // Configuration used to describe the what and how to embed.
    // This object is used when calling powerbi.embed.
    // This also includes settings and options such as filters.
    // You can find more information at https://github.com/Microsoft/PowerBI-JavaScript/wiki/Embed-Configuration-Details.
    let config= {
    type: 'report',
    //tokenType: tokenType == '0' ? models.TokenType.Aad : models.TokenType.Embed,
    accessToken: accessToken,
    embedUrl: embedUrl,
    id: embedReportId,
    permissions: permissions,
    settings: {
        filterPaneEnabled: true,
        navContentPaneEnabled: true
    }
}

    // Grab the reference to the div HTML element that will host the report.
    let reportContainer = <HTMLElement>document.getElementById('reportContainer');

    // Embed the report and display it within the div container.
    let powerbi = new pbi.service.Service(pbi.factories.hpmFactory, pbi.factories.wpmpFactory, pbi.factories.routerFactory);
    let report = powerbi.embed(reportContainer, config);

        console.log(report);
        
    // Report.off removes a given event handler if it exists.
    report.off("loaded");

    // Report.on will add an event handler which prints to Log window.
    report.on("loaded", function() {
        console.log("Loaded");
    });
}

        
    
}

I alredy try everithing but I have no idea why my code doesnt work. It's the same code what they have

Re: Power Bi Js Api Example From GitHub

v-ljerr-msft — Wed, 31 Jan 2018 07:59:34 GMT

Hi @oflok000,

I was learning Power Bi Js Api from github and then when I start make my example. I got this problem

this is my Code. (I am using angular. I took access code,url,id from sample form github)

The access token, url, id from the sample won't work in your application/code. You need to use your own access token, url, id.

So you have to create Power BI account, and upload your reports to the created account. Then, you can call Power BI APIs to generate Embed Token for reports, dashboards or tiles you want to embed. For more information about embedding entities using Embed Tokens, please visit Embed Token Documentation.

Regards

Re: Power Bi Js Api Example From GitHub

oflok000 — Wed, 31 Jan 2018 14:28:33 GMT

Hello

Thank you for respond. Actually I can use any accesss tokken my tokken was embed but I found example with access code.

This link https://powerbiembedapi.azurewebsites.net/api/reports/c52af8ab-0468-4165-92af-dc39858d66ad return json with access code.

topic Re: Power Bi Js Api Example From GitHub in Developer

Power Bi Js Api Example From GitHub

Re: Power Bi Js Api Example From GitHub

Re: Power Bi Js Api Example From GitHub