現在Jsファイルを使ってHTML内にアクセスしたユーザー情報のログを取得するための開発をしております。
そのために、HTMLページのscriptタグ内にJsファイルを配置して、一旦そのJsファイルを発火させて挙動をテストしております。
Jsタグの処理としては以下になります。
①URL上のクエリパラメータを取得し、それを変数に格納
②その変数を引数としてCloud Functions内のPython(Flask)のコードに渡します
その際に表題の通りCORSエラーが出てうまくリクエストを送れずにいます。
Pythonコードの処理としては
①受け取った引数をBigQueryにSQLのINSERTで格納する
といった簡単な処理になっております。
Pythonコードの処理はPostmanからリクエストを送るとCORSエラーは起きず問題なく実行されます。
今回のようなJsを絡めた処理の経験が浅く、設計並びにJsに関して日本語がおかしい箇所もあるかもしれませんが、ご教授頂けると幸いです。よろしくお願いします。
PythonのコードではCORSエラー対策を加えているので、Js側(node.jsのモジュール)などで何か設定をしないといけないのかと考えています。
test.js function getUserid(){ let url = new URL(location.href); let userid = url.searchParams.get('userid'); return userid; } let params = { "userid": getUserid() } let json_params = JSON.stringify(params); let url = "https://test_project.cloudfunctions.net/uploadClick" let request = new XMLHttpRequest(); request.open('POST', url); request.setRequestHeader('Content-Type', 'application/json'); request.onreadystatechange = function () { if (request.onreadystatechange != 4) { console.log("request now"); } else if (request.status != 200) { console.log("request failed"); } else { var result = request.responseText; console.log("request success"); console.log(result); } }; request.send(json_params);
main.py def uploadClick(request): if request.method == 'OPTIONS': headers = { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': 'POST', 'Access-Control-Allow-Headers': 'Content-Type', 'Access-Control-Max-Age': '3600', 'Access-Control-Allow-Credentials': 'true' } return ('', 204, headers) request_json = request.get_json(silent=True) userid = request.args utc_now = datetime.now(timezone('UTC')) jst_now = utc_now.astimezone(timezone('Asia/Taipei')) jst_now = jst_now.isoformat(timespec='seconds') client = bigquery.Client() userid = request.args.get('userid') or '' query = "INSERT `test_project.click_log.click_log_` (userid,timestamp) VALUES ('{0}', '{1}')".format(userid,jst_now) query_job = client.query(query) query_res = query_job.result() headers = { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Credentials': 'true' } return ('Hello World!', 200, headers)
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。