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

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

新規登録して質問してみよう
ただいま回答率
85.35%
Vue CLI

Vue CLIは、Vue.jsでアプリケーション開発を行うためのコマンドラインインタフェース(CLI)に基づいた開発ツールです。インタラクティブなプロジェクトの雛形や設定なしで使用できるプロトタイプの作成など、さまざまな機能が用意されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

CORS

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

API

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

Q&A

0回答

958閲覧

Vue-cliのtypescriptプロジェクトでBitbank PrivateAPIのCORSが回避できない

sinsinpurin

総合スコア5

Vue CLI

Vue CLIは、Vue.jsでアプリケーション開発を行うためのコマンドラインインタフェース(CLI)に基づいた開発ツールです。インタラクティブなプロジェクトの雛形や設定なしで使用できるプロトタイプの作成など、さまざまな機能が用意されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

CORS

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

API

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

0グッド

1クリップ

投稿2020/06/26 09:38

編集2020/06/26 11:40

前提・実現したいこと

vue-cliのTypescriptプロジェクトでBitbankAPIを叩く際にCORSが回避できません。
BitbankAPI

corsを無効にした場合のAPIの疎通は確認できています。
どのように回避したらいいのでしょうか。
よろしくお願いします。

発生している問題・エラーメッセージ

Access to XMLHttpRequest at 'https://api.bitbank.cc/v1/user/assets' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

該当のソースコード

node-bitbankccパッケージを使用しています。

vue

1 2<template> 3 <div class="bb-comp"> 4 BitBank API 5 <button @click="testPost">Get Data</button> 6 </div> 7</template> 8 9<script lang="ts"> 10import { Component, Vue } from "vue-property-decorator"; 11import * as BITBANK from "node-bitbankcc"; 12import CONFIG from "@/assets/config.json"; 13 14@Component({ 15 components: {} 16}) 17export default class BBComp extends Vue { 18 19 privateApi = new BITBANK.PrivateApi({ 20 endPoint: "https://api.bitbank.cc/v1", // required 21 apiKey: CONFIG.BITBANK.API_KEY, // required 22 apiSecret: CONFIG.BITBANK.API_SECRET // required 23 }); 24 25 async testPost() { 26 const res = await this.privateApi.getAssets(); 27 console.log(res); 28 } 29} 30</script> 31

試したこと

proxyで回避しようとしましたがうまく行きませんでした

vue.config.js

1module.exports = { 2 devServer: { 3 proxy: { 4 'bitbankAPI': { 5 target: 'https://api.bitbank.cc/v1', 6 } 7 }, 8 } 9}

補足情報(FW/ツールのバージョンなど)

依存関係は以下になります。

package.json

1{ 2 "name": "web3apps", 3 "version": "0.1.0", 4 "private": true, 5 "scripts": { 6 "serve": "vue-cli-service serve", 7 "build": "vue-cli-service build", 8 "lint": "vue-cli-service lint" 9 }, 10 "dependencies": { 11 "axios": "^0.19.2", 12 "core-js": "^3.6.5", 13 "node-bitbankcc": "^2.1.1", 14 "register-service-worker": "^1.7.1", 15 "vue": "^2.6.11", 16 "vue-axios": "^2.1.5", 17 "vue-class-component": "^7.2.3", 18 "vue-property-decorator": "^8.4.2", 19 "vue-router": "^3.2.0", 20 "vuex": "^3.4.0", 21 "web3": "^1.2.9" 22 }, 23 "devDependencies": { 24 "@typescript-eslint/eslint-plugin": "^2.33.0", 25 "@typescript-eslint/parser": "^2.33.0", 26 "@vue/cli-plugin-babel": "^4.4.0", 27 "@vue/cli-plugin-eslint": "^4.4.0", 28 "@vue/cli-plugin-pwa": "^4.4.0", 29 "@vue/cli-plugin-router": "^4.4.0", 30 "@vue/cli-plugin-typescript": "^4.4.0", 31 "@vue/cli-plugin-vuex": "^4.4.0", 32 "@vue/cli-service": "^4.4.0", 33 "@vue/eslint-config-typescript": "^5.0.2", 34 "eslint": "^6.7.2", 35 "eslint-plugin-vue": "^6.2.2", 36 "sass": "^1.26.5", 37 "sass-loader": "^8.0.2", 38 "typescript": "~3.9.3", 39 "vue-template-compiler": "^2.6.11" 40 } 41} 42

HTTP header
header

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

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

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

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

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

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

アカウントをお持ちの方は

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問