Q&A
質問者さん、無言ですが、回答が出ているのでそれらに対するフィードバックを返してください。役に立った/立たなかったぐらいはすぐに返せるのでは？ 役に立たなかったならどこがダメかを書くとより期待に近い回答が出てくるかも。とにかく無言は NG です。
実現したいこと
JavaScriptで,同じ階層にあるcsvファイルを読み込みたいのですが,
エラーが出てしまいます。
発生している問題・エラーメッセージ
Access to XMLHttpRequest at '(csvファイルまでのパス)' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https. Failed to load resource: net::ERR_FAILED
該当のソースコード
JavaScript
1function getCSV(){ 2 var req = new XMLHttpRequest(); // HTTPでファイルを読み込むためのXMLHttpRrequestオブジェクトを生成 3 req.open("get", "hoge.csv", true); // アクセスするファイルを指定 4 req.send(null); // HTTPリクエストの発行 5 6 req.onload = function(){ 7 return req.responseText; 8 } 9} 10console.log(getCSV());
html
1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <title>hoge</title> 5 <meta charset="UTF-8"> 6 <script src="test.js"></script> 7 <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> 8</head> 9<body> 10</body> 11</html>
補足情報
csvファイル,htmlファイル,jsファイルは全て同じ階層にあります。
MacBookのchromeで実行しています。
回答2件
2
httpリクエストにはhttpアクセスが必要です。（エラーを辿れば調べはつきます）
https://developer.mozilla.org/ja/docs/Web/HTTP/CORS
ローカルで実行されているなら何らかの手段でWebサーバを立てて
そのWebサーバ内で対応しましょう。
投稿2022/08/16 19:29
総合スコア80586
1
以下の記事が参考になると思います。
【Ajax】ローカルファイルを読み込もうとしたらCORSエラーが発生したので解決した
https://qiita.com/terufumi1122/items/39b2a3659bc585c07f64
エラーメッセージでググってみましょう。
投稿2022/08/17 00:51
総合スコア17909
あなたの回答
tips
プレビュー
