質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
XML

XMLは仕様の1つで、マークアップ言語群を構築するために使われています。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

Q&A

解決済

2回答

2227閲覧

API接続で「XMLHttpRequest : 0」となる場合の対処方法

nekonyangon

総合スコア14

XML

XMLは仕様の1つで、マークアップ言語群を構築するために使われています。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

0グッド

0クリップ

投稿2018/12/05 16:41

編集2018/12/06 01:01

#前提・実現したいこと

行政機関が公表しているAPI(XMLデータ)を利用して、特定のデータを取得・表示するwebアプリを作成しています。APIの公開は2017年6月であり、比較的新しいものです(2018年3月に仕様更新)。
取得・表示する機能はJavascript(ajax)で記述しており、アプリ画面上のボタンをクリックすると当該機能が発動するようになっています。

本件については、HPKPの問題があり、下記スレッドで質問させていただきました。
アドバイスを踏まえてphpで中継プログラムを作成したところ、HPKPに関するエラーメッセージは消え、この点は一応解決しました。

HPKP(HTTP公開鍵ピンニング)を採用したサイトにAPI接続する方法

https://teratail.com/questions/162053

#発生している問題・エラーメッセージ

アプリ画面上のボタンを押して機能を発動させると、Developer Toolsの「Network」には以下が表示され、正常にxmlデータが取得できているように見えます。「Network」の「Response」タブにも、取得したかったxmlデータが表示されています。

<General> Request URL: ●●●

Request Method: GET
**Status Code: 200 **
Remote Address: ●●●
Referrer Policy: no-referrer-when-downgrade

<Response Headers> content-type: application/xml date: Wed, 05 Dec 2018 15:41:21 GMT server: nginx **status: 200** x-powered-by: PHP/7.2.10
<Request Headers> :authority: ●●● :method: GET :path: ●●● :scheme: https accept: application/xml, text/xml, */*; q=0.01 accept-encoding: gzip, deflate, br accept-language: ja,en-US;q=0.9,en;q=0.8 referer: ●●● user-agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36 x-requested-with: XMLHttpRequest _: 1544024458025

しかし、他方で、「Console」には以下が表示され、何度やってもエラー側の処理が実行されてしまいます。

XMLHttpRequest : 0
textStatus : timeout
errorThrown : undefined

#試したこと

現時点のJavascript及びphpのコードは以下のとおりです。
何かよい解決策はないものでしょうか。。

Javascript

1$('#btn').on('click', function(){ 2 $.ajax({ 3 url:'●●●.php', 4 type:'GET', 5 dataType:'xml', 6 cache:false, 7 timeout:1000, 8 error:function(XMLHttpRequest, textStatus, errorThrown) { 9 console.log("ロード失敗"); 10 console.log("XMLHttpRequest : " + XMLHttpRequest.status); 11 console.log("textStatus : " + textStatus); 12 console.log("errorThrown : " + errorThrown.message); 13 }, 14 success:function(xml){ 15 $(xml).find("#●●●").each(function() { 16 $("#result").append("#●●●"); 17 }); 18 } 19 }); 20}); 21

php

1<?php 2 header("Content-type: application/xml"); 3 $url = "●●●"; 4 readfile($url); 5?>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/12/05 20:44

php側のコードは公開可能でしょうか。そちらに何かないとも限りませんし、むしろそちらの方が大事かもしれません。php側のコードのレスポンスの返し方も気になります。タグも「PHP」があったほうが良さそうです。
退会済みユーザー

退会済みユーザー

2018/12/06 00:15

Chrome ⇔ Webサーバー/アプリ ⇔ 他サイトのAPI ・・・という構成だと理解してますが (違ったら指摘ください) そのどこで問題が発生しているのか切り分けられているのですか?
nekonyangon

2018/12/06 01:04

ご指摘ありがとうございます。phpのコード掲載とタグの追加は対応させていただきました。どこで問題が発生しているかという点については、正直なところよくわかっていません。。
guest

回答2

0

ベストアンサー

timeoutしているのですから中継しているphpが正しく返してくれていないだけでは?

投稿2018/12/06 01:10

yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

どこで問題が発生しているかという点については、正直なところよくわかっていません。。

そこを切り分けして問題が「Chrome ⇔ Webサーバー/アプリ ⇔ 他サイトのAPI」のどこで発生しているか特定できないと話が始まらないかと思うのですが?

それができるのは質問者さんだけなので、質問者さんの方でやってもらわないことには第三者は何ともできません。

想像ですが、たぶん「Webサーバー/アプリ ⇔ 他サイトのAPI」の問題ではなかろうかと思います。「他サイトのAPI」から応答が返ってこず、「Chrome ⇔ Webサーバー/アプリ」でタイムアウトしているとか?

「Webサーバー/アプリ」で疑似的に即応答を返すような試験的なコードを書くとか、Fiddler で要求・応答の中身を見るとか、切り分けのためにできることはいろいろありそうですけど。

投稿2018/12/06 02:08

編集2018/12/06 03:29
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問