https://developers.google.com/analytics/devguides/reporting/embed/v1/getting-started
公式のサンプルコードをそのままコピペしてHTMLを起動してみたら、下記のエラーがコンソールログで吐かれました
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('file://') does not match the recipient window's origin ('null').
書いたソースコードは公式のコピペなのですが、こちらです。
html
1<!DOCTYPE html> 2<html> 3<head> 4 <title>Embed API Demo</title> 5</head> 6<body> 7 8<!-- Step 1: Create the containing elements. --> 9 10<section id="auth-button"></section> 11<section id="view-selector"></section> 12<section id="timeline"></section> 13 14<!-- Step 2: Load the library. --> 15 16<script> 17(function(w,d,s,g,js,fjs){ 18 g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(cb){this.q.push(cb)}}; 19 js=d.createElement(s);fjs=d.getElementsByTagName(s)[0]; 20 js.src='https://apis.google.com/js/platform.js'; 21 fjs.parentNode.insertBefore(js,fjs);js.onload=function(){g.load('analytics')}; 22}(window,document,'script')); 23</script> 24 25<script> 26gapi.analytics.ready(function() { 27 28 // Step 3: Authorize the user. 29 30 var CLIENT_ID = '自分のクライアントID(OAuth2.0)'; 31 32 gapi.analytics.auth.authorize({ 33 container: 'auth-button', 34 clientid: CLIENT_ID, 35 }); 36 37 // Step 4: Create the view selector. 38 39 var viewSelector = new gapi.analytics.ViewSelector({ 40 container: 'view-selector' 41 }); 42 43 // Step 5: Create the timeline chart. 44 45 var timeline = new gapi.analytics.googleCharts.DataChart({ 46 reportType: 'ga', 47 query: { 48 'dimensions': 'ga:date', 49 'metrics': 'ga:sessions', 50 'start-date': '30daysAgo', 51 'end-date': 'yesterday', 52 }, 53 chart: { 54 type: 'LINE', 55 container: 'timeline' 56 } 57 }); 58 59 // Step 6: Hook up the components to work together. 60 61 gapi.analytics.auth.on('success', function(response) { 62 viewSelector.execute(); 63 }); 64 65 viewSelector.on('change', function(ids) { 66 var newIds = { 67 query: { 68 ids: ids 69 } 70 } 71 timeline.set(newIds).execute(); 72 }); 73}); 74</script> 75</body> 76</html> 77
ちなみに色々試していたところ上記のコンソールログはjs.src部分をコメントアウトすると消えます。
html
1<script> 2(function(w,d,s,g,js,fjs){ 3 g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(cb){this.q.push(cb)}}; 4 js=d.createElement(s);fjs=d.getElementsByTagName(s)[0]; 5 //js.src='https://apis.google.com/js/platform.js'; 6 fjs.parentNode.insertBefore(js,fjs);js.onload=function(){g.load('analytics')}; 7}(window,document,'script')); 8</script> 9
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。