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

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

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

Apacheは、Apache HTTP Serverの略で、最も人気の高いWebサーバソフトウェアの一つです。安定性が高いオープンソースソフトウェアとして商用サイトから自宅サーバまで、多くのプラットフォーム向けに開発・配布されています。サーバーソフトウェアの不具合(NCSA httpd)を修正するパッチ(a patch)を集積、一つ独立したソフトウェアとして開発されました。

PHP

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

JavaScript

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

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

API

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

解決済

PHPでAPI作成[CORSエラー]

poop
poop

総合スコア11

Apache

Apacheは、Apache HTTP Serverの略で、最も人気の高いWebサーバソフトウェアの一つです。安定性が高いオープンソースソフトウェアとして商用サイトから自宅サーバまで、多くのプラットフォーム向けに開発・配布されています。サーバーソフトウェアの不具合(NCSA httpd)を修正するパッチ(a patch)を集積、一つ独立したソフトウェアとして開発されました。

PHP

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

JavaScript

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

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

API

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

1回答

0評価

0クリップ

451閲覧

投稿2022/02/12 11:46

編集2022/02/13 11:19

実現したいこと・エラーの概要

PHPでAPIを作成しています。

PHP

<?php .......... $body = file_get_contents("php://input"); $contents = json_decode($body, true); ..........

等の処理をしたいです。
開発環境では問題ありませんでしたが、本番環境では上手くできませんでした。

検証して以下の部分が上手く動かないことがわかりました。

通常の文字の送信は問題ありませんが、<script />タグが送されるとエラーが出ます。
逆に<script />以外のタグは調べた範囲ではエラーは出ません。

サーバー側での記述

php

<?php header('Content-Type: application/json; charset=UTF-8'); header("Access-Control-Allow-Origin: *"); header("Access-Control-Allow-Headers: X-Requested-With, Origin, X-Csrftoken, Content-Type, Accept"); header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, CONNECT, OPTIONS, TRACE, PATCH, HEAD");

htaccess

Header set Access-Control-Allow-Origin "*" Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept"

呼び出し側

成功時(エラーが出ない時の一例)

javascript

$.post("https://api.example.com/", { test: "<scrdsdipt />" } );

{test: "msg"}や{test: "<br />"}等も問題なく通ります

Headers(一般)

リクエスト URL: https://api.example.com/ リクエスト メソッド: POST ステータス コード: 200 リモート アドレス: ***.***.***.*** 参照ポリシー: strict-origin-when-cross-origin

Response_Headers

accept-ranges: none access-control-allow-headers: X-Requested-With, Origin, X-Csrftoken, Content-Type, Accept access-control-allow-methods: GET, POST, PUT, DELETE, CONNECT, OPTIONS, TRACE, PATCH, HEAD access-control-allow-origin: * content-length: 0 content-type: application/json; charset=UTF-8 date: Sat, 12 Feb 2022 09:31:01 GMT server: Apache vary: Range x-powered-by: PHP/8.0.15

失敗するとき

javascript

$.post("https://api.example.com", { test: "<script />" } );

{test: "<script>"}や{test: "<script>alert('test')</script>"}等も同様にエラー

Headers(一般)

リクエスト URL: https://api.example.com/ リクエスト メソッド: POST ステータス コード: 403 参照ポリシー: strict-origin-when-cross-origin

Response_Headers

accept-ranges: bytes content-length: 1509 content-type: text/html date: Sat, 12 Feb 2022 09:31:04 GMT last-modified: Tue, 25 Jan 2022 07:27:32 GMT server: Apache

Request Headersは失敗時、成功時共通です

Request_Headers

:authority: api.example.com :method: POST :path: / :scheme: https accept: */* accept-encoding: gzip, deflate, br content-length: 17 content-type: application/x-www-form-urlencoded; charset=UTF-8 origin: https://example.com referer: https://example.com/ sec-fetch-dest: empty sec-fetch-mode: cors sec-fetch-site: same-site user-agent: Mozilla/5.0 .......

補足情報

開発環境ではhtaccessを記述しなくても問題なくできました。

ご教授よろしくお願いいたします

追記

エラー時のブラウザの開発ツールのコンソール

javascript

Access to XMLHttpRequest at 'https://api.example.com/' from origin 'https://example.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. jquery-3.6.0.min.js:2 POST https://api.example.com/ net::ERR_FAILED 403

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

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

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

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

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

ockeghem

2022/02/12 12:55

ブラウザの開発ツールを用いて、CORSのエラーメッセージを追記してください。
poop

2022/02/12 14:38

コメントありがとうございます エラー時のコンソールの結果を追記しました

まだ回答がついていません

会員登録して回答してみよう

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

ただいまの回答率
87.20%

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

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

質問する

関連した質問

同じタグがついた質問を見る

Apache

Apacheは、Apache HTTP Serverの略で、最も人気の高いWebサーバソフトウェアの一つです。安定性が高いオープンソースソフトウェアとして商用サイトから自宅サーバまで、多くのプラットフォーム向けに開発・配布されています。サーバーソフトウェアの不具合(NCSA httpd)を修正するパッチ(a patch)を集積、一つ独立したソフトウェアとして開発されました。

PHP

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

JavaScript

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

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

API

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