cross domain accessの解決方法

日本語 ディスカッション 技術的なQ＆A
1 
<iframe id="iframe" src="https://api.ipgeolocation.io/ipgeo?apiKey=ssss&ip=60.134.229.137&fields=country_code3"></iframe>
//例

<script type="text/javascript">

window.onload = function() {
	try {
		var doc = document.getElementsByTagName("iframe")[0].contentWindow.document;
	} catch(e) {
		alert(e);
	}
	alert(doc.body.innerHTML);
}
</script>

このような形でページロード時に外部apiのどこに国からアクセスしているか返してくれるものを使用しているんですが、cross domainのセキュリティの関係でデータが取れません。

こちらどういった解決方法が考えられますでしょうか？

カスタムアプリを作成すれば別途サーバー上で上記を実行してその内容をliquidに表示などしてクロスドメインを回避などできるものなのでしょうか？

ご教授お願いいたします。

2

追記です。

 [
    'method' => 'POST',
    'header' => [
      'Content-Type: application/graphql',
      'X-Shopify-Access-Token: ' . 'apikey_460a20433333333333333'
    ],
    'content' => $query
  ]
];

$context = stream_context_create($options);
$contents = file_get_contents($store_host . '/admin/api/graphql.json', false, $context);

//  get raw data from the request 
$json = file_get_contents('https://api.ipgeolocation.io/ipgeo?apiKey=49506ddc9ad248fdddd9aba816a676b7&ip=60.134.232.17&fields=country_code3');
// Converts json data into a PHP object 
$data = json_decode($json, true);

//echo '

~~~
';

echo "";
?>


customアプリを作成し、

php環境で同様にやってみたのですが、

やはり、liquidで読み込む際に

<script src="[https://hogehoge.com/graphql.php](https://hogehoge.com/graphql.php)"></script>

として読んでるので、

hogehoge.comに対するクロスドメインエラーが出てしまいました。。

他のアプリはいったいどうやって自作したコンテンツをliquid上に展開しているのでしょうか・・
3

Shopify は クロスドメインの iframe の読み込みを禁止する記述を http response header に追加してあるので、 iframe で外部ドメインの利用は難しいかと思います。

liquid テンプレートに記述した js から crossdomain の リクエストで利用できるアクセスもと判別 web APIを利用する。探していませんが、たぶんあると思います。

custom アプリの API等を shop のドメインで配信できる shopify proxies というのがありますが、文字通りproxy なので、リクエストもとの ip が pxoy の ip なってしまい、わからず、このケースだと使えないと思います。

4

ご返信遅くなりましてすいません！そうなんですね！ありがとうございます！調べてみます！