🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
CSV

CSV(Comma-Separated Values)はコンマで区切られた明白なテキスト値のリストです。もしくは、そのフォーマットでひとつ以上のリストを含むファイルを指します。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

JavaScript

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

2534閲覧

ワードプレスでCSVからテキストの読み込みがしたい!

hikaa

総合スコア19

CSV

CSV(Comma-Separated Values)はコンマで区切られた明白なテキスト値のリストです。もしくは、そのフォーマットでひとつ以上のリストを含むファイルを指します。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

JavaScript

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2019/10/06 10:26

ワードプレスでワードプレス内のメディアフォルダにCSVファイルをアップロードしました。それを記事内で読み込んで、ランダムにテキスト表示をさせたいと考えています。

以前はエラーなくできていたのですが、最近エラーが起きて、何も表示されなくなってしまいました。

調べてみましたが、ワードプレスメディアフォルダ内のURLを記事内で参照しているから不具合が出ている?みたいな理解ですがよくわかっていません。

わかりにくくてすみません・・。たすけていただけると助かります。

ちなみにページです。

http://syopura.com/2019/09/18/%e5%a4%9c%e3%81%ae%e3%82%b7%e3%83%81%e3%83%a5%e3%82%a8%e3%83%bc%e3%82%b7%e3%83%a7%e3%83%b3/ 

以下記事内ソース

javascript

1<script type="text/javascript"> 2 function getCSV(){var req = new XMLHttpRequest(); 3 req.open("get", "https:〇〇.csv", true); 4 req.send(null);req.onload = function(){render_text(req.responseText); }} 5 function render_text(str){var result = []; 6 var tmp = str.split("\n"); 7 var random = Math.floor( Math.random() * (tmp.length-1)); 8 result = tmp[random].split(','); 9 var p_text = document.getElementById("text"); var 10 p_author=document.getElementById("author"); 11 p_text.innerHTML = '"' + result[0] + '"'; 12 p_author.innerHTML = result[1];}getCSV(); </script> 13<div><script>alert("Hello");</script></div>

 
以下エラーコード

Access to XMLHttpRequest at 'https://〇〇.csv' from origin 'http://syopura.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
(index):773 Cross-Origin Read Blocking (CORB) blocked cross-origin response https://〇〇.csv with MIME type text/csv. See https://www.chromestatus.com/feature/5629709824032768 for more details.
getCSV @ (index):773
(anonymous) @ (index):773
prompt-injecter.js:49 Uncaught ReferenceError: recorder is not defined
at prompt-injecter.js:49

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

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

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

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

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

guest

回答2

0

ベストアンサー

httpsとhttpでオリジンが変わるので、どちらかにあわせましょう。(サイトがhttpsになっていないようなのでhttpに書き換えてみてください)

投稿2019/10/07 03:51

kei344

総合スコア69596

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

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

0

kei344さん、解答ありがとうございます。

【httpsとhttpでオリジンが変わるので、どちらかにあわせましょう。】ということだったので、もう一度アドレスを確認しました。

なぜか、ワードプレスの編集画面から記事の表示をした場合は【http】、googleから検索した場合は【https】スタートのアドレスになっていました。

検索から表示した場合は特に問題なくCSVを読み込むことができました。詳しくこちらに書きましたので、参考にしてください。

https://syopura.com/2019/09/21/wordpress%e3%81%a7%e3%80%81%e3%83%87%e3%83%bc%e3%82%bf%e3%83%99%e3%83%bc%e3%82%b9%e3%81%8b%e3%82%89%e3%83%a9%e3%83%b3%e3%83%80%e3%83%a0%e3%81%ab%e6%96%87%e5%ad%97%e3%82%84%e7%b5%b5%e3%82%92%e8%a1%a8/

投稿2019/10/09 09:48

hikaa

総合スコア19

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

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

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

質問する

関連した質問