サーバーでホストされているPHPスクリプトを介してCSVコンテンツをダウンロードしようとしています。
これは、テーブルを実行および作成するjqueryコードです。
$(document).ready(function() {
$("#btnSubmit").click(function(){
$.ajax({
type: 'GET',
url: 'http://mydomaincom/wp-content/uploads/get-csv.php',
data: null,
success: function(text) {
var fields = text.split(/\n/);
fields.pop(fields.length-1);
var headers = fields[0].split(','),
html = '<table>';
html += '<tr>';
for(var i = 0; i < headers.length; i += 1) {
html += '<th scope="col">' + headers[i] + '</th>';
}
html += '</tr>';
var data = fields.slice(1, fields.length);
for(var j = 0; j < data.length; j += 1) {
var dataFields = data[j].split(',');
html += '<tr>';
html += '<td>' + dataFields[0] + '</td>';
html += '<td><a href="' + dataFields[1] + '">' + dataFields[1] + '</a></td>';
html += '<td>' + dataFields[2] + '</td>';
html += '</tr>';
}
html += '</table>';
$(html).appendTo('body');
}
});
});
});
get-csv.phpファイルの内容：
<?php
header('Content-Type: text/plain');
$csv = file_get_contents('http://mydomaincom/wp-content/uploads/csv-samples.csv');
echo $csv;
?>
ボタンのコードは次のとおりです。
<!-- Begin Button -->
<div class="demo">
<input id = "btnSubmit" type="submit" value="Get It"/>
</div>
<!-- End Button -->
ブラウザから：http：//mydomaincom/wp-content/uploads/get-csv.phpにアクセスできます-問題ありませんhttp：//mysitecom/wp-content/uploads/csv-samples.csvにアクセスできます-問題ありません
ボタンをクリックしても何も起こりません。
ありがとう
以下に、動作するときにどのように動作するかを確認できる動作スニペットをまとめようとしました...
$(document).ready(function () {
$("#btnSubmit").click(function () {
$.ajax({
type: 'GET',
// url: 'http://mydomaincom/wp-content/uploads/get-csv.php',
// url: 'https://jsonplaceholder.typicode.com/users', // --> JSON
url: "https://data.cdc.gov/api/views/45um-c62r/rows.csv",
data: null,
success: function (text) {
var fields = text.split(/\n/);
fields.pop(fields.length - 1);
var headers = fields[0].split(','), html = '<table>';
html += '<tr>';
for (var i = 0; i < (headers.length,3); i += 1) {
html += '<th scope="col">' + headers[i] + '</th>';
}
html += '</tr>';
var data = fields.slice(1, fields.length);
for (var j = 0; j < data.length; j += 1) {
var dataFields = data[j].split(',');
html += '<tr>';
html += '<td>' + dataFields[0] + '</td>';
html += '<td><a href="' + dataFields[1] + '">' + dataFields[1] + '</a></td>';
html += '<td>' + dataFields[2] + '</td>';
html += '</tr>';
}
html += '</table>';
$(html).appendTo('body');
}
});
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btnSubmit">get data</button>もう少し調べてみると、実際に公開されているCSVデータ（「TBI関連の救急科の訪問、入院、死亡の割合-米国、2001年から2010年」、米国保健社会福祉省）が見つかりました。現在、AJAXプロセスを示すためにそれを使用しています。
したがって、コードは基本的に機能します。もちろん単純化することもできますが、それは重要ではありません。あなたのサイトで遭遇する問題はおそらくCORSに関連していると思います。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加